fix(skins): preserve Liquid mood tile gradient from shadow-lg capture#291
fix(skins): preserve Liquid mood tile gradient from shadow-lg capture#291InstaZDLL wants to merge 1 commit into
Conversation
The "modals + tooltips + popovers" rule substring-matches [class*="shadow-lg"] to repaint Tailwind popovers as Big-Sur frosted material. The Mood Radio tile button in MoodRadioGrid carries `hover:shadow-lg`, which the matcher catches — so in light mode every tile inherits the 92%-opaque white panel treatment and the colored ::before gradient drowns under it. Same specificity tie (0,2,1) on both rules; source order let the later modal rule win deterministically in release builds (Lightning CSS) while dev's CSS injection order happened to preserve the .liquid-mood-tile rule's precedence. Exclude `.liquid-mood-tile` from both shadow-lg modal captures (dark + light) so the tile's own background-color (8% glass tint) survives and the colored gradient backdrop reads again. Closes #290
📝 WalkthroughWalkthroughDeux sélecteurs CSS dans ChangesCorrection du sélecteur glass dans liquid.css
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~3 minutes Possibly related PRs
Suggested labels
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
Summary
.liquid-mood-tilefrom both[class*="shadow-lg"]modal-capture rules in src/styles/skins/liquid.css so the Mood Radio tiles' colored::beforegradient survives in Liquid + light theme on release builds.hover:shadow-lgfor its hover elevation, which is what triggered the false-positive capture.Root cause
The "modals / popovers" rule substring-matches
[class*="shadow-lg"]to repaint Tailwind popovers as Big-Sur frosted material. The Mood Radio tile button in MoodRadioGrid.tsx carrieshover:shadow-lg, which the matcher catches — so in light mode every tile inheritsbackground-color: color-mix(white 92%, transparent) !important, drowning the gradient.Specificity tie at
(0,2,1)on both.liquid-mood-tileand the modal rule; source order broke the tie in favour of the (later) modal rule deterministically in release builds (Lightning CSS reorder), while Vite's dev CSS injection happened to preserve the.liquid-mood-tilerule's precedence — hence "works in dev, broken in release".Test plan
bun run tauri build→ install → switch to Liquid skin + a light theme (Émeraude / Lavender / Sunset) → Mood Radio tiles show the colored gradient again, text readable.AudioPipelinePopover,MoreActionsMenu,SmartPlaylistEditor, settings dropdowns).Closes #290
Summary by CodeRabbit
Bug Fixes