fix(max-performance): hide the same decorative elements reduce-effects hides

Max Performance only neutralized animation/blur/shadow globally but didn't
replicate the reduce-effects-specific display:none rules, so with reduce-
effects OFF the sidebar aura orbs (.sidebar::before/::after) survived as two
hard static circles, the dash-card cursor-glow layers stayed, and nav-button
hover kept the expensive treatment. Depended on whether reduce-effects was on
before enabling Max Performance. Extend those three rule blocks to also match
body.max-performance — flash-free since the body class is server-rendered.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
nick2000713 2026-06-29 11:33:03 +02:00
parent 1e68e339ca
commit 8d549eb4fa

View file

@ -138,7 +138,9 @@ body {
/* In performance mode the aura loses its blur + animation, leaving two hard
static circles hide them entirely instead. */
body.reduce-effects .sidebar::before,
body.reduce-effects .sidebar::after {
body.reduce-effects .sidebar::after,
body.max-performance .sidebar::before,
body.max-performance .sidebar::after {
display: none !important;
}
@ -500,12 +502,14 @@ body:not(.reduce-effects) .nav-button.active:hover {
transparent border, so no layout shift). The expensive full-effects
bits (gradient, transform/translateX, multi-layer box-shadow) stay
off so hovering doesn't trigger compositing/repaint churn. */
body.reduce-effects .nav-button:hover {
body.reduce-effects .nav-button:hover,
body.max-performance .nav-button:hover {
background: rgba(255, 255, 255, 0.05);
border-color: rgba(255, 255, 255, 0.08);
}
body.reduce-effects .nav-button.active:hover {
body.reduce-effects .nav-button.active:hover,
body.max-performance .nav-button.active:hover {
background: rgba(var(--accent-rgb), 0.18);
border-color: rgba(var(--accent-rgb), 0.3);
}
@ -63508,7 +63512,9 @@ body[data-artist-source="source"] #artist-detail-page #library-artist-enhance-bt
}
body.reduce-effects .dash-card::before,
body.reduce-effects .dash-card::after {
body.reduce-effects .dash-card::after,
body.max-performance .dash-card::before,
body.max-performance .dash-card::after {
display: none;
}
.dash-card:hover {