diff options
Diffstat (limited to 'src/sass/settings/sliders.scss')
| -rw-r--r-- | src/sass/settings/sliders.scss | 43 |
1 files changed, 30 insertions, 13 deletions
diff --git a/src/sass/settings/sliders.scss b/src/sass/settings/sliders.scss index 17740623..928a46b3 100644 --- a/src/sass/settings/sliders.scss +++ b/src/sass/settings/sliders.scss @@ -2,23 +2,40 @@ // Sliders // ========================================================================== -// Active state -$plyr-range-thumb-active-shadow-width: 3px !default; - // Thumb -$plyr-range-thumb-height: 13px !default; -$plyr-range-thumb-background: #fff !default; -$plyr-range-thumb-border: 2px solid transparent !default; -$plyr-range-thumb-shadow: 0 1px 1px rgba(#000, 0.15), 0 0 0 1px rgba($plyr-color-gray-900, 0.2) !default; +$plyr-range-thumb-height: var(--plyr-range-thumb-height, 13px) !default; +$plyr-range-thumb-background: var(--plyr-range-thumb-background, #fff) !default; +$plyr-range-thumb-border: var(--plyr-range-thumb-border, 2px solid transparent) !default; +$plyr-range-thumb-shadow: var( + --plyr-range-thumb-shadow, + 0 1px 1px rgba($plyr-color-gray-900, 0.15), + 0 0 0 1px rgba($plyr-color-gray-900, 0.2) +) !default; + +// Active state +$plyr-range-thumb-active-shadow-color: var(--plyr-range-thumb-active-shadow-color, rgba(#fff, 0.5)); +$plyr-range-thumb-active-shadow-width: var(--plyr-range-thumb-active-shadow-width, 3px) !default; // Track -$plyr-range-track-height: 5px !default; -$plyr-range-max-height: ($plyr-range-thumb-active-shadow-width * 2) + $plyr-range-thumb-height !default; +$plyr-range-track-height: var(--plyr-range-track-height, 5px) !default; +$plyr-range-max-height: var( + --plyr-range-max-height, + calc((#{$plyr-range-thumb-active-shadow-width} * 2) + #{$plyr-range-thumb-height}) +) !default; // Fill -$plyr-range-fill-background: var(--plyr-color-main); +$plyr-range-fill-background: var(--plyr-range-fill-background, var(--plyr-color-main, $plyr-color-main)) !default; // Type specific -$plyr-video-range-track-background: $plyr-video-progress-buffered-background !default; -$plyr-audio-range-track-background: $plyr-audio-progress-buffered-background !default; -$plyr-audio-range-thumb-shadow-color: rgba(#000, 0.1) !default; +$plyr-video-range-track-background: var( + --plyr-video-range-track-background, + $plyr-video-progress-buffered-background +) !default; +$plyr-audio-range-track-background: var( + --plyr-audio-range-track-background, + $plyr-audio-progress-buffered-background +) !default; +$plyr-audio-range-thumb-shadow-color: var( + --plyr-audio-range-thumb-shadow-color, + rgba($plyr-color-gray-900, 0.1) +) !default; |