archive/pillar
0
0
Fork 0
Code Issues 42 Pull Requests Projects Releases Wiki Activity

Videoplayer: thicker progress bar

Browse Source
This commit is contained in:
Pablo Vazquez
2018-09-07 14:55:42 +02:00
parent 8380270128
commit 17a69b973e
1 changed files with 10 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/styles/plugins/_videoplayer.sass
View File

@@ -1,6 +1,8 @@
$videoplayer-controls-color: white $videoplayer-controls-color: white
$videoplayer-background-color: darken($primary, 10%) $videoplayer-background-color: darken($primary, 10%)
$videoplayer-progress-bar-height: .5em
.video-js .video-js
.vjs-big-play-button:before, .vjs-control:before, .vjs-modal-dialog .vjs-big-play-button:before, .vjs-control:before, .vjs-modal-dialog
position: absolute position: absolute
@@ -653,12 +655,12 @@ body.vjs-full-window
-moz-transition: all 0.2s -moz-transition: all 0.2s
-o-transition: all 0.2s -o-transition: all 0.2s
transition: all 0.2s transition: all 0.2s
height: 0.3em height: $videoplayer-progress-bar-height
.vjs-play-progress .vjs-play-progress
position: absolute position: absolute
display: block display: block
height: 0.3em height: $videoplayer-progress-bar-height
margin: 0 margin: 0
padding: 0 padding: 0
width: 0 width: 0
@@ -668,7 +670,7 @@ body.vjs-full-window
.vjs-load-progress .vjs-load-progress
position: absolute position: absolute
display: block display: block
height: 0.3em height: $videoplayer-progress-bar-height
margin: 0 margin: 0
padding: 0 padding: 0
width: 0 width: 0
@@ -678,7 +680,7 @@ body.vjs-full-window
div div
position: absolute position: absolute
display: block display: block
height: 0.3em height: $videoplayer-progress-bar-height
margin: 0 margin: 0
padding: 0 padding: 0
width: 0 width: 0
@@ -690,10 +692,11 @@ body.vjs-full-window
.vjs-play-progress .vjs-play-progress
background-color: $videoplayer-controls-color background-color: $videoplayer-controls-color
border-radius: 999em
&:before &:before
position: absolute position: absolute
top: -0.333333333333333em top: -($videoplayer-progress-bar-height / 2) // halfway the height of the progress bar
right: -0.5em right: -0.5em
&:after &:after
@@ -849,9 +852,9 @@ body.vjs-full-window
font-size: 0.9em font-size: 0.9em
.vjs-slider-horizontal .vjs-volume-level .vjs-slider-horizontal .vjs-volume-level
height: 0.3em height: $videoplayer-progress-bar-height
&:before &:before
top: -0.3em top: -$videoplayer-progress-bar-height
right: -0.5em right: -0.5em
.vjs-menu-button-popup .vjs-menu-button-popup