feat(menu-toggle): add high-contrast border - #7723
Conversation
|
Preview: https://pf-pr-7723.surge.sh A11y report: https://pf-pr-7723-a11y.surge.sh |
I think this is fine @srambach |
| --#{$menu-toggle}--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default); | ||
| --#{$menu-toggle}--m-plain--BorderColor: transparent; | ||
| --#{$menu-toggle}--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast); | ||
| --#{$menu-toggle}--m-plain--BorderWidth: var(--pf-t--global--high-contrast--border--width--action--default); |
There was a problem hiding this comment.
we just added in new border width tokens for --pf-t--global--border--width--action--plain--default/hover/clicked that can be used here instead. this will remove the border on the default state of the plain menu toggle
There was a problem hiding this comment.
The new border width tokens for HC theme also adjust the border--width--control--hover value as well, so the hover states on the default menu toggles will also increase by a pixel on hover. No action needed on this i believe as long as those tokens are already applied, think we just need those new tokens pulled in to see that change.
d9377d3 to
459b421
Compare
| --#{$menu-toggle}--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default); | ||
| --#{$menu-toggle}--m-plain--BorderColor: transparent; | ||
| --#{$menu-toggle}--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast); | ||
| --#{$menu-toggle}--m-plain--BorderWidth: var(--pf-t--global--border--width--action--default); |
There was a problem hiding this comment.
small nit -- but adding action--plain--[default/hover/clicked] will give the correct styles here for the plain menu toggles!
4 participants
Fixes #7620
Uses existing pseudoelement to add borders for plain variant.
@lboehling One question - this exposed the difference in padding for the Count variant - just want to make sure this is correct?
