Parcourir la source

focus color update

uat
Jason Chuang il y a 1 jour
Parent
révision
5d4b2e5ce5
4 fichiers modifiés avec 7 ajouts et 8 suppressions
  1. +2
    -3
      src/assets/style/styles.css
  2. +1
    -1
      src/themes/overrides/Checkbox.js
  3. +1
    -1
      src/themes/overrides/Radio.js
  4. +3
    -3
      src/themes/themeConst.js

+ 2
- 3
src/assets/style/styles.css Voir le fichier

@@ -95,9 +95,8 @@ a:active {
/* ===== MUI DataGrid keyboard focus (WCAG 2.4.7 / 2.4.11) ===== */ /* ===== MUI DataGrid keyboard focus (WCAG 2.4.7 / 2.4.11) ===== */
.MuiDataGrid-columnHeader:focus-visible, .MuiDataGrid-columnHeader:focus-visible,
.MuiDataGrid-cell:focus-visible { .MuiDataGrid-cell:focus-visible {
outline: 3px solid #0c489e;
outline-offset: -2px;
box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.25);
outline: none;
box-shadow: inset 0 0 0 3px #0c489e;
} }


/* Contained buttons only */ /* Contained buttons only */


+ 1
- 1
src/themes/overrides/Checkbox.js Voir le fichier

@@ -24,7 +24,7 @@ export default function Checkbox(theme) {
color: CONTAINED_PRIMARY_BLUE color: CONTAINED_PRIMARY_BLUE
}, },
'&.Mui-focusVisible': { '&.Mui-focusVisible': {
boxShadow: '0 0 0 3px rgba(25, 118, 210, 0.35)'
boxShadow: `0 0 0 3px ${CONTAINED_PRIMARY_BLUE}`
}, },
svg: { svg: {
width: checkboxSize, width: checkboxSize,


+ 1
- 1
src/themes/overrides/Radio.js Voir le fichier

@@ -21,7 +21,7 @@ export default function Radio() {
color: CONTAINED_PRIMARY_BLUE color: CONTAINED_PRIMARY_BLUE
}, },
'&.Mui-focusVisible': { '&.Mui-focusVisible': {
boxShadow: '0 0 0 3px rgba(25, 118, 210, 0.35)'
boxShadow: `0 0 0 3px ${CONTAINED_PRIMARY_BLUE}`
} }
} }
} }


+ 3
- 3
src/themes/themeConst.js Voir le fichier

@@ -310,7 +310,7 @@ export const PNSPS_THEME = createTheme({


/* Focus-visible */ /* Focus-visible */
'&.Mui-focusVisible': { '&.Mui-focusVisible': {
boxShadow: '0 0 0 3px rgba(25, 118, 210, 0.35)',
boxShadow: `0 0 0 3px ${CONTAINED_PRIMARY_BLUE}`,
}, },
}, },
}, },
@@ -336,7 +336,7 @@ export const PNSPS_THEME = createTheme({
}, },


'&.Mui-focusVisible': { '&.Mui-focusVisible': {
boxShadow: '0 0 0 3px rgba(25, 118, 210, 0.35)',
boxShadow: `0 0 0 3px ${CONTAINED_PRIMARY_BLUE}`,
}, },
}, },
}, },
@@ -505,7 +505,7 @@ export const PNSPS_THEME = createTheme({


// ✅ Keyboard TAB focus (visible & accessible) // ✅ Keyboard TAB focus (visible & accessible)
'&.Mui-focusVisible': { '&.Mui-focusVisible': {
outline: '3px solid rgba(21, 101, 192, 0.55)',
outline: `3px solid ${CONTAINED_PRIMARY_BLUE}`,
outlineOffset: '3px', outlineOffset: '3px',
borderRadius: '6px', borderRadius: '6px',
}, },


Chargement…
Annuler
Enregistrer