Add script-driven CI and fix upstream CSS/OG regressions

.github/.hugo-version

@@ -0,0 +1 @@
+0.156.0

.github/workflows/build.yml

@@ -0,0 +1,30 @@
+name: build
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+permissions:
+  contents: read
+
+jobs:
+  build:
+    name: build
+    strategy:
+      matrix:
+        os: [ubuntu-latest, macos-latest]
+    runs-on: ${{ matrix.os }}
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # pin@v6.0.2
+
+      - name: bootstrap
+        run: script/bootstrap
+
+      - name: build
+        run: script/build

.github/workflows/lint.yml

@@ -0,0 +1,30 @@
+name: lint
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+permissions:
+  contents: read
+
+jobs:
+  lint:
+    name: lint
+    strategy:
+      matrix:
+        os: [ubuntu-latest, macos-latest]
+    runs-on: ${{ matrix.os }}
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # pin@v6.0.2
+
+      - name: bootstrap
+        run: script/bootstrap
+
+      - name: lint
+        run: script/lint

.github/workflows/test.yml

@@ -0,0 +1,30 @@
+name: test
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+permissions:
+  contents: read
+
+jobs:
+  test:
+    name: test
+    strategy:
+      matrix:
+        os: [ubuntu-latest, macos-latest]
+    runs-on: ${{ matrix.os }}
+
+    steps:
+      - name: checkout
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # pin@v6.0.2
+
+      - name: bootstrap
+        run: script/bootstrap
+
+      - name: test
+        run: script/test

.gitignore

@@ -18,3 +18,8 @@ tmp/
 
 # Local development files
 *.local
+
+# Hugo build artifacts
+public/
+resources/_gen/
+.hugo_build.lock

README.md

@@ -1,5 +1,9 @@
 # dario 🖊️
 
