diff options
Diffstat (limited to 'design')
-rw-r--r-- | design/sass/_writing_details.scss | 4 | ||||
-rw-r--r-- | design/templates/admin/index.html | 2 | ||||
-rw-r--r-- | design/templates/archives/sightings.html | 56 | ||||
-rw-r--r-- | design/templates/details/entry.html | 6 | ||||
-rw-r--r-- | design/templates/details/sighting.html | 56 |
5 files changed, 122 insertions, 2 deletions
diff --git a/design/sass/_writing_details.scss b/design/sass/_writing_details.scss index 8e011e5..348d617 100644 --- a/design/sass/_writing_details.scss +++ b/design/sass/_writing_details.scss @@ -746,3 +746,7 @@ figure.picwide img.picwide { float: none; } } +.wildlife { + @include constrain_narrow; + text-align: left; +} diff --git a/design/templates/admin/index.html b/design/templates/admin/index.html index 6642012..54f9798 100644 --- a/design/templates/admin/index.html +++ b/design/templates/admin/index.html @@ -25,9 +25,7 @@ td, th { {% block content %} <div id="content-main"> -{% load admin_reorder %} {% if app_list %} - {% app_order %} <div class="module"> <table> <caption><a href="{{ app.app_url }}" class="section" title="{% blocktrans with name=app.name %}Models in the {{ name }} application{% endblocktrans %}">Frequently Used</a></caption> diff --git a/design/templates/archives/sightings.html b/design/templates/archives/sightings.html new file mode 100644 index 0000000..71cd389 --- /dev/null +++ b/design/templates/archives/sightings.html @@ -0,0 +1,56 @@ +{% extends 'base.html' %} +{% load typogrify_tags %} +{% load pagination_tags %} + +{% block pagetitle %}Luxagraf | Plants and Animals seen {% if region %}in {{region.name|title|smartypants|safe}}{%else%}by {{user}}{%endif%}{% if page != "1" %} -- Page {{page}}{%endif%}{% endblock %} +{% block metadescription %}Plants and Animals seen {% if region %} in {{region.name|title|smartypants|safe}}{%else%}by {{user}}{%endif%} Page {{page}}{% endblock %} +{%block bodyid%}id="birds"{%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> + {% if region %}{%if region.name == 'United States'%} <li><a href="{% url 'sightings:list' %}" title="See all" itemprop="url"><span itemprop="title">Plants and Animals</span></a> →</li> + <li itemprop="title">the United States</li>{%else%}<li><a href="/jrnl/" title="See all Journal Entries" itemprop="url"><span>Plants and Animals</span></a> →</li> + <li>{{region.name|title|smartypants|safe}}</li>{%endif%}{%else%}<li>Plants and Animals</li>{%endif%} + </ul> + <main role="main" class="archive">{% autopaginate object_list 40 %} + <h1 class="hide">Plants and Animals seen {% if region %}in {%if region.name == 'United States'%}the United States{%else%}{{region.name|title|smartypants|safe}}{%endif%}{%else%} by {{user}}{%endif%}</h1> {% for object in object_list %} + <article class="{% cycle 'odd' 'even' %} {% cycle 'first' 'second' 'third' %}"> + <div class="post--image"> +{% load get_image_by_size %} +{% load get_image_width %} +<figure> +<a href="{{object.ap.get_absolute_url}}" title="{{object.ap}}"> +<img class="picfull" sizes="(max-width: 680px) 100vw, (min-width: 681) 680px" srcset="{% for size in object.image.sizes.all%}{% get_image_by_size object.image size.name %} {{size.width}}w{% if forloop.last%}"{%else%}, {%endif%}{%endfor%} + {% for size in object.image.sizes.all%}{%if forloop.first %} src="{% get_image_by_size object.image size.name %}"{%endif%}{%endfor%} alt="{{object.image.alt}} photographed by {% if object.image.photo_credit_source %}{{object.image.photo_credit_source}}{%else%}luxagraf{%endif%}" > +</a> +{% if object.image.photo_credit_source %}<figcaption>photo by <a href="{{object.image.photo_credit_url}}">{{object.image.photo_credit_source}}</a></figcaption>{%endif%} +</figure> + </div> + <h3 class="post--title"><a href="{{object.ap.get_absolute_url}}" title="{%if object.title_keywords%}{{object.title_keywords}}{%else%}{{object.ap}}{%endif%}">{{object.ap|safe|smartypants|widont}}</a> (<span class="sci">{{object.ap.scientific_name}}</span>)</h3> + <time class="post--date" datetime="{{object.date|date:'c'}}">Seen: {{object.date|date:"F"}} <span>{{object.date|date:"j, Y"}}</span></time> + <p> + <span class="sighting location place post--location" itemscope itemtype="http://schema.org/Place">Loc: + {% if object.country.name == "United States" %}<span class="p-locality locality">{{object.location.name|smartypants|safe}}</span>, {{object.state.name}}, <span class="p-country-name">U.S.</span>{%else%}<span class="p-region">{{object.location.name|smartypants|safe}}</span>, {{object.country.name}}</a>{%endif%} + <span style="display: none;" itemprop="geo" itemscope itemtype="http://schema.org/GeoCoordinates"> + <data itemprop="latitude" class="p-latitude" value="{{object.latitude}}">{{object.latitude}}</data> + <data itemprop="longitude" class="p-longitude" value="{{object.longitude}}">{{object.longitude}}</data> + </span> + </span> + </p> + <div class="audio-figure">{% for recording in object.ap.recordings.all %} + <audio controls="controls"> + <source src="/media/{{recording.audio}}" /> + </audio> + <small>Audio recorded by {{recording.recorder}} on {{recording.pub_date|date:"F j, Y"}} in {{recording.location}}. <a href="{{recording.link}}">© {{recording.copyright}}</a></small> + </div>{% endfor %} + </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/details/entry.html b/design/templates/details/entry.html index d5038f2..b2a1058 100644 --- a/design/templates/details/entry.html +++ b/design/templates/details/entry.html @@ -53,6 +53,12 @@ class="{%if t == 1 or t == 3 or t == 5 %}double{%else%}single{%endif%}{%if t == <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> + <aside class="wildlife"> + <h3>Fauna and Flora</h3> + <ul>{% for obj in wildlife %} + <li>{{obj}} </li> + {% endfor %}</ul> + </aside> </article> {% with object.get_next_published as next %} {% with object.get_previous_published as prev %} diff --git a/design/templates/details/sighting.html b/design/templates/details/sighting.html new file mode 100644 index 0000000..a9bbef8 --- /dev/null +++ b/design/templates/details/sighting.html @@ -0,0 +1,56 @@ +{% extends 'base.html' %} +{% load get_image_by_size %} +{% block extrahead %} +<style> +#detail-map-canvas { height: 100%;} +</style> +{% endblock %} +{% block bodyid %}class="birds"{%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="{% url 'sightings:list' %}" title="See all" itemprop="url"><span itemprop="title">Plants and Animals</span></a></li> + </ul> + +<main> +<article> +<h1>{{object.common_name}}</h1> +<h2 class="sci">{{object.scientific_name}}</h2> +<h3 class="sci">Family {{object.apclass.scientific_name}} ({{object.apclass}})</h3> +{% load get_image_by_size %} +{% load get_image_width %} +<div class="post--image"> +<figure> +<img class="picfull" sizes="(max-width: 680px) 100vw, (min-width: 681) 680px" srcset="{% for size in sighting.image.sizes.all%}{% get_image_by_size sighting.image size.name %} {{size.width}}w{% if forloop.last%}"{%else%}, {%endif%}{%endfor%} + {% for size in sighting.image.sizes.all%}{%if forloop.first %} src="{% get_image_by_size sighting.image size.name %}"{%endif%}{%endfor%} alt="{{sighting.image.alt}} photographed by {% if sighting.image.photo_credit_source %}{{sighting.image.photo_credit_source}}{%else%}luxagraf{%endif%}" > +{% if sighting.image.photo_credit_source %}<figcaption>photo by <a href="{{sighting.image.photo_credit_url}}">{{sighting.image.photo_credit_source}}</a></figcaption>{%endif%} +</figure> +</div> +{%if recording %} +<div class="audio-figure"> +<audio autoplay="autoplay" controls="controls"> + <source src="/media/{{recording.audio}}" /> +</audio> +<small>Audio recorded by {{recording.recorder}} on {{recording.pub_date|date:"F j, Y"}} in {{recording.location}}. <a href="{{recording.link}}">© {{recording.copyright}}</a></small> +</div> +{%endif%} +<p id="endnode">Seen at {%for sight in sighting %}{{sight.location}}, {{sight.location.comma_name}} in {{sight.date|date:"M Y"}} by {% for person in sight.seen_by.all %}<a href="{% url 'sightings:list_by_person' person %}">{% if person.username == "luxagraf"%}Scott{%else%}{{person.username|capfirst}}{%endif%}</a>{%if forloop.last %}. {%else%}{% if forloop.revcounter == 2 %}, and {%else%}, {%endif%}{%endif%}{%endfor%}{%endfor%} </p> +{% if recording.audio %} +{%endif%} +</article> +</main> +{% endblock %} + +{% block js %} +<script src="/media/js/leaflet-master/leaflet-mod.js"></script> +<script src="/media/js/detail.js"></script> +<script type="text/javascript"> +sightings = []; +{% for s in sighting %} +sightings.push(['{{s.latitude}}', '{{s.longitude}}']); +{% endfor %} +window.onload = function() { + createBirdMap({% for s in sighting %}{% if forloop.first %}{{s.latitude}},{{s.longitude}}{%endif%}{%endfor%}, 5, { type:'point', lat:'{{sighting.latitude}}', lon:'{{sighting.longitude}}'}, sightings); return false; +} +</script> +{% endblock %} |