From 70b8a5e9cb3f9eafdbce680529ed15dc74d6f6c7 Mon Sep 17 00:00:00 2001 From: Rohan Kumar Date: Thu, 7 Jul 2022 17:05:33 -0700 Subject: [PATCH] re-org the About section, add breadcrumbs Create an "about" section. Add breadcrumbs to show relationships between pages with full page titles. --- Makefile | 2 +- assets/css/main.css | 43 +++++++++++++--------- assets/css/print.css | 3 +- config.toml | 1 + content/about/{index.gmi => _index.gmi} | 6 +-- content/about/{index.md => _index.md} | 5 +-- content/{ => about}/fediverse-greeting.gmi | 0 content/{ => about}/fediverse-greeting.md | 2 +- content/{ => about}/uses.gmi | 0 content/{ => about}/uses.md | 0 layouts/about/list.html | 37 +++++++++++++++++++ layouts/partials/breadcrumblist.html | 29 +++++++++++++++ layouts/partials/header.html | 1 + layouts/partials/post-meta.html | 2 + linter-configs/stylelintrc.json | 3 +- 15 files changed, 106 insertions(+), 28 deletions(-) rename content/about/{index.gmi => _index.gmi} (95%) rename content/about/{index.md => _index.md} (98%) rename content/{ => about}/fediverse-greeting.gmi (100%) rename content/{ => about}/fediverse-greeting.md (88%) rename content/{ => about}/uses.gmi (100%) rename content/{ => about}/uses.md (100%) create mode 100644 layouts/about/list.html create mode 100644 layouts/partials/breadcrumblist.html diff --git a/Makefile b/Makefile index e5333d6..a60b803 100644 --- a/Makefile +++ b/Makefile @@ -117,7 +117,7 @@ deploy-html: .PHONY: deploy-gemini deploy-gemini: - rsync $(RSYNCFLAGS) --exclude '*.html' --exclude '*.xml' --exclude '*.xhtml' --exclude '*.gz' --exclude '*.br' --exclude-from .rsyncignore $(OUTPUT_DIR)/gemini/ $(OUTPUT_DIR)/about $(OUTPUT_DIR)/posts $(OUTPUT_DIR)/publickey.* $(GEMINI_RSYNC_DEST)/ --delete + rsync $(RSYNCFLAGS) --exclude '*.html' --exclude '*.xml' --exclude '*.xhtml' --exclude '*.gz' --exclude '*.br' --exclude-from .rsyncignore $(OUTPUT_DIR)/gemini/ $(OUTPUT_DIR)/about $(OUTPUT_DIR)/posts $(OUTPUT_DIR)/about $(OUTPUT_DIR)/publickey.* $(GEMINI_RSYNC_DEST)/ --delete .PHONY: deploy deploy: deploy-html deploy-gemini diff --git a/assets/css/main.css b/assets/css/main.css index 885830c..383dbad 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -110,8 +110,11 @@ html { * paragraph are section permalinks. */ input, + div[itemprop="comment"] dd > a, dt > a, summary, + nav[itemprop="breadcrumb"] a, + nav[itemprop="breadcrumb"] > span, aside > a, /* Used for section permalinks */ li > a { padding: .75em .25em; @@ -138,14 +141,11 @@ html { padding-bottom: .25em; } - header > nav { - margin-bottom: -1em; - } - aside > a { margin: -.75em -.25em; } + div[itemprop="comment"] dd > a , footer > nav, header > nav, /* List items with direct hyperlink children should only have one hyperlink. */ @@ -161,17 +161,11 @@ html { padding-top: 0; } - nav li, + nav:not([itemprop="breadcrumb"]) li, ol li > a { margin: .25em; } - div[itemprop="comment"] dd > a { - display: inline-block; - margin-left: -.25em; - padding: .75em .25em; - } - /* Increase backlink tap target size */ a[role="doc-backlink"] { padding: 0 1.75em 1.5em .25em; @@ -195,10 +189,12 @@ ul { padding-left: 1.5em; } +blockquote, ol ol, ul ul { -webkit-hyphens: auto; hyphens: auto; + margin: 0; padding-left: 1em; } @@ -211,6 +207,22 @@ nav ul { padding: 0; } +/* Make breadcrumbs inline, so they look familiar. */ +nav[itemprop="breadcrumb"] ol, +nav[itemprop="breadcrumb"] li, +nav[itemprop="breadcrumb"] > span { + display: inline-block; +} + +nav[itemprop="breadcrumb"] ol { + margin: -.25em 0; + padding: 0; +} + +nav[itemprop="breadcrumb"] li:not(:last-of-type)::after { + content: "→"; +} + /* step 2: remove bullets and make elements inline. * Also: bump up the line-height and margins to increase space * between tap-targets (SC 2.5.5). Google a11y guidelines require 8 CSS @@ -219,15 +231,10 @@ nav ul li { display: inline-block; margin-right: .5em; } - -/* narrow screens: reduce margin for blockquotes a lot, using - * a border instead. Put it on the left and right to make it - * LTR/RTL-neutral, for machine translators that change text - * direction (e.g. the one in Edge). */ +/* narrow screens: we reduce margin for blockquotes a lot, using + * a border instead. */ blockquote { border-left: 3px solid; - margin: 0; - padding: 0 1em; } /* Narrow screens: allow hyphenating titles diff --git a/assets/css/print.css b/assets/css/print.css index f372991..97ed969 100644 --- a/assets/css/print.css +++ b/assets/css/print.css @@ -19,7 +19,8 @@ /* splitting up sections with
is unnecesary if those * sections are removed */ body > hr, - nav a:not([rel="home"]) span { + nav a:not([rel="home"]) span, + nav[itemprop="breadcrumb"] { display: none; } } diff --git a/config.toml b/config.toml index 32b69cf..f6666fd 100644 --- a/config.toml +++ b/config.toml @@ -112,6 +112,7 @@ disableKinds = ["taxonomy", "term"] section = ["HTML", "atom", "RSS"] posts = ["HTML", "atom", "RSS"] notes = ["HTML", "atom", "RSS"] + about = ["HTML", "atom", "RSS"] # https://github.com/nekr0z/static-webmentions [webmentions] diff --git a/content/about/index.gmi b/content/about/_index.gmi similarity index 95% rename from content/about/index.gmi rename to content/about/_index.gmi index d95ef9d..45f5097 100644 --- a/content/about/index.gmi +++ b/content/about/_index.gmi @@ -58,7 +58,7 @@ My username is Seirdy on Reddit, Hacker News, Lobsters, Tildes.net, Linux Weekly My secondary Matrix account for Synapse-only rooms is @seirdy:fairydust.space. My Matrix account used to be @seirdy:envs.net but I've since migrated to my own Conduit server. If you want to follow me on Fedi, read this first: -=> ../fediverse-greeting/ Fediverse greeting +=> ./fediverse-greeting/ Fediverse greeting If you find a "Seirdy" somewhere else and don't know whether or not it's me, please contact me and ask instead of assuming that it must be me. @@ -79,7 +79,7 @@ Analyze WeeChat logs to quantify, graph, forecast, and perform anomaly-detection Generate passwords and analyze password strength given physical limits to computing. Based on a weblog/gemlog entry: -=> ../posts//2021/01/12/password-strength/ Becoming physically immune to brute-force attacks +=> ../posts/2021/01/12/password-strength/ Becoming physically immune to brute-force attacks Written in Go. @@ -115,7 +115,7 @@ Some software I use: Fedora, Alpine Linux, SwayWM, mpv, mpd, Minetest, Neovim, t More information is available in my "uses" page. -=> ../uses/ Software I use +=> ./uses/ Software I use ### Anime diff --git a/content/about/index.md b/content/about/_index.md similarity index 98% rename from content/about/index.md rename to content/about/_index.md index a009539..dd16486 100644 --- a/content/about/index.md +++ b/content/about/_index.md @@ -1,6 +1,5 @@ --- date: 2020-10-30 -layout: post title: About Seirdy (Rohan Kumar) outputs: - html @@ -80,7 +79,7 @@ At least two platforms listed in the "Social (centralized)" category are not end I used to have the Matrix ID `@seirdy:envs.net`. I sometimes use `@seirdy:fairydust.space` for technical reasons (seirdy.one runs a Conduit server but certain features only work in Synapse rooms). -If you want to follow me on the Fediverse, [read my Fediverse greeting first](../fediverse-greeting/) +If you want to follow me on the Fediverse, [read my Fediverse greeting first]({{}}) Poggies @@ -122,7 +121,7 @@ I lean towards simplicity; I usually prefer line-mode command-line interfaces th There are exceptions, of course: I use a Linux distro with Systemd (Fedora), after all. When I use a graphical program, it's typically for things for which graphics are an inherent requirement or for accessibility reasons (most textual user interfaces don't play well with screen readers). -More information is available in [my "uses" page](../uses/). +More information is available in [my "uses" page]({{}}). ### Anime diff --git a/content/fediverse-greeting.gmi b/content/about/fediverse-greeting.gmi similarity index 100% rename from content/fediverse-greeting.gmi rename to content/about/fediverse-greeting.gmi diff --git a/content/fediverse-greeting.md b/content/about/fediverse-greeting.md similarity index 88% rename from content/fediverse-greeting.md rename to content/about/fediverse-greeting.md index 02ed0ab..96180f4 100644 --- a/content/fediverse-greeting.md +++ b/content/about/fediverse-greeting.md @@ -38,7 +38,7 @@ I try to always always add content-warnings ( + {{- $articleTag := printf `
` .Site.Params.CanonicalBaseURL $canonicalRelPermalink -}} + {{ partial "full-article.html" . | replaceRE `
` $articleTag | safeHTML }} +
+
+

More about me

+

+ Timestamp format: YYYY-MM-DD HH:MM, as per RFC 3339. Sorted newest to oldest. +

+
    + {{- $pages := (where site.RegularPages "Section" .Section) -}} + {{- range $pages -}} + {{- $canonicalRelPermalink := .RelPermalink | replaceRE "^/~seirdy/" "/" -}} +
  1. +
    +

    + +

    +

    + Posted + {{- if gt (sub .Lastmod.Unix .Date.Unix) 3600 -}} + , updated {{ .Lastmod.Format "2006-01-02 15:04" }} + {{- end }} +

    +

    {{ .Description }}

    +

    {{- partial "wordcount.html" . -}}

    +
    +
    2. + {{- end }} +
+
+ +{{ end }} diff --git a/layouts/partials/breadcrumblist.html b/layouts/partials/breadcrumblist.html new file mode 100644 index 0000000..ddd7195 --- /dev/null +++ b/layouts/partials/breadcrumblist.html @@ -0,0 +1,29 @@ +{{/* All pages are one or two clicks from the navbar. If two clicks, add a breadcrumb list. */}} +{{- if and (not .IsHome) (not .Parent.IsHome) -}} +
+ +{{- end -}} +{{ define "breadcrumbnav" }} +{{ if .p1.Parent }} +{{ template "breadcrumbnav" (dict "p1" .p1.Parent "p2" .p2 ) }} +{{ end }} +{{- if not .p1.IsHome -}} + {{- $isCurrent := eq .p1 .p2 -}} + {{- /* The position is either "1" or "2" since the list is 2 elements long. */ -}} + {{- $position := "1" -}} + {{- if $isCurrent -}} + {{- $position = "2" -}} + {{- end -}} +
  • + + {{ .p1.Title }} + +
    • +{{- end -}} +{{ end }} diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 497706d..a960aa9 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -35,4 +35,5 @@ {{- end }} + {{ partial "breadcrumblist.html" . }} diff --git a/layouts/partials/post-meta.html b/layouts/partials/post-meta.html index 86547d8..a702aeb 100644 --- a/layouts/partials/post-meta.html +++ b/layouts/partials/post-meta.html @@ -8,6 +8,7 @@ {{- else -}} {{- $logURL = $logURL | strings.ReplaceRE `\.md` `.gmi` -}} {{- end -}} +

    {{- $action }} {{ .Date.Format "2006-01-02" }} by {{ partial "indieweb-author.html" -}} on his {{- with .OutputFormats.Get "gemtext" -}}{{- printf " " -}}and Gemini capsule{{- end -}}. {{- if gt (sub .Lastmod.Unix .Date.Unix) 900 -}}
    @@ -17,3 +18,4 @@
    {{ partial "wordcount.html" . -}} {{- end -}} +

    diff --git a/linter-configs/stylelintrc.json b/linter-configs/stylelintrc.json index 3a9dc4d..3030416 100644 --- a/linter-configs/stylelintrc.json +++ b/linter-configs/stylelintrc.json @@ -4,6 +4,7 @@ "font-family-no-duplicate-names": [ true, { "ignoreFontFamilyNames": ["monospace"] } ], "indentation": "tab", "max-nesting-depth": 1, - "selector-max-compound-selectors": 3 + "selector-max-compound-selectors": 3, + "no-descending-specificity": null } }