diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/js/plyr.js | 8 | ||||
| -rw-r--r-- | src/less/plyr.less | 12 | ||||
| -rw-r--r-- | src/less/variables.less | 7 |
3 files changed, 19 insertions, 8 deletions
diff --git a/src/js/plyr.js b/src/js/plyr.js index 53af4cda..d113882c 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -150,7 +150,8 @@ frameTitle: 'Player for {title}', captions: 'Captions', settings: 'Settings', - speed: 'Speed' + speed: 'Speed', + quality: 'Quality' }, types: { embed: ['youtube', 'vimeo', 'soundcloud'], @@ -886,6 +887,11 @@ config.i18n.speed + ' <span class="plyr__menu__value">{speed}</span>', '</button>', '</li>', + '<li>', + '<button type="button" data-plyr="slide-speed">', + config.i18n.quality + ' <span class="plyr__menu__value">Auto</span>', + '</button>', + '</li>', '</ul>', '</div>', '</div>' diff --git a/src/less/plyr.less b/src/less/plyr.less index a3dd8e83..20550b80 100644 --- a/src/less/plyr.less +++ b/src/less/plyr.less @@ -482,12 +482,12 @@ right: -5px; margin-bottom: 10px; animation: plyr-popup .2s ease; - background: fade(@plyr-video-controls-bg, 90%); + background: @plyr-menu-bg; box-shadow: 0 1px 0 fade(#000, 20%); border-radius: 4px; white-space: nowrap; text-align: left; - color: @plyr-video-control-color; + color: @plyr-menu-color; font-size: @plyr-font-size-small; ul { @@ -500,7 +500,7 @@ display: flex; width: 100%; padding: 10px 30px 10px 12px; - color: @plyr-video-control-color; + color: @plyr-menu-color; font-weight: 600; // Arrow @@ -511,7 +511,7 @@ transform: translateY(-50%); right: 5px; border: 5px solid transparent; - border-left-color: fade(@plyr-video-control-color, 80%); + border-left-color: fade(@plyr-menu-color, 80%); } } @@ -520,7 +520,7 @@ margin-left: auto; padding-left: 25px; font-weight: 400; - color: fade(@plyr-video-control-color, 80%); + color: fade(@plyr-menu-color, 80%); } // Arrow @@ -532,7 +532,7 @@ height: 0; width: 0; border: 6px solid transparent; - border-top-color: fade(@plyr-video-controls-bg, 90%); + border-top-color: @plyr-menu-bg; } } } diff --git a/src/less/variables.less b/src/less/variables.less index 8a601571..c7eab243 100644 --- a/src/less/variables.less +++ b/src/less/variables.less @@ -38,12 +38,17 @@ @plyr-audio-control-bg-hover: @plyr-color-main; // Tooltips -@plyr-tooltip-bg: fade(#343f4a, 85%); +@plyr-tooltip-bg: fade(#343f4a, 90%); @plyr-tooltip-color: #fff; @plyr-tooltip-padding: (@plyr-control-spacing / 2); @plyr-tooltip-arrow-size: 4px; @plyr-tooltip-radius: 3px; +// Menus +@plyr-menu-bg: @plyr-tooltip-bg; +@plyr-menu-color: @plyr-tooltip-color; +@plyr-menu-arrow-size: 6px; + // Progress @plyr-progress-loading-size: 25px; @plyr-progress-loading-bg: fade(#343f4a, 20%); |