WIP table of contents

.gitmodules

@@ -1,4 +1,4 @@
 [submodule "assets/jam"]
 	path = assets/jam
-	url = https://github.com/BBaoVanC/jam.git
+	url = https://github.com/michaelampr/jam.git
 	branch = master

archetypes/blog/index.md

@@ -8,7 +8,7 @@ comments: true
 draft: true
 
 authors:
-  - {{ with .Site.Params.author.name }}{{ . }}{{ else }}John Doe{{ end }}
+  - {{ with .Site.Author.name }}{{ . }}{{ else }}John Doe{{ end }}
 
 categories:
   - archetype-stuff

archetypes/default/index.md

@@ -6,7 +6,7 @@ toc: true
 comments: false
 
 authors:
-  - {{ with .Site.params.author.name }}{{ . }}{{ else }}John Doe{{ end }}
+  - {{ with .Site.Author.name }}{{ . }}{{ else }}John Doe{{ end }}
 
 ---
 

assets/css/bobastyle.css

@@ -248,31 +248,31 @@ hr {
   }
 }
 
-table.simple {
+table.markdown {
   border-collapse: collapse;
   border: 2px solid var(--text-1);
 }
 
-table.simple thead {
+table.markdown thead {
   background-color: var(--background-2);
   color: var(--text-2);
   border-bottom: 2px solid var(--text-1);
 }
 
-table.simple th,
-table.simple td {
+table.markdown th,
+table.markdown td {
   padding: 8px;
 }
 
-table.simple :is(th, td) + :is(th, td) {
+table.markdown :is(th, td) + :is(th, td) {
   border-left: 2px solid var(--text-1);
 }
 
-table.simple tbody tr:nth-child(odd) {
+table.markdown tbody tr:nth-child(odd) {
   background-color: var(--background-0);
   color: var(--text-0);
 }
-table.simple tbody tr:nth-child(even) {
+table.markdown tbody tr:nth-child(even) {
   background-color: var(--background-1);
   color: var(--text-1);
 }
@@ -361,6 +361,23 @@ h1 svg.icon {
 
 /* }}} */
 
+/* Back to top {{{ */
+#top {
+  font-size: 0;
+}
+#back-to-top {
+  position: fixed;
+  float: right;
+  bottom: 25px;
+  right: 25px;
+  background-color: var(--background-1);
+  color: var(--text-1);
+  border-radius: 100%;
+  padding: 12px;
+  display: none;
+}
+/* }}} */
+
 /* Skip to main content {{{ */
 #skip-to-main {
   position: absolute;
@@ -965,12 +982,21 @@ aside.quote {
     break-inside: avoid;
   }
 
-  .table-of-contents {
+  .table-of-contents:not(.print) {
     display: none;
   }
 
   .table-of-contents.print {
     display: block;
+    background-color: unset;
+    padding: 0;
+  }
+  .table-of-contents.print ul {
+    margin: 0;
+  }
+
+  #back-to-top {
+    display: none !important;
   }
 }
 

assets/css/syntax-light.css

@@ -5,17 +5,16 @@
     color: black;
   }
 
-/* Background */ .bg { background-color: #f8f8f8; }
+/* Background */ .bg { background-color: #f8f8f8 }
 /* PreWrapper */ .chroma { background-color: #f8f8f8; }
 /* Other */ .chroma .x { color: #000000 }
 /* Error */ .chroma .err { color: #a40000 }
 /* CodeLine */ .chroma .cl {  }
-/* LineLink */ .chroma .lnlinks { outline: none; text-decoration: none; color: inherit }
 /* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
 /* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; }
-/* LineHighlight */ .chroma .hl { background-color: #dfdfdf }
-/* LineNumbersTable */ .chroma .lnt { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
-/* LineNumbers */ .chroma .ln { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
+/* LineHighlight */ .chroma .hl { background-color: #ffffcc }
+/* LineNumbersTable */ .chroma .lnt { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
+/* LineNumbers */ .chroma .ln { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
 /* Line */ .chroma .line { display: flex; }
 /* Keyword */ .chroma .k { color: #204a87; font-weight: bold }
 /* KeywordConstant */ .chroma .kc { color: #204a87; font-weight: bold }

assets/css/syntax.css

@@ -1,16 +1,15 @@
 /* native style */
 
-/* Background */ .bg { color: #d0d0d0; background-color: #202020; }
+/* Background */ .bg { color: #d0d0d0; background-color: #202020 }
 /* PreWrapper */ .chroma { color: #d0d0d0; background-color: #202020; }
 /* Other */ .chroma .x {  }
 /* Error */ .chroma .err { color: #a61717; background-color: #e3d2d2 }
 /* CodeLine */ .chroma .cl {  }
-/* LineLink */ .chroma .lnlinks { outline: none; text-decoration: none; color: inherit }
 /* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
 /* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; }
-/* LineHighlight */ .chroma .hl { background-color: #363636 }
-/* LineNumbersTable */ .chroma .lnt { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #686868 }
-/* LineNumbers */ .chroma .ln { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #686868 }
+/* LineHighlight */ .chroma .hl { background-color: #ffffcc }
+/* LineNumbersTable */ .chroma .lnt { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #686868 }
+/* LineNumbers */ .chroma .ln { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #686868 }
 /* Line */ .chroma .line { display: flex; }
 /* Keyword */ .chroma .k { color: #6ab825; font-weight: bold }
 /* KeywordConstant */ .chroma .kc { color: #6ab825; font-weight: bold }

assets/js/bobatheme.js

@@ -1,3 +1,13 @@
+// back to top
+const backToTop = document.getElementById("back-to-top");
+window.onscroll = function() {
+    if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) {
+        backToTop.style.display = "block";
+    } else {
+        backToTop.style.display = "none";
+    }
+}
+
 // code block copy to clipboard
 window.onload = () => {
     document.querySelectorAll(".code-block").forEach(codeBlock => {

config.yaml

@@ -2,12 +2,6 @@ markup:
   highlight:
     noClasses: false
     lineNos: true
-  goldmark:
-    parser:
-      attribute:
-        block: true
-        # this is enabled by default already
-        #title: true
 
 params:
   readingtime: true
@@ -18,20 +12,11 @@ taxonomies:
   author: authors
   series: series
 
-outputs:
-  page:
-    - html
-    - markdown
-
-outputFormats:
-  markdown:
-    ugly: true
-
 privacy:
   googleAnalytics:
     disable: true
 
-  x:
+  twitter:
     enableDNT: true
 
   vimeo:

exampleSite/hugo.yaml

@@ -4,27 +4,19 @@ defaultContentLanguage: en
 copyright: '&copy; 2021 bbaovanc <a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/">CC BY-SA 4.0</a>'
 sectionPagesMenu: main
 enableRobotsTXT: true
+paginate: 5
 enableGitInfo: true
 
-pagination:
-  pagerSize: 5
-
 taxonomies:
   _merge: deep
 
+author:
+  name: bbaovanc
+
 markup: # this just keeps the bobatheme markup styling
   _merge: deep
 
-outputs:
-  _merge: deep
-
-outputFormats:
-  _merge: deep
-
 params:
-  author:
-    name: bbaovanc
-
   # these are for the OpenGraph/Twitter embeds in Hugo
   description: Example website for bobatheme
 

i18n/en.yaml

@@ -30,9 +30,6 @@ readingtime:
 edit_history:
   other: "Edit history"
 
-view_markdown:
-  other: "View raw"
-
 
 # Post count
 no_posts:
@@ -70,9 +67,6 @@ aria_rss_link:
 aria_post_meta_edit_history:
   other: "link to page edit history"
 
-aria_post_meta_view_markdown:
-  other: "link to view raw markdown code of page"
-
 aria_post_meta_categories:
   other: "categories"
 

layouts/_default/baseof.html

@@ -4,8 +4,20 @@
     {{ partial "head.html" . }}
 
     <body>
+        <a id="top" aria-hidden="true"></a>
         <a id="skip-to-main" href="#main-content">Skip to main content</a>
 
+        <a id="back-to-top" href="#top" aria-label="{{ i18n "aria_back_to_top_button" }}">
+            {{ partial "icon.html" "chevron-up" }}
+        </a>
+        <noscript>
+            <style>
+                #back-to-top {
+                    display: block;
+                }
+            </style>
+        </noscript>
+
         {{ partial "top.html" . }}
 
         <div class="main-container">
@@ -27,7 +39,7 @@
         {{ if or .Site.Copyright .Site.Params.footer }}
             <footer>
                 {{ with .Site.Copyright }}
-                    {{ . | safeHTML }}
+                    <p>{{ . | safeHTML }}</p>
                 {{ end }}
 
                 {{ with .Site.Params.footer }}

layouts/_default/single.markdown.md

@@ -1,9 +0,0 @@
-{{ with .File -}}
-  {{ with (.Path | readFile) -}}
-    {{ . -}}
-  {{ else -}}
-    {{ errorf "file not found: %s" .Path -}}
-  {{ end -}}
-{{ else -}}
-  {{ errorf "no file available for markdown template?" -}}
-{{ end -}}

layouts/partials/_internal/pagination.html

@@ -1,154 +0,0 @@
-{{- $validFormats := slice "default" "terse" }}
-
-{{- $msg1 := "When passing a map to the internal pagination template, one of the elements must be named 'page', and it must be set to the context of the current page." }}
-{{- $msg2 := "The 'format' specified in the map passed to the internal pagination template is invalid. Valid choices are: %s." }}
-
-{{- $page := . }}
-{{- $format := "default" }}
-
-{{- if reflect.IsMap . }}
-  {{- with .page }}
-    {{- $page = . }}
-  {{- else }}
-    {{- errorf $msg1 }}
-  {{- end }}
-  {{- with .format }}
-    {{- $format = lower . }}
-  {{- end }}
-{{- end }}
-
-{{- if in $validFormats $format }}
-  {{- if gt $page.Paginator.TotalPages 1 }}
-    <ul class="pagination pagination-{{ $format }}">
-      {{- partial (printf "inline/pagination/%s.html" $format) $page }}
-    </ul>
-  {{- end }}
-{{- else }}
-  {{- errorf $msg2 (delimit $validFormats ", ") }}
-{{- end -}}
-
-{{/* Format: default
-{{/* --------------------------------------------------------------------- */}}
-{{- define "_partials/inline/pagination/default.html" }}
-  {{- with .Paginator }}
-    {{- $currentPageNumber := .PageNumber }}
-
-    {{- with .First }}
-      {{- if ne $currentPageNumber .PageNumber }}
-      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="First" class="page-link" role="button"><span aria-hidden="true">&laquo;&laquo;</span></a>
-      </li>
-      {{- else }}
-      <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="First" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">&laquo;&laquo;</span></a>
-      </li>
-      {{- end }}
-    {{- end }}
-
-    {{- with .Prev }}
-      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Previous" class="page-link" role="button"><span aria-hidden="true">&laquo;</span></a>
-      </li>
-    {{- else }}
-      <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="Previous" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">&laquo;</span></a>
-      </li>
-    {{- end }}
-
-    {{- $slots := 5 }}
-    {{- $start := math.Max 1 (sub .PageNumber (math.Floor (div $slots 2))) }}
-    {{- $end := math.Min .TotalPages (sub (add $start $slots) 1) }}
-    {{- if lt (add (sub $end $start) 1) $slots }}
-      {{- $start = math.Max 1 (add (sub $end $slots) 1) }}
-    {{- end }}
-
-    {{- range $k := seq $start $end }}
-      {{- if eq $.Paginator.PageNumber $k }}
-      <li class="page-item active">
-        <a aria-current="page" aria-label="Page {{ $k }}" class="page-link" role="button">{{ $k }}</a>
-      </li>
-      {{- else }}
-      <li class="page-item">
-        <a href="{{ (index $.Paginator.Pagers (sub $k 1)).URL }}" aria-label="Page {{ $k }}" class="page-link" role="button">{{ $k }}</a>
-      </li>
-      {{- end }}
-    {{- end }}
-
-    {{- with .Next }}
-      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Next" class="page-link" role="button"><span aria-hidden="true">&raquo;</span></a>
-      </li>
-    {{- else }}
-      <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="Next" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">&raquo;</span></a>
-      </li>
-    {{- end }}
-
-    {{- with .Last }}
-      {{- if ne $currentPageNumber .PageNumber }}
-      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Last" class="page-link" role="button"><span aria-hidden="true">&raquo;&raquo;</span></a>
-      </li>
-      {{- else }}
-      <li class="page-item disabled">
-        <a aria-disabled="true" aria-label="Last" class="page-link" role="button" tabindex="-1"><span aria-hidden="true">&raquo;&raquo;</span></a>
-      </li>
-      {{- end }}
-    {{- end }}
-  {{- end }}
-{{- end -}}
-
-{{/* Format: terse
-{{/* --------------------------------------------------------------------- */}}
-{{- define "_partials/inline/pagination/terse.html" }}
-  {{- with .Paginator }}
-    {{- $currentPageNumber := .PageNumber }}
-
-    {{- with .First }}
-      {{- if ne $currentPageNumber .PageNumber }}
-      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="First" class="page-link" role="button"><span aria-hidden="true">&laquo;&laquo;</span></a>
-      </li>
-      {{- end }}
-    {{- end }}
-
-    {{- with .Prev }}
-      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Previous" class="page-link" role="button"><span aria-hidden="true">&laquo;</span></a>
-      </li>
-    {{- end }}
-
-    {{- $slots := 3 }}
-    {{- $start := math.Max 1 (sub .PageNumber (math.Floor (div $slots 2))) }}
-    {{- $end := math.Min .TotalPages (sub (add $start $slots) 1) }}
-    {{- if lt (add (sub $end $start) 1) $slots }}
-      {{- $start = math.Max 1 (add (sub $end $slots) 1) }}
-    {{- end }}
-
-    {{- range $k := seq $start $end }}
-      {{- if eq $.Paginator.PageNumber $k }}
-      <li class="page-item active">
-        <a aria-current="page" aria-label="Page {{ $k }}" class="page-link" role="button">{{ $k }}</a>
-      </li>
-      {{- else }}
-      <li class="page-item">
-        <a href="{{ (index $.Paginator.Pagers (sub $k 1)).URL }}" aria-label="Page {{ $k }}" class="page-link" role="button">{{ $k }}</a>
-      </li>
-      {{- end }}
-    {{- end }}
-
-    {{- with .Next }}
-      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Next" class="page-link" role="button"><span aria-hidden="true">&raquo;</span></a>
-      </li>
-    {{- end }}
-
-    {{- with .Last }}
-      {{- if ne $currentPageNumber .PageNumber }}
-      <li class="page-item">
-        <a href="{{ .URL }}" aria-label="Last" class="page-link" role="button"><span aria-hidden="true">&raquo;&raquo;</span></a>
-      </li>
-      {{- end }}
-    {{- end }}
-  {{- end }}
-{{- end -}}

layouts/partials/figure.html

@@ -9,7 +9,7 @@
     {{ with index . "src" }}
         {{ $media := . }}
         {{ if eq .MediaType.MainType "image" }}
-            <img src="{{ $media.Permalink }}" alt="{{ $media.Title }}" loading="lazy" />
+            <img src="{{ $media.Permalink }}" alt="{{ $media.Title }}" />
         {{ else if eq .MediaType.MainType "video" }}
             <video controls preload="metadata">
                 <source src="{{ $media.Permalink }}" alt="{{ $media.Title }}">

layouts/partials/head.html

@@ -7,10 +7,10 @@
         <link rel="stylesheet" type="text/css" href="{{ .Permalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
     {{ end }}
     {{ with resources.Get "css/syntax.css" | fingerprint "sha512" }}
-        <link rel="stylesheet" type="text/css" href="{{ .Permalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous" media="print" onload="this.media='all'">
+        <link rel="stylesheet" type="text/css" href="{{ .Permalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
     {{ end }}
     {{ with resources.Get "css/syntax-light.css" | fingerprint "sha512" }}
-        <link rel="stylesheet" type="text/css" href="{{ .Permalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous" media="print" onload="this.media='all'">
+        <link rel="stylesheet" type="text/css" href="{{ .Permalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
     {{ end }}
 
     {{ with resources.Get "js/bobatheme.js" | fingerprint "sha512" }}

layouts/partials/page-metadata/item/authors.html

@@ -6,9 +6,9 @@
             {{ $authors := slice }}
             {{ range . }}
                 {{ $url := (printf "authors/%s" (. | anchorize)) | absLangURL }}
-                {{ $authors = $authors | append (printf `<a href="%s">%s</a>` $url .) }}
+                {{ $authors = $authors | append (printf `<a href="%s">%s</a>` $url . | safeHTML) }}
             {{ end }}
-            {{ delimit $authors ", " | safeHTML }}
+            {{ delimit $authors ", " }}
         {{ else }}
             {{ delimit . ", " }}
         {{ end }}

layouts/partials/page-metadata/item/categories.html

@@ -6,6 +6,6 @@
 
     <div class="page-metadata-section categories" aria-label="{{ i18n "aria_post_meta_categories" }}">
         {{ partial "icon.html" "folder" }}
-        {{ delimit $categories ", " | safeHTML }}
+        {{ delimit $categories ", " }}
     </div>
 {{ end }}

layouts/partials/page-metadata/item/series.html

@@ -6,6 +6,6 @@
 
     <div class="page-metadata-section series" aria-label="{{ i18n "aria_post_meta_series" }}">
         {{ partial "icon.html" "files" }}
-        {{ delimit $series ", " | safeHTML }}
+        {{ delimit $series ", " }}
     </div>
 {{ end }}

layouts/partials/page-metadata/item/tags.html

@@ -6,6 +6,6 @@
 
     <div class="page-metadata-section tags" aria-label="{{ i18n "aria_post_meta_tags" }}">
         {{ partial "icon.html" "tag" }}
-        {{ delimit $tags ", " | safeHTML }}
+        {{ delimit $tags ", " }}
     </div>
 {{ end }}

layouts/partials/page-metadata/item/viewraw.html

@@ -1,8 +0,0 @@
-{{ with .OutputFormats.Get "markdown" }}
-    <span class="page-metadata-item post-meta-view-markdown" aria-label="{{ i18n "aria_post_meta_view_markdown" }}">
-        {{ partial "icon.html" "code" }}
-        <a href="{{ .Permalink }}" target="_blank">
-            {{- i18n "view_markdown" -}}
-        </a>
-    </span>
-{{ end }}

layouts/partials/page-metadata/post-full.html

@@ -20,10 +20,7 @@
         {{ partial "page-metadata/item/authors.html" . }}
         {{ partial "page-metadata/item/readingtime.html" . }}
         {{ partial "page-metadata/item/edithistory.html" . }}
-        {{ partial "page-metadata/item/viewraw.html" . }}
-
         {{ partial "page-metadata/item/categories.html" . }}
-
         {{ partial "page-metadata/item/tags.html" . }}
     </div>
 {{ end }}

layouts/partials/pagination.html

@@ -1,6 +1,5 @@
 {{ if gt .Paginator.TotalPages 1 }}
     <nav class="pagination">
-        {{/* https://github.com/gohugoio/hugo/blob/a88b488181279befd50e1d127f9f67604f2f9854/tpl/tplimpl/embedded/templates/_partials/pagination.html */}}
-        {{ partial "_internal/pagination.html" . }}
+        {{ template "_internal/pagination.html" . }}
     </nav>
 {{ end }}

layouts/partials/remote_figure.html

@@ -10,7 +10,7 @@
 {{ end }}
 
     {{ if eq $type "image" }}
-        <img src="{{ $src }}" alt="{{ $alt }}" loading="lazy" />
+        <img src="{{ $src }}" alt="{{ $alt }}" />
     {{ else if eq $type "video" }}
         <video controls preload="metadata">
             <source src="{{ $src }}" alt="{{ $alt }}">

layouts/partials/seo-tags/schema.html

@@ -21,14 +21,10 @@
     <meta itemprop="image" content="{{ $featured.Permalink }}">
 {{ end }}
 
-{{ with .Keywords }}
-    <meta itemprop="keywords" content="{{ delimit . ", " }}">
-{{ else }}
-    {{ with (.GetTerms "tags") }}
-        {{ $tags := slice }}
-        {{ range . }}
-            {{ $tags = $tags | append .LinkTitle }}
-        {{ end }}
-        <meta itemprop="keywords" content="{{ delimit $tags ", " }}">
+{{ with (.GetTerms "tags") }}
+    {{ $tags := slice }}
+    {{ range . }}
+        {{ $tags = $tags | append .LinkTitle }}
     {{ end }}
+    <meta itemprop="keywords" content="{{ delimit $tags ", " }}">
 {{ end }}

layouts/partials/seo-tags/twitter-cards.html

@@ -24,6 +24,6 @@
 <meta name="twitter:title" content="{{ .Title | plainify }}">
 <meta name="twitter:description" content="{{ (partial "seo-description.html" .) | plainify }}">
 
-{{ with .Site.Params.social.twitter }}
+{{ with .Site.Social.twitter }}
     <meta name="twitter:site" content="@{{ . }}">
 {{ end }}

layouts/partials/series-box.html

@@ -12,6 +12,6 @@
             This post is part of a series:
         {{ end }}
 
-        {{ delimit $series ", " | safeHTML }}
+        {{ delimit $series ", " }}
     </div>
 {{ end }}

layouts/shortcodes/table.html

@@ -0,0 +1,10 @@
+{{/* See https://willschenk.com/articles/2020/styling_tables_with_hugo/ */}}
+
+{{ $class := "markdown" }}
+{{ with .Get "class" }}
+    {{ $class = delimit (slice $class .) " " }}
+{{ end }}
+
+{{ $htmlTable := .Inner | .Page.RenderString (dict "display" "block") }}
+{{ $new := printf `<table class="%s">` $class }}
+{{ (replace $htmlTable "<table>" $new) | safeHTML }}