refactor(css): extract .tint-candle / .tint-ember utility classes
The candle tint (color-mix accent fill + matching solid border) was inlined as style="" in five spots across SeriesPassPurchase and EventSeriesTicketCard. Promote to .tint-candle / .tint-ember utility classes in main.css and replace the inline styles with the class.
This commit is contained in:
parent
dac423afcd
commit
53f81b3605
3 changed files with 16 additions and 10 deletions
|
|
@ -248,6 +248,17 @@ p a, blockquote a {
|
|||
border-color: var(--border);
|
||||
}
|
||||
|
||||
/* ---- ACCENT TINT BLOCKS ---- */
|
||||
/* Faint accent fill + matching solid border. Replaces inline color-mix styles. */
|
||||
.tint-candle {
|
||||
background: color-mix(in srgb, var(--candle) 15%, transparent);
|
||||
border: 1px solid var(--candle);
|
||||
}
|
||||
.tint-ember {
|
||||
background: color-mix(in srgb, var(--ember) 15%, transparent);
|
||||
border: 1px solid var(--ember);
|
||||
}
|
||||
|
||||
/* ---- SEGMENTED CONTROL (flush dashed-border groups) ---- */
|
||||
/* Negative-margin overlap: every item keeps all 4 borders,
|
||||
siblings overlap by 1px, active item paints on top via z-index. */
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue