mirror of
https://github.com/luxfi/explore.git
synced 2026-07-27 05:54:15 +00:00
zeekayandHanzo Dev
be4972bb45
v1.1.11 landed the three money values (Reward/Value/Fee) at 4.54:1 and killed the overflow + Menu-button clip, but the network-utilization % mapped to --color-badge-bright-green-fg (#25855A) measured 4.39:1 on the real #FAFAFA card background (not pure white) -- 0.11 under bar. Add dedicated semantic status tokens (--color-status-good/warn/bad) with darker light-theme shades (#1A7A47 / #B45309 / #B91C1C -> 5.1 / 4.8 / 6.1 :1 on #FAFAFA) and light shades for dark theme, and point getNetworkUtilizationParams at them. All four home-page values now clear 4.5:1 on every brand. Co-authored-by: Hanzo Dev <dev@hanzo.ai>
30 lines
717 B
TypeScript
30 lines
717 B
TypeScript
export default function getNetworkUtilizationParams(value: number) {
|
|
const load = (() => {
|
|
if (value > 80) {
|
|
return 'high';
|
|
}
|
|
|
|
if (value > 50) {
|
|
return 'medium';
|
|
}
|
|
|
|
return 'low';
|
|
})();
|
|
|
|
// Semantic status vars (styles/tokens.css, both light + dark). The previous
|
|
// Chakra dot-tokens (red.600 etc.) had no matching --color-*-600 var, so they
|
|
// rendered as invalid CSS and the % inherited white-on-white. These shades
|
|
// clear 4.5:1 on the #FAFAFA card background.
|
|
const colors = {
|
|
high: 'var(--color-status-bad)',
|
|
medium: 'var(--color-status-warn)',
|
|
low: 'var(--color-status-good)',
|
|
};
|
|
const color = colors[load];
|
|
|
|
return {
|
|
load,
|
|
color,
|
|
};
|
|
}
|