From 36f68004e3076d7ea9af91c1441693b6c34ae117 Mon Sep 17 00:00:00 2001 From: VeniaSilente <veniasilente@protonmail.com> Date: Mon, 12 May 2025 15:30:49 -0400 Subject: [PATCH] Feature tests; link decoration; set-up for AO3 draft. --- feature-tests.css | 113 +++++++++++++++++++++++++++++++++++++++++++ styles/interwiki.css | 97 +++++++++++++++++++++++++++++++++++++ 2 files changed, 210 insertions(+) create mode 100644 feature-tests.css create mode 100644 styles/interwiki.css diff --git a/feature-tests.css b/feature-tests.css new file mode 100644 index 0000000..49c9d3c --- /dev/null +++ b/feature-tests.css @@ -0,0 +1,113 @@ +/* feature tests */ + +.feature-tests { + font-size: 85%; + --test-border: blue; +} + +.feature-tests span.test-colorfn-rgb { + border: 1px solid rgb(50,50,100,1.0); +} + +.feature-tests span.test-colorfn-hsl { + border: 1px solid hsl(36deg 50% 60%); +} + +.feature-tests span.test-colorfn-oklab { + border: 1px solid oklab(59% 0.1 0.1); +} + +.feature-tests span.test-colorfn-button { + color: ButtonFace; + background-color: ButtonText; +} + +.feature-tests span.test-colorfn-accent { + color: AccentColor; + background-color: AccentColorText; +} + +.feature-tests span.tests-length { + display: inline-block; + height: 0.5lh; + border-top: 1px solid gray; +} + +.feature-tests span.tests-length.cm { + width: 5cm; +} + +.feature-tests span.tests-length.ch { + width: 4ch; +} + +.feature-tests span.tests-length.vw { + width: 25vw; +} + +.feature-tests span.test-colorscheme { + border: 1px solid blue; + min-width: 2ch; +} + +.feature-tests span.test-orientation { + border: 1px solid blue; + min-width: 2ch; +} + +@media (prefers-color-scheme: light) { + .feature-tests span.test-colorscheme:after { + content: "light"; + } +} + +@media (prefers-color-scheme: dark) { + .feature-tests span.test-colorscheme:after { + content: "dark"; + } +} + +@media (orientation: landscape) { + .feature-tests span.test-orientation::after { + content: "landscape"; + } +} + +@media (orientation: portrait) { + .feature-tests span.test-orientation::after { + content: "portrait"; + } +} + +.feature-tests span.test-variable { + border: 1px solid var(--test-border, red); +} + +.feature-tests [lang="es"] { + border: 1px solid yellow; +} + +.feature-tests :lang(fr) { + border: 1px solid blue; +} + +.feature-tests span.test-content::after { + content: attr(data-checkmark); +} + +.feature-tests span.test-property[data-border] { + border: 1px solid transparent; + border-color: attr(data-border); +} + +.feature-tests span[data-opacity] { + --tone: 50; + border: none; + border: 1px solid rgb(0, 0, calc(200 + var(--tone))); +} + +.feature-tests span[data-blink="yes"] { + animation: blinker 2s step-start infinite; + border: 1px solid blue; +} + diff --git a/styles/interwiki.css b/styles/interwiki.css new file mode 100644 index 0000000..b044bca --- /dev/null +++ b/styles/interwiki.css @@ -0,0 +1,97 @@ +/* + * begin interwiki.css + * */ + +/* + * Note: AO3 does not support CSS variables as of 2024-01-01. + * */ +/* +#workskin a { + --ext-mark-1: '↦'; + --ext-mark-2: '↪'; + --ext-mark-vs: 'ṽ'; +} +*/ + +a.interwiki::before { + display: inline-block; + width: 2.2ex; + margin: 0 auto; + text-align: center; + vertical-align: middle; +} + +a.interwiki::before { + content: '↪'; +} + +a[href^="#"]::before { + display: inline-block; + width: 1.0ch; + content: '§'; +} + +a[href*="wikipedia.org/"]:not(.no-interwiki) , +a[href*="wikifunctions.org/"] , +a[href*="wikiquote.org/"] , +a[href*="wikisource.org/"] , +a[href*="wiktionary.org/"] +{ + text-decoration-style: double; + color: navy; +} + +a[href*="wikipedia.org/"]:not(.no-interwiki)::before , +a[href*="wikifunctions.org/"]::before , +a[href*="wikiquote.org/"]::before , +a[href*="wikisource.org/"]::before , +a[href*="wiktionary.org/"]::before +{ + display: inline-block; + width: 2ch; + color: #337; + background-color: #ccc; + font-size: 75%; + content: 'W'; +} + +a[href*="archiveofourown.org/"] { + text-decoration-style: double; + font-family: sans-serif; +} + +a[href*="archiveofourown.org/"]::before { + display: inline-block; + width: 2ch; + color: #cc7; + background-color: #860303; + text-align: center; + font-size: 75%; + content: '~'; +} + +#workskin a[href*="veniasilente.user.tropi.us/"] { + color: darkgreen; +} + +#workskin a[href*="veniasilente.user.tropi.us/"]::before { + content: 'ṽ'; + color: yellow; + background-color: #37d818; + font-size: 75%; +} + +#workskin a[href*="suoceverse.tropi.us/"] { + color: green; +} + +#workskin a[href*="suoceverse.tropi.us/"]::before { + content: 'ṽ'; + color: blue; + background-color: orchid; + font-size: 75%; +} + +/* + * end interwiki.css + * */