Sign in

Search issue titles and bodies, change requests and comments. Private repositories you cannot read are not included.

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 ---------- */