diff options
Diffstat (limited to 'src/less/variables.less')
| -rw-r--r-- | src/less/variables.less | 111 |
1 files changed, 56 insertions, 55 deletions
diff --git a/src/less/variables.less b/src/less/variables.less index dd6c9e0f..fe6e3e39 100644 --- a/src/less/variables.less +++ b/src/less/variables.less @@ -4,76 +4,77 @@ // ========================================================================== // Settings -@plyr-border-box: true; -@plyr-touch-action: true; -@plyr-sr-only-important: true; +@plyr-border-box: true; +@plyr-touch-action: true; +@plyr-sr-only-important: true; // Colors -@plyr-color-main: #1aafff; +@plyr-color-main: #1aafff; // Font -@plyr-font-family: inherit; //Avenir, 'Avenir Next', 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; -@plyr-font-size-small: 14px; -@plyr-font-size-base: 16px; -@plyr-font-weight-normal: 500; -@plyr-font-weight-bold: 600; +@plyr-font-family: inherit; //Avenir, 'Avenir Next', 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; +@plyr-font-size-small: 14px; +@plyr-font-size-base: 16px; +@plyr-font-weight-normal: 500; +@plyr-font-weight-bold: 600; // Captions -@plyr-captions-bg: fade(#343f4a, 80%); -@plyr-captions-color: #fff; -@plyr-font-size-captions-base: @plyr-font-size-base; -@plyr-font-size-captions-medium: ceil(@plyr-font-size-base * 1.5); -@plyr-font-size-captions-large: (@plyr-font-size-base * 2); +@plyr-captions-bg: fade(#343f4a, 80%); +@plyr-captions-color: #fff; +@plyr-font-size-captions-base: @plyr-font-size-base; +@plyr-font-size-captions-small: @plyr-font-size-small; +@plyr-font-size-captions-medium: ceil(@plyr-font-size-base * 1.25); +@plyr-font-size-captions-large: (@plyr-font-size-base * 1.5); // Controls -@plyr-control-icon-size: 18px; -@plyr-control-spacing: 10px; -@plyr-control-padding: (@plyr-control-spacing * .7); -@plyr-video-controls-bg: #343f4a; -@plyr-video-control-color: #fff; -@plyr-video-control-color-hover: #fff; -@plyr-video-control-bg-hover: @plyr-color-main; -@plyr-audio-controls-bg: #fff; -@plyr-audio-controls-border: 1px solid #dbe3e8; -@plyr-audio-control-color: #565d64; -@plyr-audio-control-color-hover: #fff; -@plyr-audio-control-bg-hover: @plyr-color-main; +@plyr-control-icon-size: 18px; +@plyr-control-spacing: 10px; +@plyr-control-padding: (@plyr-control-spacing * .7); +@plyr-video-controls-bg: #343f4a; +@plyr-video-control-color: #fff; +@plyr-video-control-color-hover: #fff; +@plyr-video-control-bg-hover: @plyr-color-main; +@plyr-audio-controls-bg: #fff; +@plyr-audio-controls-border: 1px solid #dbe3e8; +@plyr-audio-control-color: #565d64; +@plyr-audio-control-color-hover: #fff; +@plyr-audio-control-bg-hover: @plyr-color-main; // Tooltips -@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; +@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; +@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%); -@plyr-video-progress-bg: fade(#fff, 25%); -@plyr-video-progress-buffered-bg: @plyr-video-progress-bg; -@plyr-audio-progress-bg: fade(#c6d6db, 66%); -@plyr-audio-progress-buffered-bg: @plyr-audio-progress-bg; +@plyr-progress-loading-size: 25px; +@plyr-progress-loading-bg: fade(#343f4a, 20%); +@plyr-video-progress-bg: fade(#fff, 25%); +@plyr-video-progress-buffered-bg: @plyr-video-progress-bg; +@plyr-audio-progress-bg: fade(#c6d6db, 66%); +@plyr-audio-progress-buffered-bg: @plyr-audio-progress-bg; // Range sliders -@plyr-range-track-height: 8px; -@plyr-range-thumb-height: floor(@plyr-range-track-height * 2); -@plyr-range-thumb-width: floor(@plyr-range-track-height * 2); -@plyr-range-thumb-bg: #fff; -@plyr-range-thumb-border: 2px solid transparent; -@plyr-range-thumb-shadow: 0 1px 1px fade(@plyr-video-controls-bg, 15%), 0 0 0 1px fade(#343f4a, 20%); -@plyr-range-thumb-active-border-color: #fff; -@plyr-range-thumb-active-bg: @plyr-video-control-bg-hover; -@plyr-range-thumb-active-scale: 1.25; -@plyr-video-range-track-bg: @plyr-video-progress-buffered-bg; -@plyr-audio-range-track-bg: @plyr-audio-progress-buffered-bg; -@plyr-range-selected-bg: @plyr-color-main; +@plyr-range-track-height: 8px; +@plyr-range-thumb-height: floor(@plyr-range-track-height * 2); +@plyr-range-thumb-width: floor(@plyr-range-track-height * 2); +@plyr-range-thumb-bg: #fff; +@plyr-range-thumb-border: 2px solid transparent; +@plyr-range-thumb-shadow: 0 1px 1px fade(@plyr-video-controls-bg, 15%), 0 0 0 1px fade(#343f4a, 20%); +@plyr-range-thumb-active-border-color: #fff; +@plyr-range-thumb-active-bg: @plyr-video-control-bg-hover; +@plyr-range-thumb-active-scale: 1.25; +@plyr-video-range-track-bg: @plyr-video-progress-buffered-bg; +@plyr-audio-range-track-bg: @plyr-audio-progress-buffered-bg; +@plyr-range-selected-bg: @plyr-color-main; // Breakpoints -@plyr-bp-screen-sm: 480px; -@plyr-bp-screen-md: 768px; -@plyr-bp-screen-lg: 1024px;
\ No newline at end of file +@plyr-bp-screen-sm: 480px; +@plyr-bp-screen-md: 768px; +@plyr-bp-screen-lg: 1024px; |