app: Refactor and CSS rewrite

15 files changed, 203 insertions, 342 deletions

diff --git a/generators/hugo/themes/tdro/layouts/_default/_markup/render-codeblock-goat.html b/generators/hugo/themes/tdro/layouts/_default/_markup/render-codeblock-goat.html
index d2d0753..67b004b 100644
--- a/generators/hugo/themes/tdro/layouts/_default/_markup/render-codeblock-goat.html
+++ b/generators/hugo/themes/tdro/layouts/_default/_markup/render-codeblock-goat.html
@@ -14,5 +14,5 @@
       {{ .Inner }}
     </svg>
   {{ end }}
-  <figcaption class="has-text-grey-dark">{{ $caption }}</figcaption>
+  <figcaption>{{ $caption }}</figcaption>
 </diagram-container>
diff --git a/generators/hugo/themes/tdro/layouts/_default/_markup/render-codeblock.html b/generators/hugo/themes/tdro/layouts/_default/_markup/render-codeblock.html
new file mode 100644
index 0000000..7541268
--- /dev/null
+++ b/generators/hugo/themes/tdro/layouts/_default/_markup/render-codeblock.html
@@ -0,0 +1,17 @@
+{{- $caption := .Attributes.caption -}}
+{{- $type    := .Type | default "text" -}}
+{{- $options := .Attributes.options | default "default=1" -}}
+{{- $id      := print "code-block-" (truncate 7 "" (md5 .Inner)) -}}
+
+<code-block id="{{ $id }}" {{ if in (lower $options) "linenos" }}data-lines{{ end }}>
+  <header>
+  <language-label>
+    <a href="#{{ $id }}"><code>{{ $type }}</code></a>
+  </language-label>
+  </header>
+  {{ highlight .Inner $type (print $options ",lineAnchors=" "code-line-" (truncate 7 "" (md5 .Inner))) }}
+</code-block>
+
+{{- with $caption -}}
+  <footer>{{- . | markdownify -}}</footer>
+{{- end -}}
diff --git a/generators/hugo/themes/tdro/layouts/_default/_markup/render-heading.html b/generators/hugo/themes/tdro/layouts/_default/_markup/render-heading.html
index 10e6709..48e02c1 100644
--- a/generators/hugo/themes/tdro/layouts/_default/_markup/render-heading.html
+++ b/generators/hugo/themes/tdro/layouts/_default/_markup/render-heading.html
@@ -1,6 +1,5 @@
 <h{{ .Level }} id="{{ .Anchor | safeURL }}">
   <a
