fix(a11y): leverage native :focus-visible in CSS

2023-03-11 21:15:32 +11:00
parent e17d0220c0
commit 0202e8efb0
22 changed files with 39 additions and 136 deletions
@@ -42,7 +42,7 @@

 // Displaying
 .plyr .plyr__control:hover .plyr__tooltip,
-.plyr .plyr__control.plyr__tab-focus .plyr__tooltip,
+.plyr .plyr__control:focus-visible .plyr__tooltip,
 .plyr__tooltip--visible {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
@@ -82,7 +82,7 @@
 .plyr__controls > .plyr__control:first-child + .plyr__control,
 .plyr__controls > .plyr__control:last-child {
  &:hover .plyr__tooltip,
-  &.plyr__tab-focus .plyr__tooltip,
+  &:focus-visible .plyr__tooltip,
  .plyr__tooltip--visible {
    transform: translate(0, 0) scale(1);
  }