web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2024-12-21 01:39:04 +02:00
Code Releases Activity

fix(volume): vertical slider causes viewport overflow in rtl layout

Browse Source 
Fixes #7743
This commit is contained in:
amtins 2023-06-13 18:30:27 +02:00
parent 2b0df25df3
commit 5d4b28c3a4
1 changed files with 8 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/css/components/_volume.scss
View File

@ -51,7 +51,11 @@
position: relative; position: relative;
&.vjs-volume-vertical { &.vjs-volume-vertical {
left: -3.5em; height: 8em;
width: 3em;
pointer-events: initial;
@include transition(left 0s); @include transition(left 0s);
} }
$transition-property: visibility 0.1s, opacity 0.1s, height 0.1s, width 0.1s, left 0s, top 0s; $transition-property: visibility 0.1s, opacity 0.1s, height 0.1s, width 0.1s, left 0s, top 0s;
@ -75,10 +79,6 @@
} }
.video-js .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical { .video-js .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical {
height: 8em;
width: 3em;
left: -3000em;
$transition-property: visibility 1s, opacity 1s, height 1s 1s, width 1s 1s, left 1s 1s, top 1s 1s; $transition-property: visibility 1s, opacity 1s, height 1s 1s, width 1s 1s, left 1s 1s, top 1s 1s;
@include transition($transition-property) @include transition($transition-property)
} }
@ -192,10 +192,11 @@
} }
.video-js .vjs-volume-vertical { .video-js .vjs-volume-vertical {
width: 3em; left: -3.5em;
height: 8em;
bottom: 8em; bottom: 8em;
pointer-events: none;
@include background-color-with-alpha($primary-background-color, $primary-background-transparency); @include background-color-with-alpha($primary-background-color, $primary-background-transparency);
} }