2019-05-22 18:48:40 +02:00
|
|
|
// stylelint-disable declaration-no-important
|
|
|
|
// Set global focus outline styles so they are consistent across the UI,
|
|
|
|
// without individual components having to explicitly define focus styles.
|
|
|
|
// Using !important because we want to enforce only one style is used across the UI.
|
2022-03-15 12:33:12 +01:00
|
|
|
// Remove :focus selectors once we stop supporting Safari 15.4.
|
|
|
|
*:focus {
|
2023-04-19 07:58:14 +02:00
|
|
|
outline: $focus-outline-width solid theme('colors.focus') !important;
|
2019-05-22 18:48:40 +02:00
|
|
|
}
|
|
|
|
|
2022-03-15 12:33:12 +01:00
|
|
|
*:focus:not(:focus-visible) {
|
2019-05-22 18:48:40 +02:00
|
|
|
outline: none !important;
|
|
|
|
}
|
2022-03-15 12:33:12 +01:00
|
|
|
|
|
|
|
*:focus-visible {
|
2023-04-19 07:58:14 +02:00
|
|
|
outline: $focus-outline-width solid theme('colors.focus') !important;
|
2022-03-15 12:33:12 +01:00
|
|
|
}
|