mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-28 17:43:47 +00:00
refactor(tokens): extract subscription urgent + critical semantic colors
The #FFB800 (23 hits) and #FF3B5C (11 hits) raw hex literals across Subscription / SubscriptionPurchase / TrialOfferCard / useTrafficZone all represent the same semantic: 'expiring soon' and 'expired'. Distinct from warning-500 (#f59e0b) and error-500 (#ef4444) — the subscription timeline needs a sharper, hotter signal than the system-wide warning/error roles. Add two semantic tokens: --color-urgent-400: 255, 184, 0 (#FFB800) --color-critical-500: 255, 59, 92 (#FF3B5C) Exposed via Tailwind as urgent.400 / critical.500. Sweep all single-and double-quoted hex literals to rgb(var(--color-...)) form so style attrs, SVG stroke=, and ternary string values all resolve through CSS vars (auto-respects future light-theme variants). Left as-is: 4 hex appearances inside gradient pair strings — linear-gradient(135deg, #FFB800, #FF8C00) — where the partner color (#FF8C00 / #FF6B35) isn't in the token set. Partial-replace inside gradient strings would just add noise; full extraction of the orange-ramp companion is out of scope for this pass.
This commit is contained in:
@@ -180,6 +180,13 @@
|
||||
--color-error-900: 127, 29, 29;
|
||||
--color-error-950: 69, 10, 10;
|
||||
|
||||
/* Subscription-status semantic tokens — distinct from warning/error
|
||||
because the urgency timeline ("expiring soon" vs "expired") needs a
|
||||
sharper, hotter signal than the system-wide warning/error roles.
|
||||
Extracted from inline #FFB800 / #FF3B5C in Subscription.tsx etc. */
|
||||
--color-urgent-400: 255, 184, 0; /* #FFB800 — expiring soon */
|
||||
--color-critical-500: 255, 59, 92; /* #FF3B5C — expired */
|
||||
|
||||
/* Theme semantic colors (hex for direct use) */
|
||||
--color-dark-bg: #0a0f1a;
|
||||
--color-dark-surface: #0f172a;
|
||||
|
||||
Reference in New Issue
Block a user