diff --git a/.github/.hugo-version b/.github/.hugo-version new file mode 100644 index 0000000..b97a9dd --- /dev/null +++ b/.github/.hugo-version @@ -0,0 +1 @@ +0.156.0 diff --git a/.github/vendor/bin/hugo_extended_0.156.0_darwin-universal.pkg b/.github/vendor/bin/hugo_extended_0.156.0_darwin-universal.pkg new file mode 100644 index 0000000..f53ac9a Binary files /dev/null and b/.github/vendor/bin/hugo_extended_0.156.0_darwin-universal.pkg differ diff --git a/.github/vendor/bin/hugo_extended_0.156.0_linux-amd64.deb b/.github/vendor/bin/hugo_extended_0.156.0_linux-amd64.deb new file mode 100644 index 0000000..b2cbf85 Binary files /dev/null and b/.github/vendor/bin/hugo_extended_0.156.0_linux-amd64.deb differ diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml new file mode 100644 index 0000000..f460461 --- /dev/null +++ b/.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 diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml new file mode 100644 index 0000000..5864342 --- /dev/null +++ b/.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 diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml new file mode 100644 index 0000000..b1f5816 --- /dev/null +++ b/.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 diff --git a/.gitignore b/.gitignore index 0e687e6..984b0c2 100644 --- a/.gitignore +++ b/.gitignore @@ -18,3 +18,8 @@ tmp/ # Local development files *.local + +# Hugo build artifacts +public/ +resources/_gen/ +.hugo_build.lock diff --git a/README.md b/README.md index eb80c05..4d6b3b2 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,9 @@ # dario 🖊️ +[](https://github.com/GrantBirki/dario/actions/workflows/lint.yml) +[](https://github.com/GrantBirki/dario/actions/workflows/test.yml) +[](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:  +## 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 diff --git a/assets/css/default.css b/assets/css/default.css index 9f77266..30c1942 100644 --- a/assets/css/default.css +++ b/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); diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 8a4b16d..55c2612 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -7,7 +7,7 @@ {{ partial "head.html" . }}
-{{ partial "header.html" . }} +{{ partialCached "header.html" . .Site.Language.Lang }}