-    class="article__heading__anchor"
     title="{{ .Text | safeHTML }}"
     href="#{{ .Anchor | safeURL }}">
     {{ .Text | safeHTML }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/_markup/render-image.html b/generators/hugo/themes/tdro/layouts/_default/_markup/render-image.html
index 5307cc2..1b524ac 100644
--- a/generators/hugo/themes/tdro/layouts/_default/_markup/render-image.html
+++ b/generators/hugo/themes/tdro/layouts/_default/_markup/render-image.html
@@ -39,7 +39,7 @@
     />
   </a>
 {{ if $.Title }}
-<figcaption class="has-text-grey-dark">{{ $.Title | markdownify }}</figcaption>
+<figcaption>{{ $.Title | markdownify }}</figcaption>
 {{ end -}}
 </figure>
 {{- /* This comment removes trailing newlines. */ -}}
diff --git a/generators/hugo/themes/tdro/layouts/_default/archive.html b/generators/hugo/themes/tdro/layouts/_default/archive.html
index 7399a98..8cbd435 100644
--- a/generators/hugo/themes/tdro/layouts/_default/archive.html
+++ b/generators/hugo/themes/tdro/layouts/_default/archive.html
@@ -1,36 +1,29 @@
 {{ define "main" }}
-<section class="section is-fullheight">
-  <div class="container">
-    <div class="columns is-centered">
-      <div class="column is-7">
-        {{ $type := .Type }}
+<main>
+  <article-archive-list>
+  {{ $type := .Type }}
 
-        {{ range (.Site.RegularPages.GroupByDate "2006") }}
-          {{ $articles := (where .Pages "Type" $type) }}
-          {{ if and (gt .Key 1) (gt (where .Pages "Type" $type) 0) }}
-
-            {{ range (first 1 $articles) }}
-            <h1 class="article__list title is-4 has-text-weight-normal has-margin-bottom-lg">{{ .Date.Format "2006" }}</h1>
-            {{ end }}
-
-            <ul class="article__list">
-              {{ range $articles }}
-                {{ if (ne .Params.hidden true) }}
-                <li>
-                  <a title="{{ .Title }}" class="is-block" href="{{ .RelPermalink }}">
-                    <span class="article__list__date monospace has-text-grey-dark">{{ .Date.Format "02 Jan" }}</span>
-                    {{- .Title | markdownify -}}
-                  </a>
-                </li>
-                {{ end }}
-              {{ end }}
-            </ul>
+  {{ range (.Site.RegularPages.GroupByDate "2006") }}
+    {{ $articles := (where .Pages "Type" $type) }}
+    {{ if and (gt .Key 1) (gt (where .Pages "Type" $type) 0) }}
+      {{ range (first 1 $articles) }}
+      <h1>{{ .Date.Format "2006" }}</h1>
+      {{ end }}
 
+      <ul>
+        {{ range $articles }}
+          {{ if (ne .Params.hidden true) }}
+          <li>
+            <a title="{{ .Title }}" href="{{ .RelPermalink }}">
+              <code><time datetime="{{ dateFormat "2006-01-02" .Date }}">{{ .Date.Format "02 Jan" }}</time></code>
+              <span>{{- .Title | markdownify -}}</span>
+            </a>
+          </li>
           {{ end }}
         {{ end }}
-
-      </div>
-    </div>
-  </div>
-</section>
+      </ul>
+    {{ end }}
+  {{ end }}
+  </article-archive-list>
+</main>
 {{ end }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/baseof.html b/generators/hugo/themes/tdro/layouts/_default/baseof.html
index 81c9a1e..0f84698 100644
--- a/generators/hugo/themes/tdro/layouts/_default/baseof.html
+++ b/generators/hugo/themes/tdro/layouts/_default/baseof.html
@@ -1,18 +1,18 @@
 <!DOCTYPE html>
-<html class="has-navbar-fixed-top" lang="en-us" itemscope itemtype="http://schema.org/Article">
+<html lang="en-us" itemscope itemtype="http://schema.org/Article">
 
 <head>
 
-{{ partial "head.html" . -}}
+{{ partial "base-head.html" . -}}
   
 </head>
 
 <body>
 
-{{ partial "nav.html" . -}}
+{{ partial "base-nav.html" . -}}
 
 	{{- block "main" . }} 
 		<p>If you are seeing this, your page content hasn't been created.</p>
 	{{- end }}
 
-{{ partial "footer.html" . -}}
+{{ partial "base-footer.html" . -}}
diff --git a/generators/hugo/themes/tdro/layouts/_default/index.json b/generators/hugo/themes/tdro/layouts/_default/index.json
index 3cab4c6..92801bf 100644
--- a/generators/hugo/themes/tdro/layouts/_default/index.json
+++ b/generators/hugo/themes/tdro/layouts/_default/index.json
@@ -32,7 +32,7 @@
         {{- end -}}
       ],
       "content_text": {{ $data.Plain | jsonify }},
-      "content_html": {{ $data.Content | jsonify }}
+      "content_html": {{ partial "function-content.html" $data.Content | jsonify }}
     }
     {{- end -}}
     {{ end }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/list.html b/generators/hugo/themes/tdro/layouts/_default/list.html
deleted file mode 100644
index 78fec9b..0000000
--- a/generators/hugo/themes/tdro/layouts/_default/list.html
+++ /dev/null
@@ -1,17 +0,0 @@
-{{ define "main" }}
-<section class="section">
-	<div class="container">
-		<div class="columns is-centered">
-			<div class="column is-7">
-				<article class="content">
-				<h2 class="title">{{ .Title | markdownify }}</h2>
-				{{ range .Paginator.Pages }}
-				{{ .Render "summary" }}
-				{{ end }}
-				</article>
-				{{ partial "pagination.html" . }}
-			</div>
-		</div>
-	</div>
-</section>
-{{ end }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/rss.xml b/generators/hugo/themes/tdro/layouts/_default/rss.xml
index 9f94c84..47c2d70 100644
--- a/generators/hugo/themes/tdro/layouts/_default/rss.xml
+++ b/generators/hugo/themes/tdro/layouts/_default/rss.xml
@@ -24,7 +24,7 @@
         <link>{{ .Permalink }}</link>
         <pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
         <guid>{{ .Permalink }}</guid>
-        <description>{{ .Content | html }}</description>
+        <description>{{ partial "function-content.html" .Content | html }}</description>
       </item>
       {{ end }}
     {{ end }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/section.html b/generators/hugo/themes/tdro/layouts/_default/section.html
index 47ea0a7..10f501a 100644
--- a/generators/hugo/themes/tdro/layouts/_default/section.html
+++ b/generators/hugo/themes/tdro/layouts/_default/section.html
@@ -1,26 +1,25 @@
 {{ define "main" }}
-<section class="section is-fullheight">
-  <div class="container">
-    <div class="columns is-centered">
-      <div class="column is-7">
-        <article class="content">
-        <br>
-        <span class="marginnote rightnote">
-          See an archive of all {{ .Type }} <a href="{{ partial "archive-link.html" . }}">here.</a>
-        </span>
-        <recent-articles>
-          {{ range where .Paginator.Pages ".Params.hidden" "ne" "true" }}
-            {{ .Render "summary" }}
-          {{ end }}
-        </recent-articles>
-        </article>
-        {{ partial "pagination.html" . }}
-        <br>
-        <a href="{{ partial "archive-link.html" . }}" class="front__more is-block has-text-centered">
-          <span>Archive of all {{ .Type }}</span> {{ safeHTML (readFile "public/css/icons/feather/corner-down-right.svg") }}
-        </a>
-      </div>
-    </div>
-  </div>
-</section>
+<main>
+  <article-list>
+
+    <margin-note right>
+      See an archive of all {{ .Type }} <a href="/archives/{{ .Type }}/">here.</a>
+    </margin-note>
+
+    <recent-articles>
+      {{ if eq .Title "Posts" }}<recent-posts>{{ end }}
+      {{ if eq .Title "Projects" }}<recent-projects>{{ end }}
+        {{ range where .Paginator.Pages ".Params.hidden" "ne" "true" }}
+          {{ .Render "summary" }}
+        {{ end }}
+      {{ if eq .Title "Posts" }}</recent-posts>{{ end }}
+      {{ if eq .Title "Projects" }}</recent-projects>{{ end }}
+    </recent-articles>
+
+  {{ partial "article-pagination.html" . }}
+
+  {{ partial "article-archive-link.html" . }}
+
+  </article-list>
+</main>
 {{ end }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/single.html b/generators/hugo/themes/tdro/layouts/_default/single.html
index a3eaf4a..96bb02c 100644
--- a/generators/hugo/themes/tdro/layouts/_default/single.html
+++ b/generators/hugo/themes/tdro/layouts/_default/single.html
@@ -1,141 +1,18 @@
 {{ define "main" }}
-<main class="section is-block is-fullheight">
-  <div class="container">
-    <div class="columns is-centered">
-      <div class="column is-7">
-        <article class="content document">
-          <h1 class="title is-2 serif">{{ .Title | markdownify }}</h1>
-          {{ if .Params.toc }}
-          <div class="tableofcontents marginnote rightnote is-inline">
-            <div class="is-size-6 is-uppercase has-text-weight-bold has-spacing-widest has-margin-bottom-sm">Table of Contents</div>
-            {{ .TableOfContents }}
-          </div>
-          {{ end }}
-
-          <aside class="subtitle is-6 has-text-grey-dark">
-            {{- partial "page-meta.html" . -}}
-            <br>
-            <span class="isso-comments-counter"><a class="has-text-grey-dark focus-link" title="Jump to Comments" href="#isso-thread">0 Comments</a> &middot;</span>
-            {{- partial "read-time.html" . -}} &middot; {{ .FuzzyWordCount }} words
-          </aside>
-
-          {{- partial "page-status.html" . -}}
-
-          {{- .Content |
-            replaceRE "<p>\n<figure>" "<figure>" |
-            replaceRE "</figure></p>" "</figure>" |
-            replaceRE "<p>" "<p class=\"serif is-size-serif\">" |
-            replaceRE "<h2" "<h2 class=\"serif\"" |
-            replaceRE "<h3" "<h3 class=\"serif\"" |
-            safeHTML
-          -}}
-        </article>
-      </div>
-    </div>
-  </div>
+<main>
+  <article>
+    <h1>{{ .Title | markdownify }}</h1>
+    {{- partial "article-table-contents.html" . -}}
+    {{- partial "article-meta-top.html" . -}}
+    {{- partial "function-content.html" .Content | safeHTML -}}
+  </article>
+
+  {{- partial "article-meta-bottom.html"  . -}}
+  {{- partial "article-more-content.html" . -}}
+  {{- if fileExists "themes/tdro/layouts/partials/openring.html" -}}
+  {{- partial "article-on-web.html"       . -}}
+  {{- end -}}
+  {{- partial "article-syntax.html"       . -}}
+  {{- partial "article-comments.html"     . -}}
 </main>
-
-<aside class="section">
-  <div class="container">
-    <div class="columns is-tablet is-centered">
-      <div class="column is-7 has-text-grey-dark has-text-right">
-        <p>
-          {{ dateFormat "2 January 2006" .Params.date }}
-          <code> &mdash; Written</code>
-          <br>
-          {{ if .Params.updated }}
-            {{ dateFormat "2 January 2006" .Params.updated }}
-          {{ else }}
-            {{ dateFormat "2 January 2006" .Params.date }}
-          {{ end }}
-          <code> &mdash; Updated</code>
-          <br>
-          {{ .Site.Author.name }}<code> &mdash; Creator</code>
-          <br>
-          <a class="has-text-grey-dark" href="{{ strings.TrimRight "/" .Permalink }}.md">{{ .Slug }}.md</a><code> &mdash; Article</code>
-        </p>
-      </div>
-    </div>
-  </div>
-</aside>
-
-<aside class="section content article__more__content has-margin-bottom-none">
-  <div class="container">
-    <div class="columns is-tablet is-centered">
-      <div class="column is-7">
-
-        <section class="section-vertical">
-          <h2 class="is-uppercase is-size-5 has-spacing-widest has-margin-bottom-lg">More Content</h2>
-          {{ $related :=  shuffle .Site.RegularPages | first 3 }}
-          {{ with $related }}
-          {{ range . }}
-
-          <ul>
-            <li>
-              <p class="has-margin-none">
-                <a href="{{ .RelPermalink }}" title="{{ truncate 100 "..." .Summary }}" class="serif is-size-4">
-                  {{ .Title | markdownify }}
-                </a>
-              </p>
-              <time datetime="{{ dateFormat "2006-01-02" .Date }}">
-                {{ dateFormat "02 Jan 2006" .Date }}
-              </time>
-            </li>
-          </ul>
-
-          {{ end }}
-          {{ end }}
-        </section>
-
-      </div>
-    </div>
-  </div>
-</aside>
-
-<aside class="section content article__webring">
-  <div class="container">
-    <div class="columns is-tablet is-centered">
-      <div class="column is-7">
-
-        <section class="webring section-vertical">
-          <a href="https://git.sr.ht/~sircmpwn/openring"
-          title="Generated by Open Ring"
-          class="attribution is-pulled-right has-text-grey-dark">
-            <span class="button item__box item__no__hover">
-            {{ safeHTML (readFile "public/css/icons/feather/help-circle.svg") }}
-            <span>Openring</span>
-            </span>
-          </a>
-          {{- partial "openring.html" . -}}
-        </section>
-
-      </div>
-    </div>
-  </div>
-</aside>
-
-{{ if .Params.syntax }}
-<link rel="stylesheet" href="/css/syntax-highlight.css">
-{{ end }}
-
-<aside class="section content container">
-  <div class="columns is-centered">
-    <div class="column is-7">
-
-      <h1 id="comments" class="is-uppercase is-size-5 has-spacing-widest">Comments</h1>
-
-      <script
-        data-isso="/isso/"
-        data-title="{{ .Title }}"
-        data-isso-css="false"
-        data-isso-reply-notifications="true"
-        src="/isso/js/embed.min.js">
-      </script>
-
-      <div id="isso-thread" data-title="{{ .Title }}"></div>
-
-    </div>
-  </div>
-</aside>
-
 {{ end }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/subsection.html b/generators/hugo/themes/tdro/layouts/_default/subsection.html
index ffaa3f9..d57c2cb 100644
--- a/generators/hugo/themes/tdro/layouts/_default/subsection.html
+++ b/generators/hugo/themes/tdro/layouts/_default/subsection.html
@@ -1,15 +1,9 @@
 {{ define "main" }}
-<section class="section is-fullheight">
-  <div class="container">
-    <div class="columns is-centered">
-      <div class="column is-7">
-        <article class="content document">
-          <h1 class="title is-3">{{ .Title | markdownify }}</h1>
-          {{- partial "page-status.html" . -}}
-          {{- .Content | safeHTML }}
-        </article>
-      </div>
-    </div>
-  </div>
-</section>
+<main>
+  <article-subsection>
+    <h1>{{ .Title | markdownify }}</h1>
+    {{- partial "meta-pagestatus.html" . -}}
+    {{- .Content | safeHTML -}}
+  </article-subsection>
+</main>
 {{ end }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/summary.html b/generators/hugo/themes/tdro/layouts/_default/summary.html
index ae150d5..4d41046 100644
--- a/generators/hugo/themes/tdro/layouts/_default/summary.html
+++ b/generators/hugo/themes/tdro/layouts/_default/summary.html
@@ -1,27 +1,24 @@
-<div class="columns is-mobile">
+<article-card>
+  <article-thumbnail>
+    {{ partial "article-thumbnail-image.html" . }}
+  </article-thumbnail>
 
-  <div class="column is-5 has-text-centered">
-    {{ partial "thumbnail-image.html" . }}
-  </div>
+  <article-summary>
+      <h2><a href="{{ .Permalink }}" title="{{ .Title }}">{{ .Title | markdownify }}</a></h2>
 
-  <div class="column is-7">
-    <article>
-      <header class="post-header">
+      <article-summary-meta>
+        {{- partial "meta-pagedate.html" . -}}
+        {{- partial "meta-pagestatus.html" . -}}
+        {{- partial "meta-readtime.html" . -}}
+      </article-summary-meta>
 
-      <h2 class="article__title title is-5 has-text-weight-bold">
-        <a href="{{ .Permalink }}" title="{{ .Title }}">{{ .Title | markdownify }}</a>
-      </h2>
-
-      <p class="article__date subtitle is-6">
-        {{ partial "page-date.html" . }}{{ partial "page-status.html" . }} &middot; {{ partial "read-time.html" . }}
+      <p>
+        {{ if .Params.summary }}
+          {{ truncate 75 "..." .Params.summary }}
+        {{ else }}
+          {{ truncate 75 "..." .Summary}}
+        {{ end }}
       </p>
-
-      </header>
-      <p class="article__summary">{{ if .Params.summary }}{{ truncate 75 "..." .Params.summary }}{{ else }}{{ truncate 75 "..." .Summary}}{{ end }}</p>
-      <p><a href='{{ .Permalink }}'>Continue reading ({{ .FuzzyWordCount }} words)</a></p>
-    </article>
-  </div>
-
-</div>
-
-<hr class="article__divider">
+      <a href='{{ .Permalink }}'>Continue reading ({{ .FuzzyWordCount }} words)</a>
+  </article-summary>
+</article-card>
diff --git a/generators/hugo/themes/tdro/layouts/_default/taxonomy.html b/generators/hugo/themes/tdro/layouts/_default/taxonomy.html
index 134c19b..ec5a71f 100644
--- a/generators/hugo/themes/tdro/layouts/_default/taxonomy.html
+++ b/generators/hugo/themes/tdro/layouts/_default/taxonomy.html
@@ -1,63 +1,68 @@
 {{ define "main" }}
-{{ $sidenote := "<span class=\"marginnote rightnote\">See an archive of all taxonomies <a href=\"/archives/tags/\">here.</a></span>" }}
-<section class="section is-fullheight">
-  <div class="container">
-    <div class="columns is-centered">
-      <div class="column is-7">
-        {{ $title := .Title }}
-        {{ if eq $title "Tags" }}
-          <article class="content">
-          <h1 class="article__list title is-3">Taxonomies</h1>
-          {{ safeHTML $sidenote }}
-          {{ range .Paginator.Pages }}
-            {{ $title := .Title }}
-            <h1 class="article__list smallcaps title">{{ .Title | title }}</h1>
-            {{ range $taxonomy := .Site.Taxonomies }}
-              {{ range $tag, $article := $taxonomy }}
-                {{ if eq $tag $title }}
-                <ul class="article__list">
-                  {{ range $article.Pages }}
-                  <li>
-                    <a title="{{ .Title }}" class="is-block" href="{{ .RelPermalink }}">
-                      <span class="article__list__date monospace has-text-grey-dark">{{ .Date.Format "02 Jan 2006" }}</span>{{ .Title }}
-                    </a>
-                  </li>
-                  {{ end }}
-                </ul>
+  {{ $sidenote := "<margin-note right>See an archive of all taxonomies <a href=\"/archives/tags/\">here.</a></margin-note>" }}
+  {{ $title := .Title }}
+  {{ if eq $title "Tags" }}
+    <main>
+      <taxonomy-list>
+      {{ safeHTML $sidenote }}
+      <h1>Taxonomies</h1>
+      <hr>
+      <section>
+        {{ range .Paginator.Pages }}
+          {{ $title := .Title }}
+          <h2>{{ .Title | title }}</h2>
+          {{- range $taxonomy := .Site.Taxonomies -}}
+            {{- range $tag, $article := $taxonomy -}}
+              {{ if eq $tag $title }}
+              <ul>
+                {{ range $article.Pages }}
+                <li>
+                  <a title="{{ .Title }}" href="{{ .RelPermalink }}">
+                    <code><time datetime="{{ dateFormat "2006-01-02" .Date }}">{{ .Date.Format "02 Jan 2006" }}</time></code>
+                    <span>{{ .Title }}</span>
+                  </a>
+                </li>
                 {{ end }}
+              </ul>
               {{ end }}
-            {{ end }}
-          {{ end }}
-          </article>
-          {{ partial "pagination.html" . }}
-        {{ else  }}
-          <article class="content">
-          <h1 class="smallcaps title">
-            {{ if ne $title "Tags" }} <a href="/{{ .Data.Plural }}/">Tags</a> <span>&mdash;</span> <span>{{ end }}{{ .Title | title }}</span>
-          </h1>
-          {{ safeHTML $sidenote }}
-            {{ range $taxonomy := .Site.Taxonomies }}
-              {{ range $tag, $article := $taxonomy }}
-                {{ if eq $tag $title }}
-                <ul class="article__list">
-                  {{ range $article.Pages }}
-                  <li>
-                    <a title="{{ .Title }}" class="is-block" href="{{ .RelPermalink }}">
-                      <span class="article__list__date monospace has-text-grey-dark">
-                        {{- .Date.Format "02 Jan 2006" -}}
-                      </span>
-                      {{- .Title | markdownify -}}
-                    </a>
-                  </li>
-                  {{ end }}
-                </ul>
-                {{ end }}
-              {{ end }}
-            {{ end }}
-          </article>
+            {{- end -}}
+          {{- end -}}
+        {{- end -}}
+      </section>
+      {{ partial "article-pagination.html" . }}
+      </taxonomy-list>
+    </main>
+  {{ else  }}
+    <main>
+      <taxonomy-list>
+      {{ safeHTML $sidenote }}
+      <h1>
+        {{ if ne $title "Tags" }}
+          <a href="/{{ .Data.Plural }}/">Tags</a>
+          <span>&mdash;</span>
+          <span>{{ .Title | title }}</span>
         {{ end }}
-      </div>
-    </div>
-  </div>
-</section>
+      </h1>
+      <hr>
+      <section>
+        {{- range $taxonomy := .Site.Taxonomies -}}
+          {{- range $tag, $article := $taxonomy -}}
+            {{- if eq $tag $title -}}
+            <ul>
+              {{ range $article.Pages }}
+              <li>
+                <a title="{{ .Title }}" href="{{ .RelPermalink }}">
+                  <code><time datetime="{{ dateFormat "2006-01-02" .Date }}">{{- .Date.Format "02 Jan 2006" -}}</time></code>
+                  <span>{{- .Title | markdownify -}}</span>
+                </a>
+              </li>
+              {{ end }}
+            </ul>
+            {{- end -}}
+          {{- end -}}
+        {{- end -}}
+      </section>
+      </taxonomy-list>
+    </main>
+  {{ end }}
 {{ end }}
diff --git a/generators/hugo/themes/tdro/layouts/_default/taxonomy_archive.html b/generators/hugo/themes/tdro/layouts/_default/taxonomy_archive.html
index 859252f..614ef98 100644
--- a/generators/hugo/themes/tdro/layouts/_default/taxonomy_archive.html
+++ b/generators/hugo/themes/tdro/layouts/_default/taxonomy_archive.html
@@ -1,34 +1,31 @@
 {{ define "main" }}
-<section class="section is-fullheight">
-  <div class="container">
-    <div class="columns is-centered">
-      <div class="column is-7">
-        {{ $title := .Title }}
-        <article class="content">
-          <h1 class="article__list smallcaps title">{{ .Title | markdownify }}</h1>
-          {{ range $taxonomy := .Site.Taxonomies }}
-            {{ $title := .Title }}
-            {{ range $tag, $article := $taxonomy }}
-              {{ if ne $tag $title }}
-                <h1 class="article__list smallcaps title is-4">{{ $tag }}</h1>
-                <ul class="article__list">
-                  {{ range $article.Pages }}
-                    <li>
-                      <a title="{{ .Title }}" class="is-block" href="{{ .RelPermalink }}">
-                        <span class="article__list__date monospace has-text-grey-dark">
-                          {{- .Date.Format "02 Jan 2006" -}}
-                        </span>
-                        {{- .Title | markdownify -}}
-                      </a>
-                    </li>
-                  {{ end }}
-                </ul>
-              {{ end }}
+  <main>
+    <taxonomy-archive-list>
+    {{ $title := .Title }}
+    <h1>{{ .Title | markdownify }}</h1>
+    <hr>
+      <section>
+        {{ range $taxonomy := .Site.Taxonomies }}
+          {{ $title := .Title }}
+          {{ range $tag, $article := $taxonomy }}
+            {{ if ne $tag $title }}
+              <h2>{{ $tag }}</h2>
+              <ul>
+                {{ range $article.Pages }}
+                  <li>
+                    <a
+                      title="{{ .Title }}"
+                      href="{{ .RelPermalink }}">
+                      <code><time>{{- .Date.Format "02 Jan 2006" -}}</time></code>
+                      <span>{{- .Title | markdownify -}}</span>
+                    </a>
+                  </li>
+                {{ end }}
+              </ul>
             {{ end }}
           {{ end }}
-        </article>
-      </div>
-    </div>
-  </div>
-</section>
+        {{ end }}
+      </section>
+    </taxonomy-archive-list>
+  </main>
 {{ end }}