Merge p18-w2-theme-followups into dev (Phase 18 Wave 2 — appbar navy, dark hero legibility, true page ground, green-on-green play chip)
This commit is contained in:
@@ -44,10 +44,10 @@
|
||||
|
||||
/* PLAYER-BAR play-chip override (Phase 18, T3). PlayStateIcon's chip defaults to the solid
|
||||
--deepdrft-play-chip (moss-green in dark) used on release heroes and Cut track rows. On the
|
||||
bright player dock that solid green reads too hot, so here — and only here — swap to the
|
||||
translucent --deepdrft-play-chip-soft (same green, much less opaque). The glyph stays the
|
||||
palette green/primary on this context (the navy default-glyph would vanish on the translucent
|
||||
wash), so we let MudIconButton's own Color.Primary stand by neutralising the default override. */
|
||||
player dock that solid green reads too hot, so here — and only here — swap to the
|
||||
translucent --deepdrft-play-chip-soft (same green, much less opaque).
|
||||
The glyph stays --mud-palette-primary (green on the soft translucent wash), giving the
|
||||
preferred green-on-green look on the player bar in dark mode. */
|
||||
::deep .player-surface .icon-container {
|
||||
background-color: var(--deepdrft-play-chip-soft);
|
||||
}
|
||||
|
||||
@@ -81,3 +81,18 @@
|
||||
align-items: stretch;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark-mode text overrides (Phase 18, Correction B).
|
||||
Light mode is pixel-identical — no changes to the rules above.
|
||||
In dark, the navy page ground makes --deepdrft-navy text invisible; invert to light tokens. */
|
||||
:global(.deepdrft-theme-dark) .hero-title {
|
||||
color: var(--deepdrft-page-text);
|
||||
}
|
||||
|
||||
:global(.deepdrft-theme-dark) .hero-title em {
|
||||
color: var(--deepdrft-green-accent);
|
||||
}
|
||||
|
||||
:global(.deepdrft-theme-dark) .hero-desc {
|
||||
color: var(--deepdrft-page-text);
|
||||
}
|
||||
|
||||
@@ -607,6 +607,14 @@
|
||||
|
||||
.btn-outline-white:hover { border-color: var(--deepdrft-white); }
|
||||
|
||||
/* ── DARK-MODE OVERRIDES ── */
|
||||
/* In dark mode, decorative em accents that use --deepdrft-green (#1A3C34) become
|
||||
near-invisible on the navy ground. Switch to --deepdrft-green-accent (#3D7A68). */
|
||||
:global(.deepdrft-theme-dark) .hero-title em,
|
||||
:global(.deepdrft-theme-dark) .movement-title em {
|
||||
color: var(--deepdrft-green-accent);
|
||||
}
|
||||
|
||||
/* ══════════════════ RESPONSIVE COLLAPSE ══════════════════
|
||||
|
||||
Below 960px the rail collapses: the spine + vertical numeral can't survive a
|
||||
|
||||
@@ -560,6 +560,14 @@
|
||||
|
||||
.btn-outline-white:hover { border-color: var(--deepdrft-white); }
|
||||
|
||||
/* ── DARK-MODE OVERRIDES ── */
|
||||
/* In dark mode, decorative em accents that use --deepdrft-green (#1A3C34) become
|
||||
near-invisible on the navy ground. Switch to --deepdrft-green-accent (#3D7A68). */
|
||||
:global(.deepdrft-theme-dark) .section-title em,
|
||||
:global(.deepdrft-theme-dark) .connect-title em {
|
||||
color: var(--deepdrft-green-accent);
|
||||
}
|
||||
|
||||
@media (max-width: 599px) {
|
||||
.cta-banner {
|
||||
flex-direction: column;
|
||||
|
||||
Reference in New Issue
Block a user