diff --git a/packages/module/src/Battery/Battery.tsx b/packages/module/src/Battery/Battery.tsx index 32f1b650..3587f7a6 100644 --- a/packages/module/src/Battery/Battery.tsx +++ b/packages/module/src/Battery/Battery.tsx @@ -4,7 +4,7 @@ import { createUseStyles } from 'react-jss' const batteryDefault = { '& svg': { - '& path': { fill: 'var(--pf-v5-global--disabled-color--200)' } + '& path': { fill: 'var(--pf-v5-global--icon--Color--light)' } } }; @@ -32,6 +32,12 @@ const batteryCritical = { } }; +const batteryLineColor = { + '& svg': { + '& path': { stroke: 'var(--pf-v5-global--BorderColor--100)' } + } +}; + const useStyles = createUseStyles({ battery: { display: 'inline-block', @@ -48,6 +54,7 @@ const useStyles = createUseStyles({ batteryMedium, batteryHigh, batteryCritical, + batteryLineColor }); const batteryLevels = (severity: BatterySeverity, classMode?: boolean) => { @@ -91,17 +98,15 @@ const Battery: React.FunctionComponent = ({ severity, label, label const classes = useStyles(); const batteryClasses = clsx(classes.battery, classes[String(batteryLevels(severity, true))], className); - let ariaLabels = {}; - if (labelHidden) { - ariaLabels = { ['aria-label']: `${severity} ${label}` }; - } + const title = { ['title']: `${severity} ${label}` }; + const batteryVariant = useMemo(() => batteryLevels(severity) , [ severity ]) return ( {/* eslint-disable-next-line react/no-unknown-property */} - + = ({ severity, label, label style={{ fill: 'none', fillOpacity: 1, - stroke: '#969696', + stroke: batteryLineColor['& svg']['& path'].stroke, strokeWidth: 41.96378708, strokeLinejoin: 'round', strokeMiterlimit: 4, diff --git a/packages/module/src/Battery/__snapshots__/Batery.test.tsx.snap b/packages/module/src/Battery/__snapshots__/Batery.test.tsx.snap index eb13acf7..9381cd31 100644 --- a/packages/module/src/Battery/__snapshots__/Batery.test.tsx.snap +++ b/packages/module/src/Battery/__snapshots__/Batery.test.tsx.snap @@ -3,10 +3,10 @@ exports[`Battery component API should hide label 1`] = `