diff options
Diffstat (limited to 'src/scss/plyr.scss')
| -rw-r--r-- | src/scss/plyr.scss | 26 |
1 files changed, 16 insertions, 10 deletions
diff --git a/src/scss/plyr.scss b/src/scss/plyr.scss index 91a5d1b2..e75a2eda 100644 --- a/src/scss/plyr.scss +++ b/src/scss/plyr.scss @@ -172,6 +172,9 @@ position: relative; background: #000; border-radius: inherit; + // Require z-index to force border-radius + z-index: 0; + overflow: hidden; } // Container for embeds @@ -269,21 +272,20 @@ text-align: center; // Spacing - > button, + > .plyr__control, .plyr__progress, - .plyr__time { + .plyr__time, + .plyr__menu { margin-left: ($plyr-control-spacing / 2); - &:first-child { + &:first-child, + &:first-child + [data-plyr="pause"] { margin-left: 0; } } .plyr__volume { margin-left: ($plyr-control-spacing / 2); } - [data-plyr="pause"] { - margin-left: 0; - } // Buttons button { @@ -305,6 +307,7 @@ height: $plyr-control-icon-size; display: block; fill: currentColor; + pointer-events: none; } // Default focus @@ -398,6 +401,7 @@ height: 20px; display: block; fill: currentColor; + pointer-events: none; } &:focus { @@ -495,7 +499,8 @@ } // First tooltip -.plyr__controls button:first-child .plyr__tooltip { +.plyr__controls > button:first-child .plyr__tooltip, +.plyr__controls > button:first-child + button .plyr__tooltip { left: 0; transform: translate(0, 10px) scale(.8); transform-origin: 0 100%; @@ -506,7 +511,7 @@ } // Last tooltip -.plyr__controls button:last-child .plyr__tooltip { +.plyr__controls > button:last-child .plyr__tooltip { right: 0; transform: translate(0, 10px) scale(.8); transform-origin: 100% 100%; @@ -518,8 +523,9 @@ } } -.plyr__controls button:first-child, -.plyr__controls button:last-child { +.plyr__controls > button:first-child, +.plyr__controls > button:first-child + button, +.plyr__controls > button:last-child { &:hover .plyr__tooltip, &.tab-focus:focus .plyr__tooltip, .plyr__tooltip--visible { |