Improve the links at the top of source pages

Adds the RSS icon to the feed links, reusing it from the footer. Also improves the sectile fragments for these pages, by encouraging reuse rather than specialisation.
norm · Jun 2, 2021 · 1e45867 · 1e45867
1 parent 1557c68
commit 1e45867
Show file tree

Hide file tree

Showing 27 changed files with 79 additions and 77 deletions.
diff --git a/fragments/default/source_index_links.html b/fragments/default/source_index_links.html
@@ -0,0 +1,17 @@
+<ul class='links'>
+  [[ sectile insert source_index_links_type.html ]]
+  {% if homepage %}
+    <li><a href='{{homepage}}/'>Homepage</a></li>
+  {% endif %}
+  {% if imdb %}
+    <li><a href='https://www.imdb.com/title/{{imdb}}/'>IMDb</a></li>
+  {% endif %}
+  {% if wikipedia %}
+    <li><a href='https://en.wikipedia.org/wiki/{{wikipedia}}'>Wikipedia</a></li>
+  {% endif %}
+  <li class='atomfeed'><a href='index.atom'>Feed<svg 
+        class='atomfeed' xmlns='http://www.w3.org/2000/svg' aria-label='RSS' 
+        role='img' viewBox='0 0 16 16' width='16' height='16'
+          ><use xlink:href='#atomfeed-icon'
+        /></svg></a></li>
+</ul>
diff --git a/fragments/source/act/body_content.html b/fragments/source/act/body_content.html
@@ -1,13 +1,5 @@
 <h1>{{title}}</h1>
-<ul class='links'>
-  {% if imdb %}
-    <li><a href='https://www.imdb.com/title/{{imdb}}/'>IMDb</a></li>
-  {% endif %}
-  {% if wikipedia %}
-    <li><a href='https://en.wikipedia.org/wiki/{{wikipedia}}'>Wikipedia</a></li>
-  {% endif %}
-  <li><a href='index.atom'>Feed</a></li>
-</ul>
+[[ sectile insert source_index_links.html ]]
 
 <div class='synopsis'>
 {{body}}

diff --git a/fragments/source/act/source_index_links_type.html b/fragments/source/act/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>An act or performer</li>
diff --git a/fragments/source/agency/body_content.html b/fragments/source/agency/body_content.html
@@ -1,10 +1,9 @@
-<h1>NASA</h1>
-<p class='subhead'>
-  Space missions.
-  <a href='index.atom'>Feed</a>.
-</p>
+<h1>{{title}}</h1>
+[[ sectile insert source_index_links.html ]]
 
+<div class='synopsis'>
 {{body}}
+</div>
 
 <ul>
   {% for mission in page.agency_set.filter(type='mission') %}

diff --git a/fragments/source/agency/source_index_links_type.html b/fragments/source/agency/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>A government agency</li>
diff --git a/fragments/source/event/body_content.html b/fragments/source/event/body_content.html
@@ -1,4 +1,5 @@
 <h1>{{title}}</h1>
+[[ sectile insert source_index_links.html ]]
 
 <div class='synopsis'>
 {{body}}

diff --git a/fragments/source/event/source_index_links_type.html b/fragments/source/event/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>An event</li>
diff --git a/fragments/source/game/body_content.html b/fragments/source/game/body_content.html
@@ -1,16 +1,5 @@
 <h1>{{title}} ({{year}})</h1>
-<ul class='links'>
-  {% if homepage %}
-    <li><a href='{{homepage}}'>Homepage</a></li>
-  {% endif %}
-  {% if imdb %}
-    <li><a href='https://www.imdb.com/title/{{imdb}}/'>IMDb</a></li>
-  {% endif %}
-  {% if wikipedia %}
-    <li><a href='https://en.wikipedia.org/wiki/{{wikipedia}}'>Wikipedia</a></li>
-  {% endif %}
-  <li><a href='index.atom'>Feed</a></li>
-</ul>
+[[ sectile insert source_index_links.html ]]
 
 <div class='synopsis'>
 {{body}}

diff --git a/fragments/source/game/source_index_links_type.html b/fragments/source/game/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>A video game</li>
diff --git a/fragments/source/internet/body_content.html b/fragments/source/internet/body_content.html
@@ -1,15 +1,9 @@
 <h1>{{title}}</h1>
+[[ sectile insert source_index_links.html ]]
 
-<ul class='links'>
-  <li>An Internet source</li>
-  <li><a href='{{url}}/'>{{title}}</a></li>
-  {% if wikipedia %}
-    <li><a href='https://en.wikipedia.org/wiki/{{wikipedia}}'>Wikipedia</a></li>
-  {% endif %}
-  <li><a href='index.atom'>Feed</a></li>
-</ul>
-
+<div class='synopsis'>
 {{body}}
+</div>
 
 <ul class='thumbs'>
   {% for gif in page.source_set.all().order_by('published') %}

diff --git a/fragments/source/internet/source_index_links_type.html b/fragments/source/internet/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>An internet source</li>
diff --git a/fragments/source/mission/source_index_links_type.html b/fragments/source/mission/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>A space mission</li>
diff --git a/fragments/source/movie/body_content.html b/fragments/source/movie/body_content.html
@@ -1,13 +1,5 @@
 <h1>{{title}} ({{year}})</h1>
-<ul class='links'>
-  {% if imdb %}
-    <li><a href='https://www.imdb.com/title/{{imdb}}/'>IMDb</a></li>
-  {% endif %}
-  {% if wikipedia %}
-    <li><a href='https://en.wikipedia.org/wiki/{{wikipedia}}'>Wikipedia</a></li>
-  {% endif %}
-  <li><a href='index.atom'>Feed</a></li>
-</ul>
+[[ sectile insert source_index_links.html ]]
 
 <div class='synopsis'>
 {{body}}

