Skip to content

Commit

Permalink
reformatted /about
Browse files Browse the repository at this point in the history
  • Loading branch information
@goldfarb
goldfarb committed Nov 27, 2018
1 parent 910d1fe commit e59e0ba
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 24 deletions.
15 changes: 11 additions & 4 deletions less/app.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,16 +48,21 @@ nav, .col-md-12, header, footer {

.question{
font-weight: bold;
text-transform: uppercase;
font-size: 160%;
color: lighten(@novey-blue,70);
margin-top: 10px;
margin-bottom: 5px;
margin-top: 15px;
margin-bottom: 15px;
}
.answer{
margin-bottom: 10px;
line-height: 175%;
a, a:link {
color: lighten(@novey-blue,20);
}
}
#content
{background-color: darken(@novey-blue,10);}


.container{
Expand All @@ -69,6 +74,8 @@ nav, .col-md-12, header, footer {
padding-bottom: 50px;
background-color: darken(@novey-blue,10);
color : white;
max-width: 800px;
margin: auto;
}

// General styles
Expand Down Expand Up @@ -194,13 +201,13 @@ header {
background-color: @dark-gray;
}
&.about {
background-color: mix(@novey-blue, #fff, 60);
background-color: mix(@novey-blue, #fff, 20);
a, a:link{color : darken(@novey-blue, 10%);}
a:hover {color: @novey-blue;}
text-transform: uppercase;
font-size: 70%;
margin-top: 200px;
&.back {margin-top: 120px;}
&.back {margin-top: 160px;}
@media screen and (max-width: @screen-sm) {
margin-top:20px;
&.back {margin-top: 20px;}
Expand Down
33 changes: 13 additions & 20 deletions templates/about.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,14 +72,14 @@ <h2>{{ COPY.content.header_subhead }}</h2>
</div>
<div class="container about">
<div class="row">
<div id="main-content" class="col-md-12">
<div id="main-content" class="col-md-10">
<body>


<div class="question">What is this thing?</div>
<div class="answer"><a href="https://apps.npr.org/best-books-2018/&amp;sa=D&amp;ust=1543080679012000">The Book Concierge</a>
is NPR's annual, interactive, year-end reading guide. Mix and match tags such as
<a href="https://apps.npr.org/best-books-2018/%23/tag/book-club-ideas&amp;sa=D&amp;ust=1543080679012000">Book Club Ideas</a>, <a href="https://apps.npr.org/best-books-2018/%23/tag/biography-and-memoir&amp;sa=D&amp;ust=1543080679013000">Biography &amp; Memoir,</a> or <a href="https://apps.npr.org/best-books-2018/%23/tag/ladies-first&amp;sa=D&amp;ust=1543080679013000">Ladies First</a> to filter results and find the book that's perfect for you or someone you love.</div>
<a href="https://apps.npr.org/best-books-2018/%23/tag/book-club-ideas&amp;sa=D&amp;ust=1543080679012000">Book Club Ideas,</a> <a href="https://apps.npr.org/best-books-2018/%23/tag/biography-and-memoir&amp;sa=D&amp;ust=1543080679013000">Biography &amp; Memoir,</a> or <a href="https://apps.npr.org/best-books-2018/%23/tag/ladies-first&amp;sa=D&amp;ust=1543080679013000">Ladies First</a> to filter results and find the book that's perfect for you or someone you love.</div>

<div class="question">How are the books selected?</div>
<div class="answer">Each fall, we reach out to our staffers and trusted critics and ask them to nominate their favorite books of the year. They respond with hundreds of titles. Then, the editors and producers at NPR Books sit down with a huge spreadsheet of responses; we select our favorites, resolve duplications, note omissions and consider the overall mix and balance of books recommended.</div>
Expand All @@ -95,13 +95,13 @@ <h2>{{ COPY.content.header_subhead }}</h2>

<div class="question">So what's the deal with these tags?</div>
<div class="answer">At NPR Books we&#39;re all about discovery: Helping you find your next great read &mdash; the mystery you can&#39;t put down, the memoir you recommend to all your friends. In 2013 we hashed out a basic taxonomy that was both functional (i.e.,
<a href="https://apps.npr.org/best-books-2018/%23/tag/biography-and-memoir&amp;sa=D&amp;ust=1543080679015000">Biography &amp; Memoir</a> or <a href="https://apps.npr.org/best-books-2018/%23/tag/kids-books&amp;sa=D&amp;ust=1543080679015000">Kids' Books</a> ) and fun (i.e., <a href="https://apps.npr.org/best-books-2018/%23/tag/its-all-geek-to-me&amp;sa=D&amp;ust=1543080679015000">It's All Geek To Me</a>
and <a href="https://apps.npr.org/best-books-2018/%23/tag/lets-talk-about-sex&amp;sa=D&amp;ust=1543080679016000">Let's Talk About Sex</a> <span>). Over the years we've refined our filters and added new tags &mdash; </span> <a href="http://apps.npr.org/best-books-2018/tag_share/the-states-were-in.html&amp;sa=D&amp;ust=1543080679016000">The States We're In</a> and <a href="http://apps.npr.org/best-books-2018/tag_share/no-biz-like-show-biz.html&amp;sa=D&amp;ust=1543080679016000"> No Biz Like Show Biz</a> are the most recent newcomers.</div>
<a href="https://apps.npr.org/best-books-2018/%23/tag/biography-and-memoir&amp;sa=D&amp;ust=1543080679015000">Biography &amp; Memoir</a> or <a href="https://apps.npr.org/best-books-2018/%23/tag/kids-books&amp;sa=D&amp;ust=1543080679015000">Kids' Books</a>) and fun (i.e., <a href="https://apps.npr.org/best-books-2018/%23/tag/its-all-geek-to-me&amp;sa=D&amp;ust=1543080679015000">It's All Geek To Me</a>
and <a href="https://apps.npr.org/best-books-2018/%23/tag/lets-talk-about-sex&amp;sa=D&amp;ust=1543080679016000">Let's Talk About Sex</a>). Over the years we've refined our filters and added new tags &mdash; <a href="http://apps.npr.org/best-books-2018/tag_share/the-states-were-in.html&amp;sa=D&amp;ust=1543080679016000">The States We're In</a> and <a href="http://apps.npr.org/best-books-2018/tag_share/no-biz-like-show-biz.html&amp;sa=D&amp;ust=1543080679016000"> No Biz Like Show Biz</a> are the most recent newcomers.</div>


<div class="question">The names are cute, but what do they mean?</div>
<div class="answer"><a href="https://apps.npr.org/best-books-2018/%23/tag/the-states-were-in&amp;sa=D&amp;ust=1543080679017000">The States We're In</a> is for stories of the American experience both true and fictional.
<a href="https://apps.npr.org/best-books-2018/%23/tag/its-all-geek-to-me&amp;sa=D&amp;ust=1543080679017000">It's All Geek To Me</a> is for deep dives on particular topics -- trees, personality tests, tiny houses, you name it. In <a href="https://apps.npr.org/best-books-2018/%23/tag/the-dark-side&amp;sa=D&amp;ust=1543080679017000">The Dark Side</a> you'll find dystopias, serial killers, true crime and people behaving badly in general. <a href="https://apps.npr.org/best-books-2018/%23/tag/eye-opening-reads&amp;sa=D&amp;ust=1543080679017000">Eye-Opening Reads</a>
<a href="https://apps.npr.org/best-books-2018/%23/tag/its-all-geek-to-me&amp;sa=D&amp;ust=1543080679017000">It's All Geek To Me</a> is for deep dives on particular topics &mdash; trees, personality tests, tiny houses, you name it. In <a href="https://apps.npr.org/best-books-2018/%23/tag/the-dark-side&amp;sa=D&amp;ust=1543080679017000">The Dark Side</a> you'll find dystopias, serial killers, true crime and people behaving badly in general. <a href="https://apps.npr.org/best-books-2018/%23/tag/eye-opening-reads&amp;sa=D&amp;ust=1543080679017000">Eye-Opening Reads</a>
will give you a new perspective on the topic at hand, whether it's the state of philanthropy or a new pair of shoes. </div>


Expand All @@ -115,7 +115,7 @@ <h2>{{ COPY.content.header_subhead }}</h2>

<div class="question">Can I look under the hood?</div>
<div class="answer">If you want to know more about how the Concierge was designed and coded, you can read about the process
<a href="http://blog.apps.npr.org/2013/12/10/the-book-concierge.html&amp;sa=D&amp;ust=1543080679019000">here</a>. And if you're curious to see the code and adapt it for your own project, you can check it out
<a href="http://blog.apps.npr.org/2013/12/10/the-book-concierge.html&amp;sa=D&amp;ust=1543080679019000">here.</a> And if you're curious to see the code and adapt it for your own project, you can check it out
<a href="https://github.com/nprapps/books13&amp;sa=D&amp;ust=1543080679019000">here.</a></div>


Expand All @@ -125,25 +125,18 @@ <h2>{{ COPY.content.header_subhead }}</h2>

<div class="question">This only has books from 2018 - how can I browse books from previous years?</div>
<div class="answer">You can find our picks from
<a href="https://apps.npr.org/best-books-2017/&amp;sa=D&amp;ust=1543080679021000">2017</a>
,
<a href="https://apps.npr.org/best-books-2016/&amp;sa=D&amp;ust=1543080679021000">2016</a>
,
<a href="https://apps.npr.org/best-books-2015/&amp;sa=D&amp;ust=1543080679021000">2015</a>
,
<a href="https://apps.npr.org/best-books-2014/&amp;sa=D&amp;ust=1543080679021000">2014</a>
and
<a href="https://apps.npr.org/best-books-2013/&amp;sa=D&amp;ust=1543080679022000">2013</a>
right here.</div>
<a href="https://apps.npr.org/best-books-2017/&amp;sa=D&amp;ust=1543080679021000">2017,</a>
<a href="https://apps.npr.org/best-books-2016/&amp;sa=D&amp;ust=1543080679021000">2016,</a>
<a href="https://apps.npr.org/best-books-2015/&amp;sa=D&amp;ust=1543080679021000">2015,</a>
<a href="https://apps.npr.org/best-books-2014/&amp;sa=D&amp;ust=1543080679021000">2014</a> and
<a href="https://apps.npr.org/best-books-2013/&amp;sa=D&amp;ust=1543080679022000">2013</a> right here.</div>


<div class="answer">Thanks for visiting the Book Concierge &mdash; we hope you find something wonderful to read today!</div>

<div class="answer">
<a href="https://www.npr.org/people/348743704/beth-novey&amp;sa=D&amp;ust=1543080679022000">Beth Novey</a>
,
<a href="https://www.npr.org/people/2100882/petra-mayer&amp;sa=D&amp;ust=1543080679022000">Petra Mayer</a>
,
<a href="https://www.npr.org/people/348743704/beth-novey&amp;sa=D&amp;ust=1543080679022000">Beth Novey,</a>
<a href="https://www.npr.org/people/2100882/petra-mayer&amp;sa=D&amp;ust=1543080679022000">Petra Mayer,</a>
<a href="https://www.npr.org/people/349241810/rose-friedman&amp;sa=D&amp;ust=1543080679023000">Rose Friedman</a>
and
<a href="https://www.npr.org/people/348764103/ellen-silva&amp;sa=D&amp;ust=1543080679023000">Ellen Silva</a>
Expand Down

0 comments on commit e59e0ba

Please sign in to comment.