vole
Clone
Read only, no credentials:
https://rodent.software/git/vole.git
Write over SSH with a registered key:
git clone ssh://git@0.0.0.0:2222/vole.git
A free and open-source forge that lives in your Git repo.
Mix the avatar palette from the active theme
214145e539d0f9f6e0420375e3c011994eed9bde · Keenan Nemetz · 7d ago · parent df894c4f
Mix the avatar palette from the active theme The seven grounds were fixed hexes, so a mark looked the same on every Everforest variant and did not really belong to any of them. They are now mixed from the active variant's own accents toward its panel colour, in everforest.css, and the tone class just picks one. The disc is the theme's moon or sun colours and the ink the hills shade toward is the theme's darkest token. Two shares of accent, because the panels are opposite: a dark theme's panel is nearly black, so its grounds keep 80% of the accent to stay a colour, while a light panel is nearly white and keeps 48% so the landscape is pastel rather than a highlighter. A custom property holding color-mix() reads back as text, so the bundle resolves the palette through one hidden probe element and caches it per theme; app.js already redraws the avatars when data-theme changes, so a theme switch re-reads it. The fallback letter now takes --av-fg, which is the theme's foreground, so it stays readable on a light theme's pastel grounds.
server/web/static/everforest.css +38
| @@ -167,6 +167,17 @@ | |||
| 167 | 167 | --syn-variable: var(--ef-fg); | |
| 168 | 168 | --syn-added: var(--ef-green); | |
| 169 | 169 | --syn-deleted: var(--ef-red); | |
| 170 | |||
| 171 | /* A name's landscape. The disc is the moon on a dark theme, the ink is what the | ||
| 172 | hills are shaded toward, and the seven grounds are mixed below. */ | ||
| 173 | --av-fg: var(--ef-fg); | ||
| 174 | --av-ink: var(--ef-bg0); | ||
| 175 | /* How much of the accent survives the mix into the panel colour. A dark | ||
| 176 | theme's panel is close to black, so it needs a high share to stay a colour. */ | ||
| 177 | --av-tint: 80%; | ||
| 178 | --av-disc-1: var(--ef-fg); | ||
| 179 | --av-disc-2: var(--ef-grey2); | ||
| 180 | --av-disc-3: var(--ef-blue); | ||
| 170 | 181 | } | |
| 171 | 182 | ||
| 172 | 183 | /* ---------- light tokens ---------- */ | |
| @@ -214,6 +225,33 @@ | |||
| 214 | 225 | --syn-variable: var(--ef-fg); | |
| 215 | 226 | --syn-added: var(--ef-green); | |
| 216 | 227 | --syn-deleted: var(--ef-red); | |
| 228 | |||
| 229 | /* The same landscape on a light theme: the disc is the sun, and the ink the | ||
| 230 | hills are shaded toward is the dark foreground. */ | ||
| 231 | --av-fg: var(--ef-fg); | ||
| 232 | --av-ink: var(--ef-fg); | ||
| 233 | /* A light theme's panel is already near white, so the accent needs less of the | ||
| 234 | mix to stay a colour and more of it would be a highlighter. */ | ||
| 235 | --av-tint: 48%; | ||
| 236 | --av-disc-1: var(--ef-yellow); | ||
| 237 | --av-disc-2: var(--ef-orange); | ||
| 238 | --av-disc-3: var(--ef-red); | ||
| 239 | } | ||
| 240 | |||
| 241 | /* ---------- avatar palette ---------- */ | ||
| 242 | |||
| 243 | /* The seven grounds a name hashes to, mixed from the palette's own accents toward | ||
| 244 | the panel so a mark reads as land and sky rather than as a link. They follow the | ||
| 245 | active variant, which is why a mark changes with the theme like the rest of the | ||
| 246 | page. */ | ||
| 247 | :root[data-theme^="everforest-"] { | ||
| 248 | --av-c1: color-mix(in srgb, var(--ef-green) var(--av-tint), var(--ef-bg2)); | ||
| 249 | --av-c2: color-mix(in srgb, var(--ef-orange) var(--av-tint), var(--ef-bg2)); | ||
| 250 | --av-c3: color-mix(in srgb, var(--ef-red) var(--av-tint), var(--ef-bg2)); | ||
| 251 | --av-c4: color-mix(in srgb, var(--ef-blue) var(--av-tint), var(--ef-bg2)); | ||
| 252 | --av-c5: color-mix(in srgb, var(--ef-purple) var(--av-tint), var(--ef-bg2)); | ||
| 253 | --av-c6: color-mix(in srgb, var(--ef-yellow) var(--av-tint), var(--ef-bg2)); | ||
| 254 | --av-c7: color-mix(in srgb, var(--ef-aqua) var(--av-tint), var(--ef-bg2)); | ||
| 217 | 255 | } | |
| 218 | 256 | ||
| 219 | 257 | /* ---------- syntax highlighting ---------- */ | |