fix: replace hardcoded green with theme-aware accent color

Normal traffic zone now uses configurable accent palette instead of
hardcoded success/green. Added useTrafficZone hook that resolves
mainHex dynamically from theme colors. Replaced emerald/teal classes
with success palette in SuccessNotificationModal. Fixed hardcoded
green hex values in Subscription and SubscriptionPurchase pages.
This commit is contained in:
Fringg
2026-03-04 02:50:28 +03:00
parent f652936d78
commit a3ddddfa8c
8 changed files with 76 additions and 44 deletions

View File

@@ -1,5 +1,7 @@
export type TrafficZone = 'normal' | 'warning' | 'danger' | 'critical';
export type TrafficColorKey = 'accent' | 'warning' | 'error';
interface TrafficZoneResult {
zone: TrafficZone;
textClass: string;
@@ -8,19 +10,19 @@ interface TrafficZoneResult {
labelKey: string;
gradientFrom: string;
gradientTo: string;
/** Hex color for inline styles */
mainHex: string;
/** Key into ThemeColors for resolving mainHex at runtime */
colorKey: TrafficColorKey;
}
const ZONES: Record<TrafficZone, Omit<TrafficZoneResult, 'zone'>> = {
normal: {
textClass: 'text-success-400',
dotClass: 'bg-success-400',
glowColor: 'rgba(var(--color-success-500), 0.5)',
textClass: 'text-accent-400',
dotClass: 'bg-accent-400',
glowColor: 'rgba(var(--color-accent-500), 0.5)',
labelKey: 'dashboard.zone.normal',
gradientFrom: 'rgb(var(--color-success-500))',
gradientTo: 'rgb(var(--color-success-400))',
mainHex: '#00E5A0',
gradientFrom: 'rgb(var(--color-accent-500))',
gradientTo: 'rgb(var(--color-accent-400))',
colorKey: 'accent',
},
warning: {
textClass: 'text-warning-400',
@@ -29,7 +31,7 @@ const ZONES: Record<TrafficZone, Omit<TrafficZoneResult, 'zone'>> = {
labelKey: 'dashboard.zone.warning',
gradientFrom: 'rgb(var(--color-warning-500))',
gradientTo: 'rgb(var(--color-warning-400))',
mainHex: '#FFB800',
colorKey: 'warning',
},
danger: {
textClass: 'text-warning-300',
@@ -38,7 +40,7 @@ const ZONES: Record<TrafficZone, Omit<TrafficZoneResult, 'zone'>> = {
labelKey: 'dashboard.zone.danger',
gradientFrom: 'rgb(var(--color-warning-600))',
gradientTo: 'rgb(var(--color-warning-400))',
mainHex: '#FF6B35',
colorKey: 'warning',
},
critical: {
textClass: 'text-error-400',
@@ -47,7 +49,7 @@ const ZONES: Record<TrafficZone, Omit<TrafficZoneResult, 'zone'>> = {
labelKey: 'dashboard.zone.critical',
gradientFrom: 'rgb(var(--color-error-500))',
gradientTo: 'rgb(var(--color-error-400))',
mainHex: '#FF3B5C',
colorKey: 'error',
},
};