From 8c1df54b8b170adf81ffc2bfb5d49704b229647f Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Tue, 15 Oct 2024 23:17:05 -0300 Subject: content, css: generateDotSwitcherTemplate --- .../dependencies/generateDotSwitcherTemplate.js | 29 ++++++++++++++++++++++ src/static/css/site.css | 19 ++++++++++++++ 2 files changed, 48 insertions(+) create mode 100644 src/content/dependencies/generateDotSwitcherTemplate.js (limited to 'src') diff --git a/src/content/dependencies/generateDotSwitcherTemplate.js b/src/content/dependencies/generateDotSwitcherTemplate.js new file mode 100644 index 00000000..6d350b22 --- /dev/null +++ b/src/content/dependencies/generateDotSwitcherTemplate.js @@ -0,0 +1,29 @@ +export default { + extraDependencies: ['html', 'language'], + + slots: { + attributes: { + type: 'attributes', + mutable: false, + }, + + options: { + validate: v => v.strictArrayOf(v.isHTML), + }, + + initialOptionIndex: {type: 'number'}, + }, + + generate: (slots, {html, language}) => + html.tag('span', {class: 'dot-switcher'}, + slots.attributes, + + language.formatListWithoutSeparator( + slots.options + .map((option, index) => + html.tag('span', + index === slots.initialOptionIndex && + {class: 'current'}, + + option)))), +}; diff --git a/src/static/css/site.css b/src/static/css/site.css index b49464e0..d4d9deb1 100644 --- a/src/static/css/site.css +++ b/src/static/css/site.css @@ -822,6 +822,25 @@ a:not([href]):hover { content: "\0020/\0020"; } +.dot-switcher > span:not(:first-child)::before { + content: "\0020\00b7\0020"; + font-weight: 800; +} + +.dot-switcher > span.current { + font-weight: 800; +} + +.dot-switcher > span:not(.current) a { + text-decoration: underline; + text-decoration-style: dotted; +} + +.dot-switcher > span.current a { + /* Keeping cursor: pointer (the default) is intentional here. */ + text-decoration: none !important; +} + #secondary-nav { text-align: center; } -- cgit 1.3.0-6-gf8a5