Moved all video styles together
This commit is contained in:
parent
9f30d54963
commit
c885d59270
@ -1,37 +0,0 @@
|
||||
// --------------------------------------------------------------
|
||||
// Embedded players
|
||||
// YouTube, Vimeo, etc
|
||||
// --------------------------------------------------------------
|
||||
|
||||
// Default to 16:9 ratio but this is set by JavaScript based on config
|
||||
$embed-padding: ((100 / 16) * 9);
|
||||
|
||||
.plyr__video-embed,
|
||||
.plyr__video-wrapper--fixed-ratio {
|
||||
height: 0;
|
||||
padding-bottom: to-percentage($embed-padding);
|
||||
}
|
||||
|
||||
.plyr__video-embed iframe,
|
||||
.plyr__video-wrapper--fixed-ratio video {
|
||||
border: 0;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
user-select: none;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// If the full custom UI is supported
|
||||
.plyr--full-ui .plyr__video-embed {
|
||||
$height: 240;
|
||||
$offset: to-percentage(($height - $embed-padding) / ($height / 50));
|
||||
|
||||
// Only used for Vimeo
|
||||
> .plyr__video-embed__container {
|
||||
padding-bottom: to-percentage($height);
|
||||
position: relative;
|
||||
transform: translateY(-$offset);
|
||||
}
|
||||
}
|
@ -20,3 +20,36 @@
|
||||
// Require z-index to force border-radius
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
// Default to 16:9 ratio but this is set by JavaScript based on config
|
||||
$embed-padding: ((100 / 16) * 9);
|
||||
|
||||
.plyr__video-embed,
|
||||
.plyr__video-wrapper--fixed-ratio {
|
||||
height: 0;
|
||||
padding-bottom: to-percentage($embed-padding);
|
||||
}
|
||||
|
||||
.plyr__video-embed iframe,
|
||||
.plyr__video-wrapper--fixed-ratio video {
|
||||
border: 0;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
user-select: none;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// If the full custom UI is supported
|
||||
.plyr--full-ui .plyr__video-embed {
|
||||
$height: 240;
|
||||
$offset: to-percentage(($height - $embed-padding) / ($height / 50));
|
||||
|
||||
// Only used for Vimeo
|
||||
> .plyr__video-embed__container {
|
||||
padding-bottom: to-percentage($height);
|
||||
position: relative;
|
||||
transform: translateY(-$offset);
|
||||
}
|
||||
}
|
||||
|
@ -29,7 +29,6 @@
|
||||
@import 'components/captions';
|
||||
@import 'components/control';
|
||||
@import 'components/controls';
|
||||
@import 'components/embed';
|
||||
@import 'components/menus';
|
||||
@import 'components/sliders';
|
||||
@import 'components/poster';
|
||||
|
Loading…
x
Reference in New Issue
Block a user