diff --git a/fragments/source/movie/source_index_links_type.html b/fragments/source/movie/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>A movie</li>
diff --git a/fragments/source/music-video/body_content.html b/fragments/source/music-video/body_content.html
@@ -1,7 +1,8 @@
 <h1>{{title}}</h1>
+[[ sectile insert source_index_links.html ]]
 
 <div class='synopsis'>
-A music video by <a href='{{page.artist.path}}'>{{page.artist.title}}</a>.
+{{body}}
 </div>
 
 <ul class='thumbs'>

diff --git a/fragments/source/music-video/source_index_links_type.html b/fragments/source/music-video/source_index_links_type.html
@@ -0,0 +1,2 @@
+  <li>A music video by 
+    <a href='{{page.artist.path}}'>{{page.artist.title}}</a></li>
diff --git a/fragments/source/recording-artist/body_content.html b/fragments/source/recording-artist/body_content.html
@@ -1,13 +1,5 @@
 <h1>{{title}}</h1>
-<ul class='links'>
-  {% if imdb %}
-    <li><a href='https://www.imdb.com/title/{{imdb}}/'>IMDb</a></li>
-  {% endif %}
-  {% if wikipedia %}
-    <li><a href='https://en.wikipedia.org/wiki/{{wikipedia}}'>Wikipedia</a></li>
-  {% endif %}
-  <li><a href='index.atom'>Feed</a></li>
-</ul>
+[[ sectile insert source_index_links.html ]]
 
 {{body}}
 

diff --git a/fragments/source/recording-artist/source_index_links_type.html b/fragments/source/recording-artist/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>A recording artist</li>
diff --git a/fragments/source/tv-episode/source_index_links_type.html b/fragments/source/tv-episode/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>An episode of a TV series</li>
diff --git a/fragments/source/tv-show/body_content.html b/fragments/source/tv-show/body_content.html
@@ -1,16 +1,9 @@
 <h1>{{title}}</h1>
-<ul class='links'>
-  <li>A TV series</li>
-  {% if imdb %}
-    <li><a href='https://www.imdb.com/title/{{imdb}}/'>IMDb</a></li>
-  {% endif %}
-  {% if wikipedia %}
-    <li><a href='https://en.wikipedia.org/wiki/{{wikipedia}}'>Wikipedia</a></li>
-  {% endif %}
-  <li><a href='index.atom'>Feed</a></li>
-</ul>
+[[ sectile insert source_index_links.html ]]
 
+<div class='synopsis'>
 {{body}}
+</div>
 
 <ul>
   {% for episode in page.show_set.filter(type='tv-episode').order_by('-season') %}

diff --git a/fragments/source/tv-show/source_index_links_type.html b/fragments/source/tv-show/source_index_links_type.html
@@ -0,0 +1 @@
+  <li>A TV series</li>
diff --git a/fragments/source/youtube/body_content.html b/fragments/source/youtube/body_content.html
@@ -1,12 +1,5 @@
 <h1>{{title}}</h1>
-<p class='subhead'>
-  {% if video %}
-    A <a href='https://www.youtube.com/watch?v={{video}}'>YouTube video</a>.
-  {% elif playlist %}
-    A <a href='https://www.youtube.com/playlist?list={{playlist}}'>YouTube playlist</a>.
-  {% endif %}
-  • <a href='index.atom'>Feed</a>
-</p>
+[[ sectile insert source_index_links.html ]]
 
 <div class='synopsis'>
 {{body}}

diff --git a/fragments/source/youtube/source_index_links_type.html b/fragments/source/youtube/source_index_links_type.html
@@ -0,0 +1,8 @@
+  {% if video %}
+    <li>A
+      <a href='https://www.youtube.com/watch?v={{video}}'>YouTube video</a></li>
+  {% elif playlist %}
+    <li>A
+      <a href='https://www.youtube.com/playlist?list={{playlist}}'>YouTube
+      playlist</a></li>
+  {% endif %}
diff --git a/sass/site.scss b/sass/site.scss
@@ -116,7 +116,7 @@ h1 + div.static > p:first-child {
 }
 
 p.subhead {
-    margin-top: -0.5em;
+    margin-top: 0;
 }
 
 figure {
@@ -353,18 +353,29 @@ ul.links {
             color: #fff;
         }
 
-        &:before {
+        &:after {
             content: '•';
-            padding-right: 4px;
+            padding-left: 4px;
         }
 
-        &:first-child {
-            &:before {
+        &:last-child {
+            &:after {
                 content: '';
                 padding: 0;
             }
         }
     }
+
+    li.atomfeed {
+        position: relative;
+        padding-right: 20px;
+
+        svg {
+            position: absolute;
+            right: 0;
+            top: 3px;
+        }
+    }
 }
 
 ul.tags {

diff --git a/source/eddie-izzard/index.markdown b/source/eddie-izzard/index.markdown
@@ -2,4 +2,6 @@
 title = 'Eddie Izzard'
 source = true
 type = 'act'
+wikipedia = 'Eddie_Izzard'
+imdb = 'nm0412850'
 ```
diff --git a/source/flo-and-joan/index.markdown b/source/flo-and-joan/index.markdown
@@ -2,4 +2,6 @@
 title = 'Flo and Joan'
 source = true
 type = 'act'
+wikipedia = 'Flo_and_Joan'
+imdb = 'nm11256034'
 ```
diff --git a/source/nasa/index.markdown b/source/nasa/index.markdown
@@ -2,4 +2,8 @@
 title = 'NASA'
 type = 'agency'
 source = true
+wikipedia = 'Nasa'
+homepage = 'https://nasa.gov'
 ```
+
+Missions … in … SPAAAAAACE!