+[![lint](https://github.com/GrantBirki/dario/actions/workflows/lint.yml/badge.svg)](https://github.com/GrantBirki/dario/actions/workflows/lint.yml)
+[![test](https://github.com/GrantBirki/dario/actions/workflows/test.yml/badge.svg)](https://github.com/GrantBirki/dario/actions/workflows/test.yml)
+[![build](https://github.com/GrantBirki/dario/actions/workflows/build.yml/badge.svg)](https://github.com/GrantBirki/dario/actions/workflows/build.yml)
+
 A minimal hugo theme inspired by Dario Amodei's personal [website](https://darioamodei.com/). It is designed to be as minimal, performant, and as elegant as possible for reading.
 
 View the [live demo](https://log.birki.io) to see what it looks like ([source code](https://github.com/GrantBirki/dario)).
@@ -12,6 +16,19 @@ This theme is designed to be minimal and the page speed insights are as follows:
 
 ![100](https://raw.githubusercontent.com/GrantBirki/dario/main/docs/assets/100.png)
 
+## Development
+
+This repository follows the ["scripts to rule them all"](https://github.blog/engineering/scripts-to-rule-them-all/) pattern:
+
+```bash
+script/bootstrap
+script/lint
+script/test
+script/build
+```
+
+CI executes these same scripts directly.
+
 ## Installation
 
 > To view a real example of a project using this theme, check out [grantbirki/log](https://github.com/GrantBirki/log) which is where I have the demo deployed.
@@ -188,7 +205,7 @@ Set the `disableSocialMeta` parameter to turn off HTML tags related to [Open Gra
 ```
 
 If you wish to add your own non-standard meta tags for things like Bitcoin,
-PGP, and so on, you can add them in `layouts/partials/nonstdmeta.md`:
+PGP, and so on, you can add them in `layouts/partials/nonstdmeta.html`:
 
 ```html
 <meta name="email" content="mail@example.com">

assets/css/default.css

@@ -2,16 +2,16 @@
   font-family: "Newsreader";
   font-style: normal;
   font-weight: 200 800;
-  font-display: block;
-  src: url("/fonts/Newsreader.woff2") format("woff2");
+  font-display: swap;
+  src: url("../fonts/Newsreader.woff2") format("woff2");
 }
 
 @font-face {
   font-family: "Newsreader";
   font-style: italic;
   font-weight: 200 800;
-  font-display: block;
-  src: url("/fonts/Newsreader-italic.woff2") format("woff2");
+  font-display: swap;
+  src: url("../fonts/Newsreader-italic.woff2") format("woff2");
 }
 
 :root {
@@ -22,6 +22,7 @@
   --content-max-inline-size: 620px;
   --content-padding: 20px;
   --focus-color: #0066cc;
+  --muted-text-color: #666666;
 }
 
 body,
@@ -55,6 +56,7 @@ header h1 a {
   --invert-percentage: 100%;
   --code-bg: rgb(55, 56, 62);
   --hljs-bg: rgb(46, 46, 51);
+  --muted-text-color: #b3b3b3;
 }
 
 .dark-mode-off:root {
@@ -76,6 +78,7 @@ header h1 a {
   --invert-percentage: 0%;
   --code-bg: rgb(223, 223, 223);
   --hljs-bg: rgb(28, 29, 33);
+  --muted-text-color: #666666;
 }
 
 @media (prefers-color-scheme: dark) {
@@ -98,6 +101,7 @@ header h1 a {
     --invert-percentage: 100%;
     --code-bg: rgb(55, 56, 62);
     --hljs-bg: rgb(46, 46, 51);
+    --muted-text-color: #b3b3b3;
   }
 }
 
@@ -121,6 +125,7 @@ header h1 a {
     --invert-percentage: 0%;
     --code-bg: rgb(223, 223, 223);
     --hljs-bg: rgb(28, 29, 33);
+    --muted-text-color: #666666;
   }
 }
 
@@ -196,6 +201,10 @@ h6:hover .anchor {
   opacity: 0.5;
 }
 
+.anchor {
+  display: none;
+}
+
 a {
   color: inherit;
   text-decoration: underline;
@@ -238,7 +247,7 @@ header > div {
   box-sizing: border-box;
 }
 
-@media (min-inline-size: 1076px) {
+@media (min-width: 1076px) {
   body.has-toc .content-wrapper,
   body.has-toc header > div {
     max-inline-size: var(--content-max-inline-size);
@@ -356,6 +365,11 @@ p a:hover {
   background-color: var(--bg-color);
 }
 
+.toggle-input:focus-visible + .toggle-label {
+  outline: 2px solid var(--focus-color);
+  outline-offset: 2px;
+}
+
 /* Typography */
 h1,
 h2,
@@ -407,7 +421,7 @@ center {
 }
 
 /* Mobile Typography */
-@media (max-inline-size: 1076px) {
+@media (max-width: 1076px) {
   h1 {
     font-size: 2.4em;
   }
@@ -424,7 +438,7 @@ center {
 .author-date {
   font-weight: 400;
   font-size: 0.9em;
-  color: #767676;
+  color: var(--muted-text-color);
   margin-block-start: 2em;
   margin-block-end: 0em;
   line-height: 1.4;
@@ -453,7 +467,7 @@ hr:after {
   text-align: center;
 }
 
-@media (min-inline-size: 1400px) {
+@media (min-width: 1400px) {
   .content-wrapper,
   header > div {
     max-inline-size: var(--content-max-inline-size);

layouts/_default/baseof.html

@@ -7,7 +7,7 @@
 {{ partial "head.html" . }}
 
 <body>
-{{ partial "header.html" . }}
+{{ partialCached "header.html" . .Site.Language.Lang }}
 
     <main class="content-wrapper">
         <article class="content-container">
@@ -17,7 +17,7 @@
         </article>
     </main>
 
-{{ partial "footer.html" . }}
+{{ partialCached "footer.html" . .Site.Language.Lang now.Year }}
 </body>
 
 </html>

layouts/_default/single.html

@@ -6,13 +6,5 @@ <h4>{{ .Params.description }}</h4>
     <p class="author-date">{{ printf `<time datetime="%s">%s</time>` (.Date.Format "2006-01-02T15:04:05Z07:00") (.Date.Format "January 2, 2006") | safeHTML }}</p>
     {{- end }}
 
-    {{- if not (.Param "disableAnchoredHeadings") }}
-
-{{ partial "anchored_headings.html" .Content }}
-
-    {{- else }}
-
 {{ .Content }}
-
-    {{- end }}
 {{- end }}

layouts/_markup/render-heading.html

@@ -0,0 +1,3 @@
+{{- $disableAnchoredHeadings := .Page.Param "disableAnchoredHeadings" -}}
+{{- $anchor := .Anchor | safeURL -}}
+<h{{ .Level }} id="{{ .Anchor }}">{{ .Text }}{{- if not $disableAnchoredHeadings -}}<a class="anchor" aria-hidden="true" href="#{{ $anchor }}">#</a>{{- end -}}</h{{ .Level }}>

layouts/index.html

@@ -5,15 +5,7 @@ <h1>{{ .Title | .RenderString }}</h1>
     <h4>{{ .Params.description }}</h4>
     <p class="author-date"><time datetime="{{ .Date }}">{{ .Date.Format "January 2, 2006" }}</time> - {{ .Params.author }}</p>
 
-            {{- if not (.Param "disableAnchoredHeadings") }}
-
-{{ partial "anchored_headings.html" .Content }}
-
-            {{- else }}
-
 {{ .Content }}
-
-            {{- end }}
         {{- else }}
             {{- $subtitle := .Params.subtitle }}
             {{- with .Content }}

layouts/partials/head.html

@@ -2,11 +2,12 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-    {{- with (partial "objects/author.html" .).name }}
+    {{- $author := partialCached "objects/author.html" . .Site.Language.Lang -}}
+    {{- with $author.name }}
     <meta name="author" content="{{ . }}">
     {{- end }}
 
-    {{- $page := partial "objects/page.html" . }}
+    {{- $page := partialCached "objects/page.html" . .RelPermalink -}}
     <meta name="description" content="{{- $page.description -}}">
     <title>{{ $page.title }}</title>
 
@@ -22,7 +23,6 @@
 
     {{- if not .Site.Params.disableFontPreload }}
     <link rel="preload" href="{{ "fonts/Newsreader.woff2" | relURL }}" as="font" type="font/woff2" crossorigin>
-    <link rel="preload" href="{{ "fonts/Newsreader-italic.woff2" | relURL }}" as="font" type="font/woff2" crossorigin>
     {{- end }}
 
     {{- $defaultCSS := resources.Get "css/default.css" | minify | fingerprint }}
@@ -33,16 +33,24 @@
         {{- end }}
     {{- end }}
 
+    {{- if fileExists "static/favicon.ico" }}
     <link rel="icon" type="image/x-icon" href="{{ "favicon.ico" | relURL }}">
+    {{- end }}
+    {{- if fileExists "static/apple-touch-icon.png" }}
     <link rel="apple-touch-icon" href="{{ "apple-touch-icon.png" | relURL }}">
+    {{- end }}
 
     {{- if or (not .Site.Params.colorScheme) (eq .Site.Params.colorScheme "toggle") }}
     {{- $darkmodeJS := resources.Get "js/darkmode.js" | minify | fingerprint }}
     <script src="{{ $darkmodeJS.RelPermalink }}" integrity="{{ $darkmodeJS.Data.Integrity }}" defer></script>
     {{- end }}
 
-    {{- $footnotesJS := resources.Get "js/footnotes.js" | minify | fingerprint }}
+    {{- with .Content }}
+        {{- if or (in . "id=\"fnref") (in . "class=\"footnote-ref\"") }}
+            {{- $footnotesJS := resources.Get "js/footnotes.js" | minify | fingerprint }}
     <script src="{{ $footnotesJS.RelPermalink }}" integrity="{{ $footnotesJS.Data.Integrity }}" defer></script>
+        {{- end }}
+    {{- end }}
 
     {{- if templates.Exists "partials/nonstdmeta.html" }}
 {{ partial "nonstdmeta.html" . }}