Permalink
Browse files

feat: make menu background respect :focus-visible (#5558)

  • Loading branch information...
gjanblaszczyk authored and gkatsev committed Nov 30, 2018
1 parent 4842201 commit e5e1e290fd7e31763461aba5d10b3cdcc98b07f9
Showing with 8 additions and 3 deletions.
  1. +4 −2 src/css/components/menu/_menu.scss
  2. +4 −1 src/css/video-js.scss
@@ -43,13 +43,15 @@
}

.vjs-menu li.vjs-menu-item:focus,
.vjs-menu li.vjs-menu-item:hover {
.vjs-menu li.vjs-menu-item:hover,
.js-focus-visible .vjs-menu li.vjs-menu-item:hover {
@include background-color-with-alpha($secondary-background-color, $secondary-background-transparency);
}

.vjs-menu li.vjs-selected,
.vjs-menu li.vjs-selected:focus,
.vjs-menu li.vjs-selected:hover {
.vjs-menu li.vjs-selected:hover,
.js-focus-visible .vjs-menu li.vjs-selected:hover {
background-color: $primary-foreground-color;
color: $primary-background-color;
}
@@ -56,8 +56,11 @@
// The rule is needed for :focus-visible polyfill
.js-focus-visible .video-js *:focus:not(.focus-visible) {
outline: none;
background: none;
}

.video-js *:focus:not(:focus-visible) {
.video-js *:focus:not(:focus-visible),
.video-js .vjs-menu *:focus:not(:focus-visible) {
outline: none;
background: none;
}

0 comments on commit e5e1e29

Please sign in to comment.