mirror of
https://github.com/videojs/video.js.git
synced 2024-11-28 08:58:46 +02:00
@nick11703 changed multiline comments in sass with single-line comments. closes #2827
This commit is contained in:
Nicholas Fantozz
Gary Katsevman
parent
0b7a2e41b3
commit
9e3a7b6159
@ -4,6 +4,7 @@ CHANGELOG
|
||||
## HEAD (Unreleased)
|
||||
* @misteroneill updated videojs-ie8 to 1.1.1 ([view](https://github.com/videojs/video.js/pull/2869))
|
||||
* @gkatsev added Player#tech. Fixes #2617 ([view](https://github.com/videojs/video.js/pull/2883))
|
||||
* @nick11703 changed multiline comments in sass with single-line comments ([view](https://github.com/videojs/video.js/pull/2827))
|
||||
|
||||
--------------------
|
||||
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
opacity: 1;
|
||||
border: 0.06666em solid $primary-foreground-color;
|
||||
|
||||
/* Need a slightly gray bg so it can be seen on black backgrounds */
|
||||
// Need a slightly gray bg so it can be seen on black backgrounds
|
||||
@include background-color-with-alpha($primary-background-color, $primary-background-transparency);
|
||||
@include border-radius(0.3em);
|
||||
@include transition(all 0.4s);
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
}
|
||||
|
||||
.vjs-chapters-button .vjs-menu {
|
||||
left: -10em; /* (Width of vjs-menu - width of vjs-control) / 2 */
|
||||
left: -10em; // (Width of vjs-menu - width of vjs-control) / 2
|
||||
width: 0;
|
||||
}
|
||||
|
||||
|
||||
@ -32,7 +32,7 @@
|
||||
.vjs-controls-disabled .vjs-control-bar,
|
||||
.vjs-using-native-controls .vjs-control-bar,
|
||||
.vjs-error .vjs-control-bar {
|
||||
/* !important is ok in this context. */
|
||||
// !important is ok in this context.
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@ -42,17 +42,16 @@
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
/* IE8 is flakey with fonts, and you have to change the actual content to force
|
||||
fonts to show/hide properly.
|
||||
- "\9" IE8 hack didn't work for this
|
||||
- Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
|
||||
*/
|
||||
// IE8 is flakey with fonts, and you have to change the actual content to force
|
||||
// fonts to show/hide properly.
|
||||
// - "\9" IE8 hack didn't work for this
|
||||
// Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
|
||||
$ie8screen: "\0screen";
|
||||
.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
|
||||
@media #{$ie8screen} { content: ""; }
|
||||
}
|
||||
|
||||
/* IE 8 + 9 Support */
|
||||
// IE 8 + 9 Support
|
||||
.vjs-has-started.vjs-no-flex .vjs-control-bar {
|
||||
display: table;
|
||||
}
|
||||
|
||||
@ -19,19 +19,19 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* Replacement for focus outline */
|
||||
// Replacement for focus outline
|
||||
.video-js .vjs-control:focus:before,
|
||||
.video-js .vjs-control:hover:before,
|
||||
.video-js .vjs-control:focus {
|
||||
text-shadow: 0em 0em 1em rgba($primary-foreground-color, 1);
|
||||
}
|
||||
|
||||
/* Hide control text visually, but have it available for screenreaders */
|
||||
// Hide control text visually, but have it available for screenreaders
|
||||
.video-js .vjs-control-text {
|
||||
@include hide-visually;
|
||||
}
|
||||
|
||||
/* IE 8 + 9 Support */
|
||||
// IE 8 + 9 Support
|
||||
.vjs-no-flex .vjs-control {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
.video-js .vjs-fullscreen-control {
|
||||
@extend .vjs-icon-fullscreen-enter;
|
||||
}
|
||||
/* Switch to the exit icon when the player is in fullscreen */
|
||||
// Switch to the exit icon when the player is in fullscreen
|
||||
.video-js.vjs-fullscreen .vjs-fullscreen-control {
|
||||
@extend .vjs-icon-fullscreen-exit;
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
.video-js {
|
||||
/* display:inline-block would be closer to the video el's display:inline
|
||||
* but it results in flash reloading when going into fullscreen [#2205]
|
||||
*/
|
||||
// display:inline-block would be closer to the video el's display:inline
|
||||
// but it results in flash reloading when going into fullscreen [#2205]
|
||||
display: block;
|
||||
/* Make video.js videos align top when next to video elements */
|
||||
// Make video.js videos align top when next to video elements
|
||||
vertical-align: top;
|
||||
box-sizing: border-box;
|
||||
|
||||
@ -11,21 +10,21 @@
|
||||
background-color: #000;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
/* Start with 10px for base font size so other dimensions can be em based and
|
||||
easily calculable. */
|
||||
// Start with 10px for base font size so other dimensions can be em based and
|
||||
// easily calculable.
|
||||
font-size: 10px;
|
||||
line-height: 1;
|
||||
|
||||
/* Provide some basic defaults for fonts */
|
||||
// Provide some basic defaults for fonts
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
/* Avoiding helvetica: issue #376 */
|
||||
// Avoiding helvetica: issue #376
|
||||
font-family: $text-font-family;
|
||||
|
||||
@include user-select(none);
|
||||
|
||||
/* Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when
|
||||
checking fullScreenEnabled. */
|
||||
// Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when
|
||||
// checking fullScreenEnabled.
|
||||
&:-moz-full-screen { position: absolute; }
|
||||
|
||||
&:-webkit-full-screen {
|
||||
@ -34,35 +33,35 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* All elements inherit border-box sizing */
|
||||
// All elements inherit border-box sizing
|
||||
.video-js *,
|
||||
.video-js *:before,
|
||||
.video-js *:after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
/* List style reset */
|
||||
// List style reset
|
||||
.video-js ul {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
list-style-position: outside;
|
||||
|
||||
/* Important to specify each */
|
||||
// Important to specify each
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Fill the width of the containing element and use padding to create the
|
||||
desired aspect ratio. Default to 16x9 unless another ratio is given. */
|
||||
// Fill the width of the containing element and use padding to create the
|
||||
// desired aspect ratio. Default to 16x9 unless another ratio is given.
|
||||
@mixin apply-aspect-ratio($width, $height) {
|
||||
padding-top: 100% * ($height/$width);
|
||||
}
|
||||
|
||||
/* Not including a default AR in vjs-fluid because it would override
|
||||
the user set AR injected into the header. */
|
||||
// Not including a default AR in vjs-fluid because it would override
|
||||
// the user set AR injected into the header.
|
||||
.video-js.vjs-fluid,
|
||||
.video-js.vjs-16-9,
|
||||
.video-js.vjs-4-3 {
|
||||
@ -84,8 +83,8 @@
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Playback technology elements expand to the width/height of the containing div
|
||||
<video> or <object> */
|
||||
// Playback technology elements expand to the width/height of the containing div
|
||||
// <video> or <object>
|
||||
.video-js .vjs-tech {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -94,12 +93,12 @@
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Fullscreen Styles */
|
||||
// Fullscreen Styles
|
||||
body.vjs-full-window {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
/* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
|
||||
// Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html
|
||||
overflow-y: auto;
|
||||
}
|
||||
.vjs-full-window .video-js.vjs-fullscreen {
|
||||
@ -114,7 +113,7 @@ body.vjs-full-window {
|
||||
.video-js.vjs-fullscreen {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
/* Undo any aspect ratio padding for fluid layouts */
|
||||
// Undo any aspect ratio padding for fluid layouts
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
.video-js.vjs-fullscreen.vjs-user-inactive {
|
||||
@ -122,7 +121,7 @@ body.vjs-full-window {
|
||||
}
|
||||
|
||||
|
||||
/* Hide disabled or unsupported controls. */
|
||||
// Hide disabled or unsupported controls.
|
||||
.vjs-hidden { display: none !important; }
|
||||
|
||||
// Visually hidden offscreen, but accessible to screen readers.
|
||||
@ -140,10 +139,10 @@ body.vjs-full-window {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
/* In IE8 w/ no JavaScript (no HTML5 shim), the video tag doesn't register.
|
||||
The .video-js classname on the video tag also isn't considered.
|
||||
This optional paragraph inside the video tag can provide a message to users
|
||||
about what's required to play video. */
|
||||
// In IE8 w/ no JavaScript (no HTML5 shim), the video tag doesn't register.
|
||||
// The .video-js classname on the video tag also isn't considered.
|
||||
// This optional paragraph inside the video tag can provide a message to users
|
||||
// about what's required to play video.
|
||||
.vjs-no-js {
|
||||
padding: 20px;
|
||||
color: #fff;
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
margin: -25px 0 0 -25px;
|
||||
opacity: 0.85;
|
||||
|
||||
/* Need to fix centered page layouts */
|
||||
// Need to fix centered page layouts
|
||||
text-align: left;
|
||||
|
||||
border: 6px solid rgba($primary-background-color, $primary-background-transparency);
|
||||
@ -33,14 +33,14 @@
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
border-radius: inherit;
|
||||
/* Keep 100% opacity so they don't show through each other */
|
||||
// Keep 100% opacity so they don't show through each other
|
||||
opacity: 1;
|
||||
border: inherit;
|
||||
border-color: transparent;
|
||||
border-top-color: white;
|
||||
}
|
||||
|
||||
/* only animate when showing because it can be processor heavy */
|
||||
// only animate when showing because it can be processor heavy
|
||||
.vjs-seeking .vjs-loading-spinner:before,
|
||||
.vjs-seeking .vjs-loading-spinner:after,
|
||||
.vjs-waiting .vjs-loading-spinner:before,
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Used for IE8 fallback */
|
||||
// Used for IE8 fallback
|
||||
.vjs-poster img {
|
||||
display: block;
|
||||
vertical-align: middle;
|
||||
@ -25,23 +25,23 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Hide the poster after the video has started playing */
|
||||
// Hide the poster after the video has started playing
|
||||
.vjs-has-started .vjs-poster {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Don't hide the poster if we're playing audio */
|
||||
// Don't hide the poster if we're playing audio
|
||||
.vjs-audio.vjs-has-started .vjs-poster {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Hide the poster when controls are disabled because it's clickable
|
||||
and the native poster can take over */
|
||||
// Hide the poster when controls are disabled because it's clickable
|
||||
// and the native poster can take over
|
||||
.vjs-controls-disabled .vjs-poster {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Hide the poster when native controls are used otherwise it covers them */
|
||||
// Hide the poster when native controls are used otherwise it covers them
|
||||
.vjs-using-native-controls .vjs-poster {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -1,16 +1,16 @@
|
||||
/**
|
||||
* Let's talk pixel math!
|
||||
* Start with a base font size of 10px (assuming that hasn't changed)
|
||||
* No Hover:
|
||||
* - Progress holder is 3px
|
||||
* - Progress handle is 9px
|
||||
* - Progress handle is pulled up 3px to center it.
|
||||
*
|
||||
* Hover:
|
||||
* - Progress holder becomes 5px
|
||||
* - Progress handle becomes 15px
|
||||
* - Progress handle is pulled up 5px to center it
|
||||
*/
|
||||
//
|
||||
// Let's talk pixel math!
|
||||
// Start with a base font size of 10px (assuming that hasn't changed)
|
||||
// No Hover:
|
||||
// - Progress holder is 3px
|
||||
// - Progress handle is 9px
|
||||
// - Progress handle is pulled up 3px to center it.
|
||||
//
|
||||
// Hover:
|
||||
// - Progress holder becomes 5px
|
||||
// - Progress handle becomes 15px
|
||||
// - Progress handle is pulled up 5px to center it
|
||||
//
|
||||
|
||||
.video-js .vjs-progress-control {
|
||||
@include flex(auto);
|
||||
@ -21,30 +21,30 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Box containing play and load progresses. Also acts as seek scrubber. */
|
||||
// Box containing play and load progresses. Also acts as seek scrubber.
|
||||
.video-js .vjs-progress-holder {
|
||||
@include flex(auto);
|
||||
@include transition(all 0.2s);
|
||||
height: 0.3em;
|
||||
}
|
||||
|
||||
/* We need an increased hit area on hover */
|
||||
// We need an increased hit area on hover
|
||||
.video-js .vjs-progress-control:hover .vjs-progress-holder {
|
||||
font-size: 1.666666666666666666em
|
||||
}
|
||||
|
||||
/* Also show the current time tooltip */
|
||||
/* If we let the font size grow as much as everything else, the current time tooltip ends up
|
||||
ginormous. If you'd like to enable the current time tooltip all the time, this should be disabled
|
||||
to avoid a weird hitch when you roll off the hover. */
|
||||
|
||||
// Also show the current time tooltip
|
||||
.video-js .vjs-progress-control:hover .vjs-mouse-display:after,
|
||||
.video-js .vjs-progress-control:hover .vjs-play-progress:after {
|
||||
display: block;
|
||||
|
||||
/* If we let the font size grow as much as everything else, the current time tooltip ends up
|
||||
ginormous. If you'd like to enable the current time tooltip all the time, this should be disabled
|
||||
to avoid a weird hitch when you roll off the hover. */
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
/* Progress Bars */
|
||||
// Progress Bars
|
||||
.video-js .vjs-progress-holder .vjs-play-progress,
|
||||
.video-js .vjs-progress-holder .vjs-load-progress,
|
||||
.video-js .vjs-progress-holder .vjs-load-progress div {
|
||||
@ -53,9 +53,9 @@
|
||||
height: 0.3em;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
/* updated by javascript during playback */
|
||||
// updated by javascript during playback
|
||||
width: 0;
|
||||
/* Needed for IE6 *///
|
||||
// Needed for IE6
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
@ -81,9 +81,9 @@
|
||||
}
|
||||
|
||||
// Current Time "tooltip"
|
||||
// By default this is hidden and only shown when hovering over the progress control
|
||||
.video-js .vjs-mouse-display:after,
|
||||
.video-js .vjs-play-progress:after {
|
||||
/* By default this is hidden and only shown when hovering over the progress control */
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: -2.4em;
|
||||
@ -101,18 +101,18 @@
|
||||
}
|
||||
|
||||
.video-js .vjs-load-progress {
|
||||
/* For IE8 we'll lighten the color */
|
||||
// For IE8 we'll lighten the color
|
||||
background: ligthen($secondary-background-color, 25%);
|
||||
/* Otherwise we'll rely on stacked opacities */
|
||||
// Otherwise we'll rely on stacked opacities
|
||||
background: rgba($secondary-background-color, $secondary-background-transparency);
|
||||
}
|
||||
|
||||
/* there are child elements of the load progress bar that represent the
|
||||
specific time ranges that have been buffered */
|
||||
// there are child elements of the load progress bar that represent the
|
||||
// specific time ranges that have been buffered
|
||||
.video-js .vjs-load-progress div {
|
||||
/* For IE8 we'll lighten the color */
|
||||
// For IE8 we'll lighten the color
|
||||
background: ligthen($secondary-background-color, 50%);
|
||||
/* Otherwise we'll rely on stacked opacities */
|
||||
// Otherwise we'll rely on stacked opacities
|
||||
background: rgba($secondary-background-color, 0.75);
|
||||
}
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
/* Emulated tracks */
|
||||
// Emulated tracks
|
||||
.vjs-text-track-display {
|
||||
position: absolute;
|
||||
bottom: 3em;
|
||||
@ -8,30 +8,30 @@
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* Move captions down when controls aren't being shown */
|
||||
// Move captions down when controls aren't being shown
|
||||
.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
|
||||
bottom: 1em;
|
||||
}
|
||||
|
||||
/* Individual tracks */
|
||||
// Individual tracks
|
||||
.video-js .vjs-text-track {
|
||||
font-size: 1.4em;
|
||||
text-align: center;
|
||||
margin-bottom: 0.1em;
|
||||
/* Transparent black background, or fallback to all black (oldIE) */
|
||||
// Transparent black background, or fallback to all black (oldIE)
|
||||
@include background-color-with-alpha(#000, 0.5);
|
||||
}
|
||||
|
||||
.vjs-subtitles { color: #fff /* Subtitles are white */; }
|
||||
.vjs-captions { color: #fc6 /* Captions are yellow */; }
|
||||
.vjs-subtitles { color: #fff; } // Subtitles are white
|
||||
.vjs-captions { color: #fc6; } // Captions are yellow
|
||||
.vjs-tt-cue { display: block; }
|
||||
|
||||
/* Native tracks */
|
||||
// Native tracks
|
||||
video::-webkit-media-text-track-display {
|
||||
@include transform(translateY(-3em));
|
||||
}
|
||||
|
||||
/* Move captions down when controls aren't being shown */
|
||||
// Move captions down when controls aren't being shown
|
||||
.video-js.vjs-user-inactive.vjs-playing video::-webkit-media-text-track-display {
|
||||
@include transform(translateY(-1.5em));
|
||||
}
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* We need the extra specificity that referencing .vjs-no-flex provides. */
|
||||
// We need the extra specificity that referencing .vjs-no-flex provides.
|
||||
.video-js .vjs-current-time,
|
||||
.vjs-no-flex .vjs-current-time {
|
||||
display: none;
|
||||
|
||||
@ -73,7 +73,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* Assumes volume starts at 1.0. */
|
||||
// Assumes volume starts at 1.0.
|
||||
.vjs-volume-bar.vjs-slider-vertical .vjs-volume-level {
|
||||
height: 100%;
|
||||
}
|
||||
@ -82,11 +82,11 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* The volume menu button is like menu buttons (captions/subtitles) but works
|
||||
a little differently. It needs to be possible to tab to the volume slider
|
||||
without hitting space bar on the menu button. To do this we're not using
|
||||
display:none to hide the slider menu by default, and instead setting the
|
||||
width and height to zero. */
|
||||
// The volume menu button is like menu buttons (captions/subtitles) but works
|
||||
// a little differently. It needs to be possible to tab to the volume slider
|
||||
// without hitting space bar on the menu button. To do this we're not using
|
||||
// display:none to hide the slider menu by default, and instead setting the
|
||||
// width and height to zero.
|
||||
.vjs-menu-button-popup.vjs-volume-menu-button .vjs-menu {
|
||||
display: block;
|
||||
width: 0;
|
||||
@ -124,7 +124,7 @@ width and height to zero. */
|
||||
}
|
||||
|
||||
.vjs-volume-menu-button.vjs-menu-button-inline .vjs-menu-content {
|
||||
/* An inline volume should never have a menu background color.
|
||||
This protects it from external changes to background colors. */
|
||||
// An inline volume should never have a menu background color.
|
||||
// This protects it from external changes to background colors.
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
@ -3,19 +3,19 @@
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 10em;
|
||||
left: -3em; /* (Width of vjs-menu - width of button) / 2 */
|
||||
left: -3em; // (Width of vjs-menu - width of button) / 2
|
||||
height: 0em;
|
||||
margin-bottom: 1.5em;
|
||||
border-top-color: rgba($primary-background-color, $primary-background-transparency); /* Same as ul background */
|
||||
border-top-color: rgba($primary-background-color, $primary-background-transparency); // Same as ul background
|
||||
}
|
||||
|
||||
/* Button Pop-up Menu */
|
||||
// Button Pop-up Menu
|
||||
.vjs-menu-button-popup .vjs-menu .vjs-menu-content {
|
||||
@include background-color-with-alpha($primary-background-color, $primary-background-transparency);
|
||||
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 1.5em; /* Same bottom as vjs-menu border-top */
|
||||
bottom: 1.5em; // Same bottom as vjs-menu border-top
|
||||
max-height: 15em;
|
||||
}
|
||||
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* prevent menus from opening while scrubbing (FF, IE) */
|
||||
// prevent menus from opening while scrubbing (FF, IE)
|
||||
.vjs-scrubbing .vjs-menu-button:hover .vjs-menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user