summaryrefslogtreecommitdiff
path: root/design
diff options
context:
space:
mode:
Diffstat (limited to 'design')
-rw-r--r--design/sass/_archives.scss40
-rw-r--r--design/sass/_comments.scss4
-rw-r--r--design/sass/_details.scss98
-rw-r--r--design/sass/_fonts.scss32
-rw-r--r--design/sass/_global.scss16
-rw-r--r--design/sass/_header.scss12
-rw-r--r--design/sass/_images.scss9
-rw-r--r--design/sass/_mixins.scss6
-rw-r--r--design/sass/_photos.scss9
-rw-r--r--design/templates/base.html3
-rw-r--r--design/templates/details/entry-bak.txt13
-rw-r--r--design/templates/details/page.html3
-rw-r--r--design/templates/essays/entry_detail.txt (renamed from design/templates/details/entry.txt)0
-rw-r--r--design/templates/essays/entry_list.html45
-rw-r--r--design/templates/essays/essay_detail.html173
-rw-r--r--design/templates/essays/essay_list.html25
-rw-r--r--design/templates/jrnl/entry.txt8
-rw-r--r--design/templates/jrnl/entry_detail.html (renamed from design/templates/details/entry.html)13
-rw-r--r--design/templates/lib/img_archive.html1
-rw-r--r--design/templates/lib/img_picfull.html2
20 files changed, 457 insertions, 55 deletions
diff --git a/design/sass/_archives.scss b/design/sass/_archives.scss
index 6e2e66a..a2caba9 100644
--- a/design/sass/_archives.scss
+++ b/design/sass/_archives.scss
@@ -64,6 +64,45 @@
margin: 0;
}
+.archive-list {
+ @include constrain_narrow;
+ @include breakpoint(epsilon) {
+ }
+ text-align: left;
+ h1 {
+ text-align: left;
+ @include fancy_sans;
+ }
+ span {
+ @include fancy_sans;
+ @include smcaps;
+ @include fontsize(13);
+ font-weight: bold;
+ color: #999;
+ }
+ ul {
+ padding: 0;
+ list-style-type: none;
+ }
+ a {
+ text-decoration: none;
+ color: lighten($body_font_color, 20);
+ &:hover {
+ color: $link_color;
+ }
+ }
+ h2 {
+ font-family: $fancy_headline_font_serif;
+ @include fontsize(32);
+ margin: 0;
+ line-height: 1.1;
+ }
+ p {
+ margin: 0;
+ @include fontsize(20);
+ font-family: $fancy_italic;
+ }
+}
// Specific pages vary slightly
// Books
.book-grid {
@@ -228,6 +267,7 @@
}
.post-location {
color: lighten($body_font_light, 5);
+
}
.btn {
@include smcaps;
diff --git a/design/sass/_comments.scss b/design/sass/_comments.scss
index 52ff6b1..45c81dc 100644
--- a/design/sass/_comments.scss
+++ b/design/sass/_comments.scss
@@ -59,8 +59,8 @@
.comment--form--wrapper {
@include constrain_narrow();
- &:before {
- @include faded_line_after;
+ p {
+ font-family: $fancy_headline_font_serif;
}
}
.comment--form--header {
diff --git a/design/sass/_details.scss b/design/sass/_details.scss
index 8cadba4..ffc32f5 100644
--- a/design/sass/_details.scss
+++ b/design/sass/_details.scss
@@ -1,12 +1,31 @@
.detail {
+ #article {
+ padding-bottom: 2rem;
+ border-bottom: 3px double #efefef;
+ }
article {
+ font-family: mffweb, Georgia, 'Times New Roman', serif;
@include constrain_narrow;
margin-top: 4rem;
+ h1 {
+ font-family: mffweb, Georgia, 'Times New Roman', serif;
+ line-height: 1em;
+ letter-spacing: -1px;
+ @include fontsize(48);
+ font-weight: normal;
+ margin-bottom: .25rem
+ }
ul {
text-align: left;
@include fontsize(18);
}
}
+ .post-subtitle {
+ font-family: $fancy_italic;
+ font-size: 1.5rem;
+ line-height: 1;
+ margin-top: .5rem;
+ }
.map {
width: 100vw;
position: relative;
@@ -16,12 +35,39 @@
margin-right: -50vw;
}
.post-header {
+ @include fancy_sans;
+ @include fontsize(18);
+ color: lighten($body_font_color, 20);
+ padding-bottom: 2.6rem;
+ border-bottom: 1px solid #efefef;
@include breakpoint(alpha) {
text-align: left;
}
time {
}
}
+ p:first-of-type {
+ margin-top: 2.6rem;
+ }
+ h4, h5 {
+ @include fancy_sans;
+ margin: 3rem 0 0 0;
+ }
+ h4 + p, .afterward h4 + p {
+ margin-top: .125rem;
+ }
+ h5 {
+ margin: 0
+ }
+ .afterward {
+ font-family: $fancy_italic;
+ h4 {
+ margin-bottom: 0;
+ }
+ }
+ p.small {
+ @include fontsize(18);
+ }
.sci {
text-align: center;
@include fontsize(24);
@@ -33,6 +79,12 @@
@include fontsize(18);
margin-bottom: 2rem;
}
+ ul {
+ list-style: circle;
+ margin-left: 2.5em;
+ list-style-position: outside;
+ margin-bottom: 2.4em;
+ }
// Ack, id selector, so wrong, but easy handles the slightly different footer
// in the dialogue section that lists all the sightings
#endnode {
@@ -69,11 +121,31 @@
margin-right: -49vw;
}
}
-
+h4.post-source {
+ @include fontsize(14);
+ @include smcaps;
+ display: inline-block;
+ margin-top: 0em;
+ padding-top: 1em;
+ padding-bottom: 0em;
+ border-top: 1px solid #efefef;
+ margin-bottom: 0;
+ font-weight: bold;
+ color: #b6b6b6;
+ a {
+ color: #b6b6b6;
+ &:hover {
+ color: $link_color;
+ }
+ }
+}
//### PAGE NAVIGATION ###
+.nav-wrapper {
+ @include constrain_narrow();
+ border-bottom: 3px double #efefef;
+}
#page-navigation {
margin: 2em auto;
- @include constrain_narrow();
text-align: center;
display: table;
ul {
@@ -90,16 +162,18 @@
text-align: center;
}
span {
+ @include fancy_sans;
+ @include fontsize(14);
min-width: 70px;
display: block;
text-align: right;
margin-right: 10px;
- margin-top: 2px;
float: left;
}
a {
display: block;
float: left;
+ font-family: $fancy_headline_font_serif;
text-align: left;
font-style: italic;
color: $brown;
@@ -110,6 +184,7 @@
.entry-footer {
@extend %clearfix;
@include constrain_narrow;
+ border-bottom: 3px double #efefef;
margin-top: 2em;
text-align: left;
h3 {
@@ -148,7 +223,7 @@
}
}
@include breakpoint(beta) {
- margin-bottom: 4em;
+ padding-bottom: 2rem;
#wildlife {
max-width: 55%;
float: left;
@@ -165,14 +240,6 @@
}
aside {
@extend %clearfix;
- margin-bottom: 3em;
- }
- &:after, &:before {
- @include faded_line_after;
- @include breakpoint(beta) {
- display: block;
- margin-bottom: 2em;
- }
}
}
#field_notes {
@@ -197,12 +264,6 @@
margin: 1em auto 0 auto;
padding: 0;
list-style-type: none;
- &:before, &:after {
- @include faded_line_after;
- @include breakpoint(beta) {
- margin-bottom: 2em;
- }
- }
p {
font-size: 1rem;
line-height: 1.4;
@@ -229,7 +290,6 @@ sup {
}
// ### Books ###
-
.book-metadata {
text-align: left;
dd {
diff --git a/design/sass/_fonts.scss b/design/sass/_fonts.scss
index dfe632a..ed4a212 100644
--- a/design/sass/_fonts.scss
+++ b/design/sass/_fonts.scss
@@ -1,10 +1,34 @@
@font-face {
font-family: 'carrois_gothicregular';
- src: url('carroisgothic-regular-webfont.eot');
- src: url('carroisgothic-regular-webfont.eot?#iefix') format('embedded-opentype'),
- url('carroisgothic-regular-webfont.woff') format('woff'),
- url('carroisgothic-regular-webfont.ttf') format('truetype');
+ src: url('/media/fonts/carroisgothic-regular-webfont.eot');
+ src: url('/media/fonts/carroisgothic-regular-webfont.eot?#iefix') format('embedded-opentype'),
+ url('/media/fonts/carroisgothic-regular-webfont.woff') format('woff'),
+ url('/media/fonts/carroisgothic-regular-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
+
+@font-face {
+ font-family: 'mffweb';
+ src: url('/media/fonts/ffmpb.woff2') format('woff2');
+ src: url('/media/fonts/ffmpb.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+@font-face {
+ font-family: 'mffnweb';
+ src: url('/media/fonts/ffmn.woff2') format('woff2');
+ src: url('/media/fonts/ffmn.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
+
+@font-face {
+ font-family: 'mffmbi';
+ src: url('/media/fonts/ffmbi.woff2') format('woff2');
+ src: url('/media/fonts/ffmbi.woff') format('woff');
+ font-weight: 400;
+ font-style: normal;
+}
diff --git a/design/sass/_global.scss b/design/sass/_global.scss
index 6807fa4..20f9056 100644
--- a/design/sass/_global.scss
+++ b/design/sass/_global.scss
@@ -154,6 +154,22 @@ h3 {
line-height: 1.4;
}
}
+h4 {
+ @include fontsize(20);
+ text-align: left;
+ @include breakpoint(gamma){
+ @include fontsize(22);
+ line-height: 1.4;
+ }
+}
+h5 {
+ @include fontsize(16);
+ text-align: left;
+ @include breakpoint(gamma){
+ @include fontsize(18);
+ line-height: 1.4;
+ }
+}
//************** Universals ************************
.hide {
display: none;
diff --git a/design/sass/_header.scss b/design/sass/_header.scss
index 9c00f5e..a4f0386 100644
--- a/design/sass/_header.scss
+++ b/design/sass/_header.scss
@@ -95,12 +95,14 @@ nav[role="navigation"] {
padding: 0.25em 0.5em;
a {
text-decoration: none;
- color: #505050;
+ color: lighten(#505050, 20);
}
ul {
@include smcaps;
+ @include fancy_sans;
+ @include fontsize(13);
max-width: 100%;
- font-weight: 300;
+ font-weight: 600;
margin-top: 0.5em;
margin-bottom: 0.5em;
padding: 0;
@@ -140,7 +142,7 @@ nav[role="navigation"] {
@extend %clearfix;
margin-bottom: 1em;
@include breakpoint(beta) {
- border-bottom: 1px $brown solid;
+ border-bottom: 1px #e4e4e4 solid;
position: relative;
}
@include breakpoint(gamma) {
@@ -149,11 +151,11 @@ nav[role="navigation"] {
margin-right: auto;
}
@include breakpoint(delta) {
- margin-top: 1.5em;
+ margin-top: 1.3rem;
max-width: $breakpoint-delta;
}
@include breakpoint(epsilon) {
- margin-top: 1.5em;
+ margin-top: 1.3rem;
max-width: $max_width;
}
}
diff --git a/design/sass/_images.scss b/design/sass/_images.scss
index 298171e..faf6e88 100644
--- a/design/sass/_images.scss
+++ b/design/sass/_images.scss
@@ -97,3 +97,12 @@ p + .picwide {
width: 100%;
height: 100%;
}
+.pullpicleft {
+ display: none;
+ @include breakpoint(gamma) {
+ display: block;
+ float: left;
+ margin-left: -280px;
+ padding-right: 1rem;
+ }
+}
diff --git a/design/sass/_mixins.scss b/design/sass/_mixins.scss
index 1df6cad..2de8000 100644
--- a/design/sass/_mixins.scss
+++ b/design/sass/_mixins.scss
@@ -5,6 +5,8 @@ $orange: #b53a04;
$link_color: #b53a04;
$headline_font_serif: Georgia, 'Times New Roman', serif;
+$fancy_headline_font_serif: mffweb, Georgia, 'Times New Roman', serif;
+$fancy_italic: mffmbi, Georgia, 'Times New Roman', serif;
$body_p_font: normal 100% / 1.5 Georgia, Cambria, "Times New Roman", Times, serif;
$body_font_color: $brown;
@@ -13,7 +15,7 @@ $body_font_light: #b3aeae;
$archive_p_line_height: 1.6;
//$light;
$narrow-beta-width: 640px;
-$narrow-max-width: 700px;
+$narrow-max-width: 750px;
$max_width: 1440px;
@mixin smcaps {
@@ -49,7 +51,7 @@ $max_width: 1440px;
font-family: sans-serif;
}
@mixin fancy-sans {
- font-family: Helvetica, sans-serif;
+ font-family: mffnweb, Helvetica, sans-serif;
}
@mixin fancy-sans-bold {
font-family: Helvetica, sans-serif;
diff --git a/design/sass/_photos.scss b/design/sass/_photos.scss
index c8fbb95..0ae3b0d 100644
--- a/design/sass/_photos.scss
+++ b/design/sass/_photos.scss
@@ -229,6 +229,15 @@
// }
//}
+.circle-pic {
+ border-radius: 50%;
+ border: 3px solid #000;
+}
+#about-luxagraf .circle-pic {
+ float: left;
+ margin-left: -250px;
+}
+
//lightbox stuff from https://github.com/felixhagspiel/jsOnlyLightbox/blob/master/css/lightbox.scss
/**
diff --git a/design/templates/base.html b/design/templates/base.html
index d0d1618..ffeb1d6 100644
--- a/design/templates/base.html
+++ b/design/templates/base.html
@@ -37,7 +37,8 @@
</header>
<nav role="navigation" class="bl">
<ul>
- <li id="laverdad"><a href="/jrnl/" title="What we've been up to lately">Journal</a></li>
+ <li id="laverdad"><a href="/jrnl/" title="What we've been up to lately">Jrnl</a></li>
+ <li id="laverdad"><a href="/essays/" title="Writings">Essays</a></li>
<!--<li id="nota"><a href="/field-notes/" title="Quick notes and images from the road">Notes</a></li>
<li id="fotos"><a href="/photos/" title="Photos from travels around the world">Photos</a></li>i-->
<!--<li id="maps"><a href="/map" title="Maps">Map</a></li>-->
diff --git a/design/templates/details/entry-bak.txt b/design/templates/details/entry-bak.txt
deleted file mode 100644
index 4244d0e..0000000
--- a/design/templates/details/entry-bak.txt
+++ /dev/null
@@ -1,13 +0,0 @@
----
-template: {{object.get_template_name_display}}
-point: {{object.latitude}},{{object.longitude}}
-location: {{object.location.name|safe}},{{object.state.name|safe}},{{object.country.name|safe}}
-image: {{object.get_image_url}}
-desc: {{object.meta_description|safe}}
-dek: {{object.dek|safe}}
-pub_date: {{object.pub_date}}
-title: {{object.title|safe}}
-
----
-
-{{object.body_markdown|safe}}
diff --git a/design/templates/details/page.html b/design/templates/details/page.html
index d4435b3..d6cc4de 100644
--- a/design/templates/details/page.html
+++ b/design/templates/details/page.html
@@ -3,7 +3,7 @@
{% block pagetitle %}Luxagraf | {{object.title}}{% endblock %}
{% block metadescription %}{{object.meta_description}}{% endblock %}
{%block htmlclass%}class="detail"{%endblock%}
-{%block bodyid%}id="{{object.title|lower}}"{%endblock%}
+{%block bodyid%}id="{{object.title|slugify}}"{%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> &rarr; </li>
@@ -14,6 +14,7 @@
<article>
<header class="post-header">
<h1 class="post-title">{{object.title}}</h1>
+ {%if object.sub_title %}<h2 class="post-subtitle">{{object.sub_title}}</h2>{%endif%}
</header>
<div class="post-article">
{{object.body_html|safe|smartypants|widont}}
diff --git a/design/templates/details/entry.txt b/design/templates/essays/entry_detail.txt
index 547ce79..547ce79 100644
--- a/design/templates/details/entry.txt
+++ b/design/templates/essays/entry_detail.txt
diff --git a/design/templates/essays/entry_list.html b/design/templates/essays/entry_list.html
new file mode 100644
index 0000000..d58bd05
--- /dev/null
+++ b/design/templates/essays/entry_list.html
@@ -0,0 +1,45 @@
+{% extends 'base.html' %}
+{% load typogrify_tags %}
+{% load pagination_tags %}
+
+{% block pagetitle %}Luxagraf | {% if region %}Travel Writing from {{region.name|title|smartypants|safe}}{%else%}Travel Writing from Around the World {%endif%}{% if page != "1" %} -- Page {{page}}{%endif%}{% endblock %}
+{% block metadescription %}{% if region %}Travel writing, essays and dispatches from {{region.name|title|smartypants|safe}}{%else%}Travel writing, essays and dispatches from around the world{%endif%} Page {{page}}{% endblock %}
+{%block bodyid%}id="writing" class="archive"{%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> &rarr; </li>
+ {% if region %}{%if region.name == 'United States'%} <li><a href="/jrnl/" title="See all Journal Entries" itemprop="url"><span itemprop="title">Journal</span></a> &rarr;</li>
+ <li itemprop="title">the United States</li>{%else%}<li><a href="/jrnl/" title="See all Journal Entries" itemprop="url"><span>Journal</span></a> &rarr;</li>
+ <li>{{region.name|title|smartypants|safe}}</li>{%endif%}{%else%}<li>Journal</li>{%endif%}
+ </ul>
+ <main class="archive-grid">
+ <h1 class="hide">{% if region %}Journal entries from {%if region.name == 'United States'%}the United States{%else%}{{region.name|title|smartypants|safe}}{%endif%}{%else%}Journal {%endif%}</h1>{% autopaginate object_list 24 %} {% for object in object_list %}
+ <article class="h-entry hentry archive-card {% cycle 'odd' 'even' %} {% cycle 'first' 'second' 'third' %}" itemscope itemType="http://schema.org/Article">
+ <div class="post-image">
+ <a href="{{object.get_absolute_url}}" title="{{object.title}}">{% if object.featured_image %}
+ {% include "lib/img_archive.html" with image=object.featured_image %}
+ {%else%}
+ <img src="{{object.get_image_url}}" alt="{{ object.title }}" class="u-photo post-image" itemprop="image" />{%endif%}</a>
+ </div>
+ <h2 class="p-name entry-title post-title" itemprop="headline"><a href="{{object.get_absolute_url}}" class="u-url" title="{%if object.title_keywords%}{{object.title_keywords}}{%else%}{{object.title}}{%endif%}">{{object.title|safe|smartypants|widont}}</a></h2>
+ <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>
+ <time class="dt-published published dt-updated post-date" datetime="{{object.pub_date|date:'c'}}">{{object.pub_date|date:"F"}} <span>{{object.pub_date|date:"j, Y"}}</span></time>
+ <p class="post-summary">
+ <span class="p-location h-adr adr post-location" itemprop="contentLocation" itemscope itemtype="http://schema.org/Place">
+ {% if object.country.name == "United States" %}<span class="p-locality locality">{{object.location.name|smartypants|safe}}</span>, <a class="p-region region" href="/jrnl/united-states/" title="travel writing from the United States">{{object.state.name}}</a>, <span class="p-country-name">U.S.</span>{%else%}<span class="p-region">{{object.location.name|smartypants|safe}}</span>, <a class="p-country-name country-name" href="/jrnl/{{object.country.slug}}/" title="travel writing from {{object.country.name}}">{{object.country.name}}</a>{%endif%}
+ </span> &ndash;
+ <span class="p-summary" itemprop="description">
+ {{object.dek|safe}}
+ </span>
+ </p>
+ </article> {% endfor %}
+ </main>
+ <nav class="pagination">
+ {% paginate %}
+ </nav>
+{% endblock %}
+
+
+
+{% block js %}<script src="/media/js/hyphenate.min.js" type="text/javascript"></script>{% endblock%}
diff --git a/design/templates/essays/essay_detail.html b/design/templates/essays/essay_detail.html
new file mode 100644
index 0000000..9aae254
--- /dev/null
+++ b/design/templates/essays/essay_detail.html
@@ -0,0 +1,173 @@
+{% extends 'base.html' %}
+{% load typogrify_tags %}
+{% load comments %}
+
+{% block pagetitle %}{{object.title|title|smartypants|safe}} - Luxagraf, Writing{%comment%}{% if object.country_name == "United States" %}{{object.location_name|smartypants|safe}}, {{object.state_name}}{%else%}{{object.location_name|smartypants|safe}}, {{object.country_name}}{%endif%}{%endcomment%}{% endblock %}
+
+{% block metadescription %}{% autoescape on %}{{object.meta_description|striptags|safe}}{% endautoescape %}{% endblock %}
+{%block extrahead%}
+{% if object.has_code %}
+ <link rel="stylesheet" href="/media/src/solarized.css" type="text/css" media="screen"/>
+{%endif %}
+ <link rel="canonical" href="https://luxagraf.net{{object.get_absolute_url}}" />
+
+ <meta property="og:type" content="article" />
+ <meta property="og:title" content="{{object.title|safe}}" />
+ <meta property="og:url" content="https://luxagraf.net{{object.get_absolute_url}}" />
+ <meta property="og:description" content="{% if object.meta_description %}{{object.meta_description}}{%else%}{{object.sub_title}}{%endif%}" />
+ <meta property="article:published_time" content="{{object.pub_date|date:'c'}}" />
+ <meta property="article:author" content="Scott Gilbertson" />
+ <meta property="og:site_name" content="Luxagraf" />
+ <meta property="og:image" content="{{self.get_featured_image}}" />
+ <meta property="og:locale" content="en_US" />
+ <meta name="twitter:card" content="summary_large_image"/>
+ <meta name="twitter:description" content="{% if object.meta_description %}{{object.meta_description}}{%else%}{{object.sub_title}}{%endif%}"/>
+ <meta name="twitter:title" content="{{object.title|safe}}"/>
+ <meta name="twitter:site" content="@luxagraf"/>
+ <meta name="twitter:domain" content="luxagraf"/>{% if object.featured_image %}
+ <meta name="twitter:image:src" content="{{object.featured_image.get_image_url}}"/>{%endif%}
+ <meta name="twitter:creator" content="@luxagraf"/>
+{%endblock%}
+{%block htmlclass%}{% with object.template_name as t %}
+class="detail {%if t == 1 or t == 3 or t == 5 %}double{%else%}single{%endif%}{%if t == 2 or t == 3 %} dark{%endif%}{%if t == 4 or t == 5 %} black{%endif%}"{%endwith%}{%endblock%}
+
+{%block bodyid %}{% if object.get_post_type_display == 'tools' %}class="src"{% endif %}{%endblock%}
+
+{% block primary %}
+ <main>
+ <article class="h-entry hentry {% 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%}">
+ <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|safe}}{%endif%}</h1>
+ <h2 class="post-subtitle">{{object.sub_title|smartypants|safe}}</h2>
+ <h4 class="post-source">Originally Published By: <a href="{{object.originally_published_by_url}}" title="View {{object.title}} on {{object.originally_published_by}}">{{object.originally_published_by}}</a></h4>
+ <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>
+ <aside class="p-location h-adr adr post-location" itemprop="contentLocation" itemscope itemtype="http://schema.org/Place">
+ {% if object.country.name == "United States" %}<span class="p-locality locality">{{object.location.name|smartypants|safe}}</span>, <a class="p-region region" href="/jrnl/united-states/" title="travel writing from the United States">{{object.state.name|safe}}</a>, <span class="p-country-name">U.S.</span>{%else%}<span class="p-region">{{object.location.name|smartypants|safe}}</span>, <a class="p-country-name country-name" href="/jrnl/{{object.country.slug}}/" title="travel writing from {{object.country.name}}">{{object.country.name|safe}}</a>{%endif%}
+ {% with object.get_template_name_display as t %}{%if t == "single" or t == "single-dark" %} &ndash;&nbsp;<a href="" onclick="showMap({{object.latitude}}, {{object.longitude}}, { type:'point', lat:'{{object.latitude}}', lon:'{{object.longitude}}'}); return false;" title="see a map">Map</a>{%endif%}{%endwith%}
+ </aside>
+ </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}}
+ </div>
+ <div class="afterward">
+ <h4>Afterward</h4>
+ {{object.afterword_html|smartypants|safe}}
+ </div>
+ {%if wildlife or object.field_notes.all or object.books.all %}<div class="entry-footer">{%if wildlife %}
+ <aside id="wildlife">
+ <h3>Fauna and Flora</h3>
+ {% regroup wildlife by ap.apclass.get_kind_display as wildlife_list %}
+ <ul>
+ {% for object_list in wildlife_list %}
+ <li class="grouper">{{object_list.grouper}}<ul>
+ {% for object in object_list.list %}
+ <li>{%if object.ap.body_markdown%}<a href="{% url 'sightings:detail' object.ap.slug %}">{{object}}</a>{%else%}{{object}}{%endif%} </li>
+ {% endfor %}</ul>
+ {% endfor %}</ul>
+ </aside>
+ {% endif %}{%if object.field_notes.all %}
+ <aside {% if wildlife %}class="margin-left-none" {%endif%}id="field_notes">
+ <h3>Field Notes</h3>
+ <ul>{% for obj in object.field_notes.all %}
+ <li><a href="{% url 'sketches:detail' year=obj.pub_date.year month=obj.pub_date|date:"m" slug=obj.slug %}">{{obj}}</a></li>
+ {% endfor %}</ul>
+ </aside>{% endif %}
+ {%if object.books.all %}
+ <aside id="recommended-reading" {%if object.field_notes.all and wildlife %}class="rr-clear{%endif%}" >
+ <h3>Recommended Reading</h3>
+ <ul>{% for obj in object.books.all %}
+ <li><a href="{% url 'books:detail' slug=obj.slug %}"><img src="{{obj.get_small_image_url}}" /></a></li>
+ {% endfor %}</ul>
+ </aside>{% endif %}
+ </div>{%endif%}
+ </article>
+
+ {% comment %} <div class="mailing-list--wrapper">
+ <h5>If you enjoyed this, you should join the mailing&nbsp;list&hellip;</h5>
+ {% include 'mailing_list.html' %}
+ </div> {% endcomment %}
+ </main>
+ {% if object.enable_comments %}
+{% get_comment_count for object as comment_count %}
+{%if comment_count > 0 %}
+<p class="comments--header">{{comment_count}} Comment{{ comment_count|pluralize }}</p>
+{% render_comment_list for object %}
+{%endif%}
+{% render_comment_form for object %}
+{% else %}
+<p class="comments--header" style="text-align: center">Sorry, comments have been disabled for this post.</p>
+{%endif%}
+{% endblock %}
+{% block js %}
+<script type="text/javascript">
+document.addEventListener("DOMContentLoaded", function(event) {
+ var leaflet = document.createElement('script');
+ leaflet.src = "/media/js/leaflet-master/leaflet-mod.js";
+ document.body.appendChild(leaflet);
+ var lightbox = document.createElement('script');
+ lightbox.src = "/media/js/lightbox.js";
+ document.body.appendChild(lightbox);
+ leaflet.onload = function(){
+ var detail = document.createElement('script');
+ detail.src = "/media/js/detail.min.js";
+ document.body.appendChild(detail);
+ {% with object.get_template_name_display as t %}{%if t == "single" or t == "single-dark" %}
+ detail.onload = function(){
+ createMap();
+ var open = false;
+ }
+ {%endif%}{%endwith%}
+ }
+
+ lightbox.onload = function() {
+ var opts= {
+ //nextOnClick: false,
+ captions: true,
+ onload: function(){
+ var im = document.getElementById("jslghtbx-contentwrapper");
+ var link = im.appendChild(document.createElement('a'))
+ link.href = im.firstChild.src;
+ link.innerHTML= "open ";
+ link.target = "_blank";
+ link.setAttribute('class', 'p-link');
+ im.appendChild(link);
+ }
+ };
+ var lightbox = new Lightbox();
+ lightbox.load(opts);
+ }
+ {% if object.enable_comments %}
+{% get_comment_count for object as comment_count %}
+{%if comment_count > 0 %}
+ //delay loading of gravatar images using noscript data-hash attribute
+ dataattr = document.getElementsByClassName("datahashloader");
+ for(var i=0; i<dataattr.length; i++) {
+ var c = dataattr[i].parentNode;
+ var img = document.createElement("img");
+ img.src = 'https://images.luxagraf.net/gravcache/' + dataattr[i].getAttribute('data-hash') + '.jpg';
+ img.className += "gravatar";
+ c.insertBefore(img, c.childNodes[3]);
+ }
+{%endif%}
+{%endif%}
+{% if object.has_video %}
+var tester = document.getElementsByClassName("vidauto");
+var wrapper = document.getElementById('wrapper');
+var dist = 100;
+
+window.onscroll = function() {
+ for (var i=0; i<tester.length; i++) {
+ checkVisible(tester[i]) ? tester[i].play() : tester[i].pause();
+ }
+};
+
+function checkVisible(elm) {
+ var rect = elm.getBoundingClientRect();
+ var viewHeight = Math.max(document.documentElement.clientHeight, window.innerHeight);
+ return !(rect.bottom < 0 || rect.top - viewHeight >= 0);
+}
+{%endif%}
+
+});
+</script>
+{%endblock%}
diff --git a/design/templates/essays/essay_list.html b/design/templates/essays/essay_list.html
new file mode 100644
index 0000000..6ea89a3
--- /dev/null
+++ b/design/templates/essays/essay_list.html
@@ -0,0 +1,25 @@
+{% extends 'base.html' %}
+{% load typogrify_tags %}
+{% load comments %}
+
+{% block pagetitle %}Luxagraf | {{essay_type}}{% endblock %}
+
+{% block metadescription %}Luxagraf — Collected writing: essays on ecosophia, mediation, life, photography, tools, walking, and other ephemera.{% 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> &rarr; </li>
+ <li>{{essay_type|capfirst}}</li>
+ </ul>
+ <main role="main" id="essay-archive" class="essay-archive archive-list">
+ <h1 class="topic-hed">{{essay_type.name|capfirst}}</h1>
+ <h6>{{essay_type.dek}}</h6>
+ <ul>{% for object in object_list %}
+ <li class="h-entry hentry" itemscope itemType="http://schema.org/Article">
+ <span class="date dt-published">{{object.pub_date|date:"F Y"}}</span>
+ <a href="{{object.get_absolute_url}}">
+ <h2>{{object.title|safe|smartypants|widont}}</h2>
+ <p class="p-summary">{% if object.sub_title %}{{object.sub_title|safe|smartypants}}{%else%}{{object.metadescription}}{%endif%}</p>
+ </a>
+ </li>
+ {%endfor%}</ul>
+ </main>
+{%endblock%}
diff --git a/design/templates/jrnl/entry.txt b/design/templates/jrnl/entry.txt
new file mode 100644
index 0000000..547ce79
--- /dev/null
+++ b/design/templates/jrnl/entry.txt
@@ -0,0 +1,8 @@
+{{object.title|safe}}
+{% for letter in object.title %}={%endfor%}
+
+ by Scott Gilbertson
+ <{{SITE_URL}}{{object.get_absolute_url}}>
+ {{object.pub_date|date:"l, d F Y"}}
+
+{{object.body_markdown|safe}}
diff --git a/design/templates/details/entry.html b/design/templates/jrnl/entry_detail.html
index 2804da3..c7ad0a6 100644
--- a/design/templates/details/entry.html
+++ b/design/templates/jrnl/entry_detail.html
@@ -38,18 +38,17 @@ class="detail {%if t == 1 or t == 3 or t == 5 %}double{%else%}single{%endif%}{%i
<main>
<article class="h-entry hentry {% 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%}">
- <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>
+ <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|safe}}{%endif%}</h1>
<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>
- <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>
<aside class="p-location h-adr adr post-location" itemprop="contentLocation" itemscope itemtype="http://schema.org/Place">
{% if object.country.name == "United States" %}<span class="p-locality locality">{{object.location.name|smartypants|safe}}</span>, <a class="p-region region" href="/jrnl/united-states/" title="travel writing from the United States">{{object.state.name|safe}}</a>, <span class="p-country-name">U.S.</span>{%else%}<span class="p-region">{{object.location.name|smartypants|safe}}</span>, <a class="p-country-name country-name" href="/jrnl/{{object.country.slug}}/" title="travel writing from {{object.country.name}}">{{object.country.name|safe}}</a>{%endif%}
{% with object.get_template_name_display as t %}{%if t == "single" or t == "single-dark" %} &ndash;&nbsp;<a href="" onclick="showMap({{object.latitude}}, {{object.longitude}}, { type:'point', lat:'{{object.latitude}}', lon:'{{object.longitude}}'}); return false;" title="see a map">Map</a>{%endif%}{%endwith%}
</aside>
</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}}
+ {{object.body_html|safe|smartypants}}
</div>
- <div class="entry-footer">{%if wildlife %}
+ {%if wildlife or object.field_notes.all or object.books.all %}<div class="entry-footer">{%if wildlife %}
<aside id="wildlife">
<h3>Fauna and Flora</h3>
{% regroup wildlife by ap.apclass.get_kind_display as wildlife_list %}
@@ -75,11 +74,12 @@ class="detail {%if t == 1 or t == 3 or t == 5 %}double{%else%}single{%endif%}{%i
<li><a href="{% url 'books:detail' slug=obj.slug %}"><img src="{{obj.get_small_image_url}}" /></a></li>
{% endfor %}</ul>
</aside>{% endif %}
- </div>
+ </div>{%endif%}
</article>
{% with object.get_next_published as next %}
{% with object.get_previous_published as prev %}
- <nav id="page-navigation">
+ <div class="nav-wrapper">
+ <nav id="page-navigation" {%if wildlife or object.field_notes.all or object.books.all %}{%else%}class="page-border-top"{%endif%}>
<ul>{% if prev%}
<li id="prev"><span class="bl">Previous:</span>
<a href="{{ prev.get_absolute_url }}" rel="prev" title=" {{prev.title}}">{{prev.title|safe}}</a>
@@ -89,6 +89,7 @@ class="detail {%if t == 1 or t == 3 or t == 5 %}double{%else%}single{%endif%}{%i
</li>{%endif%}
</ul>
</nav>{%endwith%}{%endwith%}
+ </div>
{% comment %} <div class="mailing-list--wrapper">
<h5>If you enjoyed this, you should join the mailing&nbsp;list&hellip;</h5>
diff --git a/design/templates/lib/img_archive.html b/design/templates/lib/img_archive.html
index 22b0cce..c256ebe 100644
--- a/design/templates/lib/img_archive.html
+++ b/design/templates/lib/img_archive.html
@@ -1,4 +1,3 @@
-{% load get_image_by_size %}
<img sizes="(max-width: 728px) 100vw, (min-width: 729px) 520px"
srcset="{{image.get_featured_jrnl}} 520w, {{image.get_picwide_sm}} 720w"
src="{{image.get_featured_jrnl}}"
diff --git a/design/templates/lib/img_picfull.html b/design/templates/lib/img_picfull.html
index 98e8dc4..babcc76 100644
--- a/design/templates/lib/img_picfull.html
+++ b/design/templates/lib/img_picfull.html
@@ -2,7 +2,7 @@
{% load get_image_width %}
{% if caption %}
<figure class="picfull">{%endif%}
-<a href="{%get_image_by_size image "original"%} " title="view larger image"><img class="picfull" sizes="(max-width: 680px) 100vw, (min-width: 681) 680px" srcset="{% for size in image.sizes.all%}{% get_image_by_size image size.name %} {% if image.is_portait %}{% get_image_width image size.height %}w{%else%}{{size.width}}w{%endif%}{% if forloop.last%}"{%else%}, {%endif%}{%endfor%}
+<a href="{%get_image_by_size image "original"%} " title="view larger image"><img class="picfull" sizes="(max-width: 680px) 100vw, (min-width: 681) 750px" srcset="{% for size in image.sizes.all%}{% get_image_by_size image size.name %} {% if image.is_portait %}{% get_image_width image size.height %}w{%else%}{{size.width}}w{%endif%}{% if forloop.last%}"{%else%}, {%endif%}{%endfor%}
{% for size in image.sizes.all%}{%if forloop.first %} src="{% get_image_by_size image size.name %}"{%endif%}{%endfor%} alt="{{image.alt}} photographed by {% if image.photo_credit_source %}{{image.photo_credit_source}}{%else%}luxagraf{%endif%}" data-jslghtbx="{%get_image_by_size image "original"%}" data-jslghtbx-group="group" {% if caption%}data-jslghtbx-caption="{{image.caption}}"{%endif%}></a>
{% if caption %}<figcaption>{{image.caption|safe}}</figcaption>
</figure>