Initial copy of theme from personal website to separate repo

author: Fabian Tamp <fabian.tamp@gmail.com> 2019-09-21 21:02:23 +0300
committer: Fabian Tamp <fabian.tamp@gmail.com> 2019-09-21 21:02:23 +0300
commit: 175fab5477aa833e43472a0c4a9134f495f63960 (patch)
tree: 2ac5c336b33545f44bafb4851936bf35afd84599
parent: faa6504d39e364311ad95e9507e45987919ee610 (diff)
25 files changed, 963 insertions, 0 deletions
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..3e540ec
--- /dev/null
+++ b/README.md
@@ -0,0 +1,12 @@
+# capnfabs-lite
+
+The theme in use on capnfabs.net.
+
+This _probably_ isn't ready for drop-in production use (hence why it hasn't been published on the Hugo themes site), but it's got a couple of interesting ideas that I wanted to make available for other people to borrow.
+
+Those features are:
+
+- A mechanism for excluding source images after they've been processed or resized, and
+- Visual differentiation for drafts.
+
+The explanation for how it all works is in [this blog post](https://capnfabs.net/posts/hugo-theme-exclude-processed-images/), so take a look there for the comprehensive explanation, and what you need to do to integrate these ideas into your own themes.
diff --git a/buildscripts/drop-resources.py b/buildscripts/drop-resources.py
new file mode 100755
index 0000000..ffe7f50
--- /dev/null
+++ b/buildscripts/drop-resources.py
@@ -0,0 +1,41 @@
+#!/usr/bin/env python3
+import sys
+import os
+import pathlib
+import typing
+
+def die(msg):
+    print(msg)
+    exit(1)
+
+def line_to_path(base_path, line):
+    path = pathlib.Path(base_path, line.lstrip('/'))
+    return path
+
+def get_filenames_from_droplist(base_path, path):
+    lines = path.read_text().strip().splitlines()
+    return [line_to_path(base_path, line) for line in lines if line]
+
+def drop_paths(paths, output_dir):
+    for f in paths:
+        assert f.is_file()
+        f.unlink()
+        print(f"Removed {f.relative_to(output_dir)}")
+
+def main():
+    if len(sys.argv) != 2:
+        die(f'Usage: {sys.argv[0]} [hugo-output-directory]')
+
+    output_dir = pathlib.Path(sys.argv[1])
+
+    if not output_dir.is_dir():
+        die(f'{output_dir} must be a hugo output directory')
+
+    all_droplists = list(output_dir.rglob('*.droplist'))
+    all_files_to_drop = [f for droplist in all_droplists for f in get_filenames_from_droplist(output_dir, droplist)]
+    drop_paths(all_files_to_drop, output_dir)
+    drop_paths(all_droplists, output_dir)
+
+
+if __name__ == "__main__":
+    main()
diff --git a/config.toml b/config.toml
new file mode 100644
index 0000000..eba7dba
--- /dev/null
+++ b/config.toml
@@ -0,0 +1,10 @@
+[mediaTypes]
+  [mediaTypes."text/droplist"]
+    suffixes = ["droplist"]
+
+[outputFormats.droplist]
+mediatype = "text/droplist"
+isPlainText = true
+
+[outputs]
+page = ["HTML", "droplist"]
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
new file mode 100644
index 0000000..f32d502
--- /dev/null
+++ b/layouts/_default/baseof.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html>
+  {{- partial "head.html" . -}}
+  <body>
+    {{- partial "header.html" . -}}
+    <div id="content">{{- block "main" . }}{{ -end }}</div>
+    {{- partial "footer.html" . -}}
+  </body>
+</html>
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
new file mode 100644
index 0000000..dd0b7a3
--- /dev/null
+++ b/layouts/_default/list.html
@@ -0,0 +1,30 @@
+{{ partial "header.html" . }}
+<body
+  lang="{{ .Site.LanguageCode }}" >
+  <div class="nav-bkg">
+    <nav class="content-container pagewide-bar-padding">
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}" >{{ .Site.Title  }}</a>
+      {{ partial "right-links" . }}
+    </nav>
+  </div>
+  <section id="main" class="content-container article-pad-v">
+    <div>
+      <h1 id="title" style="margin-bottom: 0.75em">{{.CurrentSection.Name}}</h1>
+      <ul id="list" class="list-unstyled list-of-titles">
+        {{ range .Data.Pages.ByDate.Reverse }}
+          <li class="{{if .Draft }}draft{{ end }}">
+            <a href="{{ .RelPermalink}}">
+              <span class="post-title">{{ .Title }}</span>
+              <br>
+              <span class="post-meta">{{ .Date.Format "January 2, 2006" }}</span>
+            </a>
+          </li>
+        {{ end }}
+      </ul>
+    </div>
+  </section>
+
+  {{ partial "footer.html" . }}
+  </body>
+</html>
diff --git a/layouts/_default/single.droplist b/layouts/_default/single.droplist
new file mode 100644
index 0000000..2a67a1d
--- /dev/null
+++ b/layouts/_default/single.droplist
@@ -0,0 +1,3 @@
+{{ with (.Page.Scratch.Get "droplist") }}
+    {{- range (. | sort | uniq) }}{{.}}
+{{end -}}{{end}}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
new file mode 100644
index 0000000..f2bfbc2
--- /dev/null
+++ b/layouts/_default/single.html
@@ -0,0 +1,28 @@
+{{ partial "header.html" . }}
+<body
+  class="{{ if .Draft }}draft{{ end }} look-sheet-bkg"
+  lang="{{ .Site.LanguageCode }}"
+  itemscope
+  itemtype="http://schema.org/Article">
+
+  <div class="nav-bkg">
+    <nav class="content-container pagewide-bar-padding">
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}" >{{ .Site.Title  }}</a>
+      {{- if not .Parent.IsHome -}}
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}{{ .CurrentSection.Type }}">{{.CurrentSection.Name}}</a>
+      {{- end -}}
+      {{ partial "right-links" . }}
+    </nav>
+  </div>
+
+  <section id="main" class="content-container look-sheet article-pad-v">
+    <h1 itemprop="name" id="title">{{ .Title }}</h1>
+    <article itemprop="articleBody" id="content" class="article-body">
+      {{ .Content }}
+    </article>
+  </section>
+  {{ partial "footer.html" . }}
+  </body>
+</html>
diff --git a/layouts/index.html b/layouts/index.html
new file mode 100644
index 0000000..42ce451
--- /dev/null
+++ b/layouts/index.html
@@ -0,0 +1,29 @@
+{{ partial "header.html" . }}
+<body lang="{{ .Site.LanguageCode }}">
+  <div class="nav-bkg">
+    <nav class="content-container pagewide-bar-padding">
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}" >{{ .Site.Title  }}</a>
+      {{ partial "right-links" . }}
+    </nav>
+  </div>
+
+  <section id="main" class="content-container article-pad-v">
+    <div>
+      <h1 id="title" style="margin-bottom: 0.75em">{{.Site.Title}}</h1>
+      <ul id="list" class="list-unstyled list-of-titles">
+        {{ range .Site.Params.Menu }}
+          <li>
+            <a href="{{ .url | relURL }}">
+              <span class="post-title">{{ .name }}</span>
+            </a>
+          </li>
+        {{ end }}
+      </ul>
+    </div>
+  </section>
+
+  {{ partial "footer.html" . }}
+  </body>
+</html>
+
diff --git a/layouts/partials/feature_image.html b/layouts/partials/feature_image.html
new file mode 100644
index 0000000..31d2be2
--- /dev/null
+++ b/layouts/partials/feature_image.html
@@ -0,0 +1,15 @@
+{{/* The featured image, using the same rules as what the twitter cards use. */}}
+{{- with $.Params.images -}}
+    {{- index . 0 | absURL -}}
+{{- else -}}
+    {{- $images := $.Resources.ByType "image" -}}
+    {{- $featured := $images.GetMatch "*feature*" -}}
+    {{- $featured := cond (ne $featured nil) $featured ($images.GetMatch "{*cover*,*thumbnail*}") -}}
+    {{- with $featured -}}
+        {{- $featured.Permalink -}}
+    {{- else -}}
+        {{- with $.Site.Params.images -}}
+            {{- index . 0 | absURL -}}
+        {{- end -}}
+    {{- end -}}
+{{- end -}}
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/layouts/partials/footer.html
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/layouts/partials/head.html
diff --git a/layouts/partials/head_includes.html b/layouts/partials/head_includes.html
new file mode 100644
index 0000000..cb95b79
--- /dev/null
+++ b/layouts/partials/head_includes.html
@@ -0,0 +1,7 @@
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap-reboot.css" />
+<link rel="stylesheet" href="{{ relURL "/css/style.css" }}" />
+<link rel="stylesheet" href="{{ relURL "/css/syntax.css" }}" />
+
+<link href="https://fonts.googleapis.com/css?family=Lora&display=swap" rel="stylesheet">
+
+{{ template "_internal/google_analytics_async.html" . }}
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
new file mode 100644
index 0000000..d398a7d
--- /dev/null
+++ b/layouts/partials/header.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html
+  class=""
+  lang="{{ .Site.LanguageCode }}"
+  prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#"
+>
+  <head>
+    <meta charset="utf-8" />
+
+    {{ partial "meta.html" . }}
+
+    <title>{{ .Title }}</title>
+    <link rel="canonical" href="{{ .Permalink }}" />
+
+    {{/*
+    Have to explicitly filter to only include the 'RSS' type because we've
+    defined an RSS2 type as well, and output both of them. The RSS2 type exists
+    so that we can create a second identical RSS link at /feed.xml (which
+    apparently people are still subscribed to? Crazy!) - but we only want to
+    refer to the new feed location here, because that's the canonical one going
+    forward.
+    */}}
+    {{ with .OutputFormats.Get "rss" -}}
+      {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
+    {{ end -}}
+
+    {{ partial "head_includes.html" . }}
+    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
+  </head>
+
diff --git a/layouts/partials/meta.html b/layouts/partials/meta.html
new file mode 100644
index 0000000..2dccf74
--- /dev/null
+++ b/layouts/partials/meta.html
@@ -0,0 +1,28 @@
+<meta charset="utf-8">
+<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+<meta name="HandheldFriendly" content="True" />
+<meta name="MobileOptimized" content="320" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+
+
+<link rel="apple-touch-icon" sizes="180x180" href="{{.Site.BaseURL}}/apple-touch-icon.png">
+<link rel="icon" type="image/png" sizes="32x32" href="{{.Site.BaseURL}}/favicon-32x32.png">
+<link rel="icon" type="image/png" sizes="16x16" href="{{.Site.BaseURL}}/favicon-16x16.png">
+<link rel="manifest" href="{{.Site.BaseURL}}/site.webmanifest">
+<link rel="mask-icon" href="{{.Site.BaseURL}}/safari-pinned-tab.svg" color="#5bbad5">
+<meta name="msapplication-TileColor" content="#da532c">
+<meta name="theme-color" content="#ffffff">
+
+
+{{ with.Description }}<meta name="description" content="{{ . }}" />
+{{ end }}
+<meta name="keywords" content="{{ if .Keywords }}{{ range.Keywords }}{{ . }},
+{{ end }}{{else if isset .Params "tags" }}{{ range.Params.tags }}{{ . }},
+{{ end }}{{ end }}">
+
+{{ template "_internal/opengraph.html" . }}
+<meta property="og:site_name" content="{{ .Site.Title }}" />
+
+{{ partial "twitter_cards_default_small.html" . }}
+
+{{ template "_internal/schema.html" . }}
diff --git a/layouts/partials/right-links.html b/layouts/partials/right-links.html
new file mode 100644
index 0000000..fd318ea
--- /dev/null
+++ b/layouts/partials/right-links.html
@@ -0,0 +1,9 @@
+<ul class="list-unstyled right-links">
+{{ range .Site.Params.TopMenu }}
+          <li>
+            <a href="{{ .url | relURL }}">
+              <span class="post-title">{{ .name }}</span>
+            </a>
+          </li>
+{{ end }}
+</ul>
diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/layouts/partials/scripts.html
diff --git a/layouts/partials/twitter_cards_default_small.html b/layouts/partials/twitter_cards_default_small.html
new file mode 100644
index 0000000..946a5fa
--- /dev/null
+++ b/layouts/partials/twitter_cards_default_small.html
@@ -0,0 +1,30 @@
+{{/* This is a modified copy/paste of https://github.com/gohugoio/hugo/blob/2b73e89d6d2822e86360a6c92c87f539677c119b/tpl/tplimpl/embedded/templates/twitter_cards.html */}}
+{{- with $.Params.images -}}
+<meta name="twitter:card" content="summary_large_image"/>
+<meta name="twitter:image" content="{{ index . 0 | absURL }}"/>
+{{ else -}}
+{{- $images := $.Resources.ByType "image" -}}
+{{- $featured := $images.GetMatch "*feature*" -}}
+{{- $featured := cond (ne $featured nil) $featured ($images.GetMatch "{*cover*,*thumbnail*}") -}}
+{{- with $featured -}}
+<meta name="twitter:card" content="summary_large_image"/>
+<meta name="twitter:image" content="{{ $featured.Permalink }}"/>
+{{- else -}}
+{{- with $.Site.Params.images -}}
+<meta name="twitter:card" content="summary"/>
+<meta name="twitter:image" content="{{ index . 0 | absURL }}"/>
+{{ else -}}
+<meta name="twitter:card" content="summary"/>
+{{- end -}}
+{{- end -}}
+{{- end }}
+<meta name="twitter:title" content="{{ .Title }}"/>
+<meta name="twitter:description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end -}}"/>
+{{ with .Site.Social.twitter -}}
+<meta name="twitter:site" content="@{{ . }}"/>
+{{ end -}}
+{{ range .Site.Authors }}
+{{ with .twitter -}}
+<meta name="twitter:creator" content="@{{ . }}"/>
+{{ end -}}
+{{ end -}}
diff --git a/layouts/posts/single.html b/layouts/posts/single.html
new file mode 100644
index 0000000..9fefe2a
--- /dev/null
+++ b/layouts/posts/single.html
@@ -0,0 +1,64 @@
+{{ partial "header.html" . }}
+<body
+  class="{{ if .Draft }}draft{{ end }} look-sheet-bkg"
+  lang="{{ .Site.LanguageCode }}"
+  itemscope
+  itemtype="http://schema.org/Article" >
+  <meta itemprop="author" content="{{ .Site.Params.Author }}" />
+  <meta itemprop="publisher" content="{{ .Site.Params.Author }}" />
+  <meta itemprop="image" content="{{ partial "feature_image" . }}" />
+
+  <div class="nav-bkg">
+    <nav class="content-container pagewide-bar-padding">
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}" >{{ .Site.Title  }}</a>
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}{{ .CurrentSection.Type }}">{{.CurrentSection.Name}}</a>
+      {{ partial "right-links" . }}
+    </nav>
+  </div>
+
+  <section id="main" class="content-container look-sheet article-pad-v" itemprop="mainEntityOfPage">
+    <h1 itemprop="name" id="title">{{ .Title }}</h1>
+    <meta itemprop="headline" content="{{ .Title }}" />
+    {{ if .Params.tags }}
+    <div class="post-tags">
+    {{ range .Params.tags }}
+      <a href="{{ (urlize (printf "tags/%s/" .)) | absLangURL }}">#{{ . }}</a>&nbsp;
+      {{ end }}
+    </div>
+    {{ end }}
+    {{ if eq .Lastmod .Date }}
+      <div class="post-date"><span itemprop="datePublished">{{ .Date.Format "January 2, 2006" }}</span></div>
+      <meta itemprop="dateModified" content="{{ .Lastmod.Format "January 2, 2006" }}"/>
+    {{ else }}
+      <div class="post-date">Created: <span itemprop="datePublished">{{ .Date.Format "January 2, 2006" }}</span></div>
+      <div class="post-date">Last Edited: <span itemprop="dateModified">{{ .Lastmod.Format "January 2, 2006" }}</span></div>
+    {{ end }}
+    <article itemprop="articleBody" id="content" class="article-body margin-top-2em">
+      {{ .Content }}
+    </article>
+  </section>
+  <!-- TODO: right now, this gets weird when there's a big title on the right.
+  There might be better info here: https://stackoverflow.com/questions/34995740/css-when-inline-block-elements-line-break-parent-wrapper-does-not-fit-new-width
+  and you can test on the android-development-developer-productivity article.
+
+  Would also be cool to make this fold on mobile so there's two links on separate lines.
+  -->
+  <div class="nav-bkg-50 content-container-narrow-pad bottom-links text-0p75">
+    <nav class="flex-row">
+    {{if .PrevInSection}}
+    <a href="{{.PrevInSection.Permalink}}" class="flex-row v-center no-underline"  style="max-width:45%;">
+      <span class="text-1p5">←</span>&nbsp;<span class="re-underline">Previous: {{ .PrevInSection.Title }}</span>
+    </a>
+    {{end}}
+    {{if .NextInSection}}
+      <a href="{{.NextInSection.Permalink}}" class="flex-row v-center no-underline" style="max-width: 45%;">
+      <span class="re-underline">Next: {{.NextInSection.Title}}</span>&nbsp;<span class="text-1p5">→</span>
+      </a>
+    {{end}}
+    </nav>
+  </div>
+  {{ partial "footer.html" . }}
+  </body>
+</html>
diff --git a/layouts/shortcodes/aside.html b/layouts/shortcodes/aside.html
new file mode 100644
index 0000000..601e50b
--- /dev/null
+++ b/layouts/shortcodes/aside.html
@@ -0,0 +1,10 @@
+{{ $_hugo_config := `{ "version": 1 }` }}
+<!--
+Ok, so - see this: https://gohugo.io/content-management/shortcodes/#shortcodes-with-markdown
+The outcome is that by default, accessing .Inner returns the Markdown. Because we're putting it
+inside a div, it doesn't get rendered later. So we restore the old behaviour, which renders
+everything to HTML as a first step (but apparently breaks the TOC functionality).
+-->
+<div class="aside look-sheet-always">
+{{- .Inner -}}
+</div>
diff --git a/layouts/shortcodes/expander.html b/layouts/shortcodes/expander.html
new file mode 100644
index 0000000..d19e153
--- /dev/null
+++ b/layouts/shortcodes/expander.html
@@ -0,0 +1,18 @@
+{{ $_hugo_config := `{ "version": 1 }` }}
+<!--
+Ok, so - see this: https://gohugo.io/content-management/shortcodes/#shortcodes-with-markdown
+The outcome is that by default, accessing .Inner returns the Markdown. Because we're putting it
+inside a div, it doesn't get rendered later. So we restore the old behaviour, which renders
+everything to HTML as a first step (but apparently breaks the TOC functionality).
+-->
+<!-- Expander: hides content by default, shows it when clicked on. -->
+<div class="expander look-sheet">
+{{ $radioGroup := anchorize (.Get "title") }}
+<h2>{{ .Get "title" }}</h2>
+<input type=radio id="expand-{{$radioGroup}}-show" class="hidden show" name="{{$radioGroup}}">
+<input type=radio id="expand-{{$radioGroup}}-hide" class="hidden hide" name="{{$radioGroup}}" checked="checked">
+<label class="button button-show" for="expand-{{$radioGroup}}-show">+ Expand</label><label class="button button-hide" for="expand-{{$radioGroup}}-hide">- Collapse</label>
+<div class="inner">
+{{ .Inner }}
+</div>
+</div>
diff --git a/layouts/shortcodes/fitfigure.html b/layouts/shortcodes/fitfigure.html
new file mode 100644
index 0000000..78650e5
--- /dev/null
+++ b/layouts/shortcodes/fitfigure.html
@@ -0,0 +1,52 @@
+{{- $path := (.Get "src") -}}
+{{- $original := .Page.Resources.GetMatch $path -}}
+{{- if not $original -}}
+    {{- errorf "couldn't find resource for src: %s" $path -}}
+{{- else if and ((ne "jpg" $original.MediaType.SubType) (ne "png" $original.MediaType.SubType)) -}}
+    {{- errorf "src %s is a %s, expected image/jpg or image/png" $path $original.MediaType -}}
+{{- else -}}
+    {{- /* Below is a copy paste of "_internal/shortcodes/figure.html" from Hugo commit aba2647c152ffff927f42523b77ee6651630cd67, with the img tag modified to use srcsets */ -}}
+    <figure{{ with .Get "class" }} class="{{ . }}"{{ end }}>
+        {{- if .Get "link" -}}
+            <a href="{{ .Get "link" }}"{{ with .Get "target" }} target="{{ . }}"{{ end }}{{ with .Get "rel" }} rel="{{ . }}"{{ end }}>
+        {{- end }}
+        {{ if (or (ge $original.Width 1304) (ge $original.Height 1304)) -}}
+            {{/* Add the original to the droplist, so it will get removed later. */}}
+            {{- if not (.Page.Scratch.Get "droplist") -}}
+                {{- .Page.Scratch.Set "droplist" (slice) -}}
+            {{- end -}}
+            {{- .Page.Scratch.Add "droplist" $original.RelPermalink -}}
+            {{/* Note: 652px is the max width of an img in article content. I measured this using dev tools; but it's dependent on the styles for the page. */}}
+            {{- $resized_1x := $original.Fit "652x652 q95" -}}
+            {{- $resized_2x := $original.Fit "1304x1304 q95" -}}
+            <img srcset="{{ $resized_1x.RelPermalink }},
+                         {{ $resized_2x.RelPermalink }} 2x"
+                {{/* Use small one by default to be kind to old browsers */}}
+                src="{{ $resized_1x.RelPermalink }}"
+        {{ else }}
+            <img src="{{ $original.RelPermalink }}"
+            {{ end }}
+            {{- if or (.Get "alt") (.Get "caption") }}
+            alt="{{ with .Get "alt" }}{{ . }}{{ else }}{{ .Get "caption" | markdownify| plainify }}{{ end }}"
+            {{- end -}}
+            {{- with .Get "width" }} width="{{ . }}"{{ end -}}
+            {{- with .Get "height" }} height="{{ . }}"{{ end -}}
+        /> <!-- Closing img tag -->
+        {{- if .Get "link" }}</a>{{ end -}}
+        {{- if or (or (.Get "title") (.Get "caption")) (.Get "attr") -}}
+            <figcaption>
+                {{ with (.Get "title") -}}
+                    <h4>{{ . }}</h4>
+                {{- end -}}
+                {{- if or (.Get "caption") (.Get "attr") -}}<p>
+                    {{- .Get "caption" | markdownify -}}
+                    {{- with .Get "attrlink" }}
+                        <a href="{{ . }}">
+                    {{- end -}}
+                    {{- .Get "attr" | markdownify -}}
+                    {{- if .Get "attrlink" }}</a>{{ end }}</p>
+                {{- end }}
+            </figcaption>
+        {{- end }}
+    </figure>
+{{- end -}}
diff --git a/layouts/taxonomy/taxonomy.html b/layouts/taxonomy/taxonomy.html
new file mode 100644
index 0000000..5958214
--- /dev/null
+++ b/layouts/taxonomy/taxonomy.html
@@ -0,0 +1,32 @@
+{{ partial "header.html" . }}
+<body lang="{{ .Site.LanguageCode }}">
+  <div class="nav-bkg">
+    <nav class="content-container pagewide-bar-padding">
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}" >{{ .Site.Title  }}</a>
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}{{ .Data.Plural }}">{{.Data.Plural}}</a>
+      {{ partial "right-links" . }}
+    </nav>
+  </div>
+
+  <section id="main" class="content-container article-pad-v">
+    <div>
+      <h1 id="title" style="margin-bottom: 0.75em">{{.Data.Term}}</h1>
+      <ul id="list" class="list-unstyled list-of-titles">
+        {{ range .Data.Pages.ByDate.Reverse }}
+          <li class="{{ if .Draft }}draft{{ end }}">
+            <a href="{{ .RelPermalink}}">
+              <span class="post-title">{{ .Title }}</span>
+              <br>
+              <span class="post-meta">{{ .Date.Format "January 2, 2006" }}</span>
+            </a>
+          </li>
+        {{ end }}
+      </ul>
+    </div>
+  </section>
+
+  {{ partial "footer.html" . }}
+  </body>
+</html>
diff --git a/layouts/taxonomy/terms.html b/layouts/taxonomy/terms.html
new file mode 100644
index 0000000..e11461a
--- /dev/null
+++ b/layouts/taxonomy/terms.html
@@ -0,0 +1,39 @@
+{{ partial "header.html" . }}
+<body lang="{{ .Site.LanguageCode }}">
+  <div class="nav-bkg">
+    <nav class="content-container pagewide-bar-padding">
+      <span class="divider">/ </span>
+      <a href="{{ .Site.BaseURL  }}" >{{ .Site.Title  }}</a>
+      {{ partial "right-links" . }}
+    </nav>
+  </div>
+
+  <section id="main" class="content-container article-pad-v">
+    <div>
+      <h1 id="title" style="margin-bottom: 0.75em">{{.Data.Plural}}</h1>
+      <ul id="list" class="list-unstyled list-of-titles">
+        {{ range .Data.Terms.ByCount }}
+        {{ with .Page }}
+          {{ $numDrafts := len (where .Pages ".Draft" true) }}
+            <li class="{{ if gt $numDrafts 0 }}draft{{ end }}">
+              <a href="{{ .RelPermalink}}">
+                <span class="post-title">#{{ .Title }}</span>
+                <br>
+                <span class="post-meta">{{len .Pages}} {{if ne (len .Pages) 1}}entries{{else}}entry{{end}}</span>
+                <br>
+                {{ if gt $numDrafts 0 }}
+                  <span class="post-meta draft">Including {{ $numDrafts }} {{if ne $numDrafts 1}}drafts{{else}}draft{{end}}</span>
+                  <br>
+                {{ end }}
+                <span class="post-meta">Last updated {{ .Lastmod.Format "January 2, 2006" }}</span>
+              </a>
+            </li>
+          {{ end }}
+        {{ end }}
+      </ul>
+    </div>
+  </section>
+
+  {{ partial "footer.html" . }}
+  </body>
+</html>
diff --git a/static/css/style.css b/static/css/style.css
new file mode 100644
index 0000000..eddf8e8
--- /dev/null
+++ b/static/css/style.css
@@ -0,0 +1,407 @@
+body {
+  -webkit-font-smoothings: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-rendering: optimizeLegibility;
+}
+
+code {
+  padding: 2px 4px;
+  font-size: 90%;
+  background-color: #eeeeee;
+  hyphens: none; /* reset changes from <p> */
+  /* border-radius: 4px; */
+}
+
+/* Reset these values when there's code inside a pre. Pre handles the styling then.*/
+pre code {
+  background-color: transparent;
+  padding: 0;
+}
+
+pre {
+  display: block;
+  padding: 9.5px;
+  margin: 0 0 10px;
+  line-height: 1.4;
+  word-break: break-all;
+  word-wrap: break-word;
+  border: 1px solid #ccc;
+  box-shadow: 0 5px 5px -5px #777777;
+  max-width: 100%;
+  /* These two copied from chroma theme (syntax.css) */
+  color: #f8f8f2;
+  background-color: #272822;
+}
+
+pre,
+code {
+  font-family: monocode, monospace;
+  -webkit-font-smoothings: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+h1,h2,h3,h4,h5,h6 {
+  font-family: 'Lora', serif;
+}
+
+h1#title {
+  /*Some UA stylesheets put h1 to 1.5em when in an article, so we reset it back for our title here.*/
+  font-size: 2em;
+}
+
+body {
+  font-family: -apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;
+}
+
+.content-container {
+  padding-left: 1em;
+  padding-right: 1em;
+}
+
+.content-container-narrow-pad {
+  padding: 0.5em;
+}
+
+.v-center {
+  align-items: center;
+}
+
+.look-sheet-bkg {
+  background-color: white;
+}
+
+@media(min-width: 720px) {
+  .content-container {
+    /* ACHTUNG:
+    Images are scaled in the fitfigure shortcode with an assumption that the
+    page is 652px wide. If you change this value, remeasure and change the value
+    there too. */
+    width: 45rem;
+    padding-left: 2em;
+    padding-right: 2em;
+    margin: 0 auto;
+  }
+
+  .content-container-narrow-pad {
+    padding-left: 0.5em;
+    padding-right: 0.5em;
+    width: 45rem;
+    margin: 0 auto;
+  }
+
+  .bottom-links {
+    border: 1px solid #ccc;
+    border-bottom: 0px;
+  }
+
+  .look-sheet {
+    border: 1px solid #ccc;
+    box-shadow: 0 5px 5px -5px #777777;
+    margin-top: 1em;
+    margin-bottom: 1em;
+    min-height: 0px;
+    background-color: white;
+  }
+
+  .look-sheet-bkg {
+    background-color: #fffdf7;
+  }
+}
+
+.look-sheet-always {
+  border: 1px solid #ccc;
+  box-shadow: 0 5px 5px -5px #777777;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  min-height: 0px;
+  background-color: white;
+}
+
+.article-pad-v {
+    padding-top: 1em;
+    padding-bottom: 1em;
+}
+
+blockquote {
+  border-left: #777 0.25em solid;
+  padding: 0 1.25em;
+  margin: 2em 0 2em 1em;
+}
+
+.nav-bkg {
+  color: white;
+  box-shadow: 0 5px 5px -5px #777777;
+  background: #00223E;  /* fallback for old browsers */
+  background: -webkit-linear-gradient(135deg, #00223E 80%, #FFA17F 80%);  /* Chrome 10-25, Safari 5.1-6 */
+  background: linear-gradient(135deg, #00223E 80%, #FFA17F 80%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+}
+
+.nav-bkg-50 {
+  color: white;
+  box-shadow: 0 5px 5px -5px #777777;
+  background: #00223E;  /* fallback for old browsers */
+  background: -webkit-linear-gradient(135deg, #00223E 50%, #FFA17F 50%);  /* Chrome 10-25, Safari 5.1-6 */
+  background: linear-gradient(135deg, #00223E 50%, #FFA17F 50%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+}
+
+.nav-bkg a {
+  text-decoration: underline;
+}
+
+.pagewide-bar-padding {
+  padding: 0.5em 1em;
+}
+
+nav a, nav a:hover, nav a:visited {
+  color: white;
+}
+
+.post-date {
+  font-size: 0.875em;
+  color: #777;
+}
+
+.post-tags, .post-tags a, .post-tags a:hover, .post-tags a:visited {
+  color: #777;
+}
+
+.margin-top-2em {
+  margin-top: 2em;
+}
+
+.article-body h2,.article-body h3 {
+  margin-top: 2em;
+  margin-bottom: 0.5em;
+}
+
+kbd {
+  background-color: #333;
+  color: #fff;
+  padding: 2px 4px;
+  border-radius: 4px;
+  font-size: 95%;
+  white-space: nowrap;
+}
+
+figure {
+  margin: 2em auto;
+  display: table;
+}
+
+figure:not(.no-border) video, figure:not(.no-border) img {
+  border: 1px solid #ccc;
+  box-shadow: 0 5px 5px -5px #777777;
+  max-width: 100%;
+  background-color: white;
+}
+
+body {
+  background-color: #fffdf7;
+}
+
+figcaption {
+  margin-top: 0.75em;
+  font-style: italic;
+  text-align: center;
+  font-size: 0.75em;
+  color: #5e5e5e;
+}
+
+/*
+The figure is handling the margin here, its last child doesn't need to.
+This is a side-effect of using display: table on figure. This is gross and
+will have side-effects if you have multiple nested elements under the figcaption I think.
+*/
+figure figcaption :last-child {
+  margin-bottom: 0;
+}
+
+.footnotes {
+  margin-top: 4em;
+  font-size: 85%;
+}
+
+.footnotes hr {
+  margin-bottom: 1em;
+}
+
+.footnotes li {
+  margin: 0 0 12px;
+}
+
+twitter-widget {
+  /*
+  Have to use important here because the twitter oembed puts the styles in the
+  style attribute.
+  */
+  margin: 2em auto !important;
+}
+
+.list-unstyled {
+  padding-left: 0;
+  margin-bottom: 0;
+  list-style: none;
+}
+
+.flex-row {
+  display: flex;
+  justify-content: space-between;
+}
+
+a.no-underline:hover {
+  text-decoration: none;
+}
+
+a.no-underline:hover .re-underline {
+  text-decoration: underline;
+}
+
+.list-of-titles .post-title {
+  color: black;
+  font-size: 1.5em;
+}
+.list-of-titles li a {
+  text-decoration: none;
+  display: block;
+  padding: 1em;
+  border-bottom: 1px solid #ccc;
+  /* hacks so that the text doesn't move unintentionally */
+  border-left: 1px solid transparent;
+  border-right: 1px solid transparent;
+}
+
+.list-of-titles li a:hover {
+  background-color: white;
+  border-left: 1px solid #ccc;
+  border-right: 1px solid #ccc;
+  box-shadow: 0 5px 5px -5px #777777;
+}
+
+.list-of-titles li a:hover .post-title {
+  text-decoration: underline;
+}
+
+.list-of-titles li:first-child a {
+  border-top: 1px solid #ccc;
+}
+
+.list-of-titles .post-meta {
+  font-size: 0.875em;
+  color: #777;
+}
+
+ul.right-links {
+  display: none;
+  float: right;
+}
+ul.right-links li {
+  display: inline-block;
+  margin-right: 1em;
+}
+
+@media(min-width: 440px) {
+  ul.right-links {
+    display: block;
+  }
+}
+
+.embed.rich, img {
+  max-width: 100%;
+}
+
+p {
+  hyphens: auto;
+}
+
+.look-sheet-bkg.draft, .list-of-titles li.draft a:hover {
+  background: repeating-linear-gradient(     135deg,   white,   white 10px,   #ffd4a3 12px,   #ffd4a3 12px );
+}
+
+.list-of-titles li.draft {
+  background: repeating-linear-gradient(     135deg,    #fffdf7,   #fffdf7 10px,   #ffd4a3 12px,   #ffd4a3 12px );
+}
+
+.post-meta.draft {
+  font-weight: bold;
+}
+
+.text-1p5 {
+  font-size: 1.5em;
+}
+
+.text-0p75 {
+  font-size: 0.75em;
+}
+
+.aside {
+  background-color: #fffdf7;
+  padding: 0 1em;
+  margin-top: 3em;
+}
+
+.aside h2:first-child {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+
+.expander {
+  background-color: #fffdf7;
+  padding: 0 1em;
+  position: relative; /* anchor for the buttons */
+}
+
+.expander h2:first-child {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+
+.expander .button {
+  display: inline-block;
+  font-weight: 400;
+  text-align: center;
+  vertical-align: middle;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  background-color: transparent;
+  line-height: 1.5;
+  border-radius: .25rem;
+  font-family: -apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;
+  padding: .25rem .75rem;
+  font-size: .875rem;
+
+  color: white;
+  box-shadow: 0 5px 5px -5px #777777;
+  background: #00223E;  /* fallback for old browsers */
+  background: -webkit-linear-gradient(135deg, #00223E 85%, #FFA17F 85%);  /* Chrome 10-25, Safari 5.1-6 */
+  background: linear-gradient(135deg, #00223E 85%, #FFA17F 85%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+}
+
+.expander .button {
+  position: absolute;
+  top: 0;
+  right: 0;
+  margin-right: 1em;
+  margin-top: 1em;
+}
+
+.hidden {
+  display: none;
+}
+
+.expander input.show:checked ~ .inner {
+  display:block;
+}
+
+.expander input.hide:checked ~ .inner {
+  display: none;
+}
+
+.expander input.show:checked ~ .button-show {
+  display: none;
+}
+
+.expander input.hide:checked ~ .button-hide {
+  display: none;
+}
diff --git a/static/css/syntax.css b/static/css/syntax.css
new file mode 100644
index 0000000..350286e
--- /dev/null
+++ b/static/css/syntax.css
@@ -0,0 +1,59 @@
+/* Background */ .chroma { color: #f8f8f2; background-color: #272822 }
+/* Error */ .chroma .err { color: #960050; background-color: #1e0010 }
+/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
+/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
+/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc }
+/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
+/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
+/* Keyword */ .chroma .k { color: #66d9ef }
+/* KeywordConstant */ .chroma .kc { color: #66d9ef }
+/* KeywordDeclaration */ .chroma .kd { color: #66d9ef }
+/* KeywordNamespace */ .chroma .kn { color: #f92672 }
+/* KeywordPseudo */ .chroma .kp { color: #66d9ef }
+/* KeywordReserved */ .chroma .kr { color: #66d9ef }
+/* KeywordType */ .chroma .kt { color: #66d9ef }
+/* NameAttribute */ .chroma .na { color: #a6e22e }
+/* NameClass */ .chroma .nc { color: #a6e22e }
+/* NameConstant */ .chroma .no { color: #66d9ef }
+/* NameDecorator */ .chroma .nd { color: #a6e22e }
+/* NameException */ .chroma .ne { color: #a6e22e }
+/* NameFunction */ .chroma .nf { color: #a6e22e }
+/* NameOther */ .chroma .nx { color: #a6e22e }
+/* NameTag */ .chroma .nt { color: #f92672 }
+/* Literal */ .chroma .l { color: #ae81ff }
+/* LiteralDate */ .chroma .ld { color: #e6db74 }
+/* LiteralString */ .chroma .s { color: #e6db74 }
+/* LiteralStringAffix */ .chroma .sa { color: #e6db74 }
+/* LiteralStringBacktick */ .chroma .sb { color: #e6db74 }
+/* LiteralStringChar */ .chroma .sc { color: #e6db74 }
+/* LiteralStringDelimiter */ .chroma .dl { color: #e6db74 }
+/* LiteralStringDoc */ .chroma .sd { color: #e6db74 }
+/* LiteralStringDouble */ .chroma .s2 { color: #e6db74 }
+/* LiteralStringEscape */ .chroma .se { color: #ae81ff }
+/* LiteralStringHeredoc */ .chroma .sh { color: #e6db74 }
+/* LiteralStringInterpol */ .chroma .si { color: #e6db74 }
+/* LiteralStringOther */ .chroma .sx { color: #e6db74 }
+/* LiteralStringRegex */ .chroma .sr { color: #e6db74 }
+/* LiteralStringSingle */ .chroma .s1 { color: #e6db74 }
+/* LiteralStringSymbol */ .chroma .ss { color: #e6db74 }
+/* LiteralNumber */ .chroma .m { color: #ae81ff }
+/* LiteralNumberBin */ .chroma .mb { color: #ae81ff }
+/* LiteralNumberFloat */ .chroma .mf { color: #ae81ff }
+/* LiteralNumberHex */ .chroma .mh { color: #ae81ff }
+/* LiteralNumberInteger */ .chroma .mi { color: #ae81ff }
+/* LiteralNumberIntegerLong */ .chroma .il { color: #ae81ff }
+/* LiteralNumberOct */ .chroma .mo { color: #ae81ff }
+/* Operator */ .chroma .o { color: #f92672 }
+/* OperatorWord */ .chroma .ow { color: #f92672 }
+/* Comment */ .chroma .c { color: #75715e }
+/* CommentHashbang */ .chroma .ch { color: #75715e }
+/* CommentMultiline */ .chroma .cm { color: #75715e }
+/* CommentSingle */ .chroma .c1 { color: #75715e }
+/* CommentSpecial */ .chroma .cs { color: #75715e }
+/* CommentPreproc */ .chroma .cp { color: #75715e }
+/* CommentPreprocFile */ .chroma .cpf { color: #75715e }
+/* GenericDeleted */ .chroma .gd { color: #f92672 }
+/* GenericEmph */ .chroma .ge { font-style: italic }
+/* GenericInserted */ .chroma .gi { color: #a6e22e }
+/* GenericStrong */ .chroma .gs { font-weight: bold }
+/* GenericSubheading */ .chroma .gu { color: #75715e }
author	Fabian Tamp <fabian.tamp@gmail.com>	2019-09-21 21:02:23 +0300
committer	Fabian Tamp <fabian.tamp@gmail.com>	2019-09-21 21:02:23 +0300
commit	175fab5477aa833e43472a0c4a9134f495f63960 (patch)
tree	2ac5c336b33545f44bafb4851936bf35afd84599
parent	faa6504d39e364311ad95e9507e45987919ee610 (diff)