diff options
Diffstat (limited to 'design')
| -rw-r--r-- | design/sass/_global.scss | 4 | ||||
| -rw-r--r-- | design/sass/_src.scss | 17 | ||||
| -rw-r--r-- | design/templates/archives/src_books.html | 32 | ||||
| -rw-r--r-- | design/templates/details/src_book.html | 11 | ||||
| -rw-r--r-- | design/templates/details/src_entry.html | 5 |
5 files changed, 50 insertions, 19 deletions
diff --git a/design/sass/_global.scss b/design/sass/_global.scss index 4195172..f6cc717 100644 --- a/design/sass/_global.scss +++ b/design/sass/_global.scss @@ -82,6 +82,10 @@ h1 { display: none; } +.strike { + text-decoration: line-through; +} + .yes { background: green !important; color: white; diff --git a/design/sass/_src.scss b/design/sass/_src.scss index 1f2a21c..9a37a18 100644 --- a/design/sass/_src.scss +++ b/design/sass/_src.scss @@ -92,3 +92,20 @@ code > .comment::after { display:none; } +#book-page .book-list { + @include constrain_narrow; + @include breakpoint(beta) { + .book-list-item { + width: 45%; + } + } +} +.paypal-form-wrapper { + @include constrain_narrow; + text-align: left; + @include breakpoint(gamma) { + form { + margin: 2em 5em; + } + } +} diff --git a/design/templates/archives/src_books.html b/design/templates/archives/src_books.html index bfaffc0..1100750 100644 --- a/design/templates/archives/src_books.html +++ b/design/templates/archives/src_books.html @@ -1,22 +1,20 @@ {% extends 'src_base.html' %} {% load typogrify_tags %} -{% load comments %} - +{%block bodyid%}id="book-page"{%endblock%} +{%block metadescription%}Book Store | luxagraf:src{%endblock%} {% block primary %} - <main role="main"> - {% for object in object_list %} - <article class="h-entry hentry post--article{% with object.get_template_name_display as t %}{%if t == "double" or t == "double-dark" %} post--article--double{%endif%}{%endwith%}" itemscope itemType="http://schema.org/Article"> - <header id="header" class="post--header {% with object.get_template_name_display as t %}{%if t == "double" or t == "double-dark" %}post--header--double{%endif%}{%endwith%}"> - <img src="{{object.image.url}}" alt="{{object.title}} cover" /> - <h1 class="p-name entry-title post--title" itemprop="headline">{%if object.template_name == 1 or object.template_name == 3 %}{{object.title|smartypants|safe}}{%else%}{{object.title|smartypants|widont|safe}}{%endif%}</h1> - {% if object.slug != 'about' %}<time class="dt-published published dt-updated post--date" datetime="{{object.pub_date|date:'c'}}" itemprop="datePublished">{{object.pub_date|date:"F"}} <span>{{object.pub_date|date:"j, Y"}}</span></time>{%endif%} - {% if object.topics.all %}<span class="src-topics">Topics: {% for topic in object.topics.all%} <a href="/src/topic/{{topic.slug}}">{{topic.name}}</a>{%if forloop.last%}{%else%}, {%endif%}{%endfor%}</span>{%endif%} - <p class="p-author author hide" itemprop="author"><span class="byline-author" itemscope itemtype="http://schema.org/Person"><span itemprop="name">Scott Gilbertson</span></span></p> - </header> - <div id="article" class="e-content entry-content post--body post--body--{% with object.template_name as t %}{%if t == 0 or t == 2 %}single{%endif%}{%if t == 1 or t == 3 %}double{%endif%}{%endwith%}" itemprop="articleBody"> - {{object.body_html|safe|smartypants|widont}} - </div> + <ul class="bl" id="breadcrumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> + <li><a href="/" title="luxagraf homepage" itemprop="url"><span itemprop="title">Home</span></a> → </li> + <li><a href="/src/" title="luxagraf:src" itemprop="url"><span itemprop="title"><code>src</code></span></a> → </li> + <li>Books</li> + </ul> + <main role="main"> + <h1 class="hide">Books</h1> + <div class="book-list"> {% for object in object_list %} + <article class="book-list-item {% cycle "odd" "even" %} {% cycle "uno" "dos" "tres" %}" itemscope itemtype="http://schema.org/Book"> + {% if object.image %}<div class="img-wrapper"><a href="{{object.get_absolute_url}}"><img itemprop="image" src="{{object.image.url}}" alt="cover art for {{object.title}}"/></a></div>{%endif%} + <h2 itemprop="name"><a href="{{object.get_absolute_url}}">{{object.title|amp|smartypants|widont|safe}}</a></h2> </article> - {%endfor%} - </main> + {% endfor %}</div> + </main> {% endblock %} diff --git a/design/templates/details/src_book.html b/design/templates/details/src_book.html index b9715f2..eecac88 100644 --- a/design/templates/details/src_book.html +++ b/design/templates/details/src_book.html @@ -1,6 +1,8 @@ -{% extends 'base.html' %} +{% extends 'src_base.html' %} {% load typogrify_tags %} {%block bodyid%}id="book-page"{%endblock%} +{%block metadescription%}Buy the Book: {{object.title}}{%endblock%} +{%block pagetitle%}{{object.title}} | Books | luxagraf:src{%endblock%} {% block primary %}<ul class="bl" id="breadcrumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <li><a href="/" title="luxagraf homepage" itemprop="url"><span itemprop="title">Home</span></a> → </li> <li><a href="/src/" title="luxagraf:src" itemprop="url"><span itemprop="title"><code>src</code></span></a> → </li> @@ -17,14 +19,21 @@ <dd>{{object.last_updated|date:"F"}} <span>{{object.last_updated|date:"j, Y"}}</span></dd> <dt>Pages</dt> <dd>{{object.pages}}</dd> + <dt>Buy it</dt> + <dd>{%if object.price_sale < object.price%}<span class="strike">${{object.price|floatformat:"0"}}</span> <span class="alert">${{object.price_sale|floatformat:"0"}}</span>{%else%}${{object.price|floatformat:"0" }}{%endif%}</dd> </dl> </div> + <div class="paypal-form-wrapper"> {{paypal_form.render}} + </div> <div class="highlights"> <h4>Learn Responsive Design:</h4> <article class="h-entry hentry post--article book" itemscope itemType="http://schema.org/Article"> {{object.body_html|safe|amp|smartypants}} + + <div class="paypal-form-wrapper"> {{paypal_form.render}} + </div> </article> </div> </main> diff --git a/design/templates/details/src_entry.html b/design/templates/details/src_entry.html index 3d64cf0..e27133a 100644 --- a/design/templates/details/src_entry.html +++ b/design/templates/details/src_entry.html @@ -9,7 +9,10 @@ {%block extrahead%} <link rel="stylesheet" href="/media/src/solarized.css" type="text/css" media="screen"/> {%endblock%} -{% block primary %} +{% block primary %}<ul class="bl" id="breadcrumbs" itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> + <li><a href="/" title="luxagraf homepage" itemprop="url"><span itemprop="title">Home</span></a> → </li> + <li><a href="/src/"><code>src</code></a></li> + </ul> <main role="main"> <article class="h-entry hentry post--article{% with object.get_template_name_display as t %}{%if t == "double" or t == "double-dark" %} post--article--double{%endif%}{%endwith%}" itemscope itemType="http://schema.org/Article"> <header id="header" class="post--header {% with object.get_template_name_display as t %}{%if t == "double" or t == "double-dark" %}post--header--double{%endif%}{%endwith%}"> |