Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
feat: make menu background respect :focus-visible (#5558)
  • Loading branch information
gjanblaszczyk authored and gkatsev committed Nov 30, 2018
1 parent 4842201 commit e5e1e29
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 3 deletions.
6 changes: 4 additions & 2 deletions src/css/components/menu/_menu.scss
Expand Up @@ -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;
}
Expand Down
5 changes: 4 additions & 1 deletion src/css/video-js.scss
Expand Up @@ -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.