Drop backdrop-blur on secondary for a consistent hue-tied tint

Sampling whatever's behind the button via backdrop-filter meant two
secondary buttons could render differently depending on what happened
to be nearby (e.g. dark album art bleeding into the blur), so
"Explorar musica" and "Aleatorio" ended up visibly different colors
despite being the same variant. Replace it with a fixed, hue-tied
translucent tint (bg-accent-tint, the same token family accent already
uses) so every secondary button computes to the identical color, ties
into the same dynamic accent hue as the rest of the app, and reads as
a softer sibling of the accent button instead of an unrelated gray.

Hover now steps up to bg-accent-btn (same hue family, stronger) instead
of a flat, hue-agnostic gray. Removed the now-unused --mf-btn-bg-hover/
--color-btn-hover tokens.
This commit is contained in:
2026-09-22 17:34:34 +02:00
parent 4fbd4fa81d
commit b82fca0bc2
3 changed files with 1 additions and 4 deletions
@@ -36,7 +36,7 @@
const variants = {
primary: 'bg-cta-strong text-ink hover:brightness-95',
secondary: 'bg-elevated/45 backdrop-blur-lg text-fg-2 hover:bg-btn-hover hover:text-fg',
secondary: 'bg-accent-tint text-fg-2 hover:bg-accent-btn hover:text-fg',
accent: 'bg-accent-btn text-accent-soft hover:bg-accent-btn-hover',
danger: 'bg-danger text-on-art hover:brightness-110'
};