ProximaEntertainment/plyr
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix issues with fixed ratios and 100% height/width

Browse Source
This commit is contained in:
Sam Potts 2020-01-14 22:32:45 +00:00
parent a77d2d56f6
commit def3668030
3 changed files with 5 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/sass/base.scss
View File

@ -5,8 +5,9 @@
// Base // Base
.plyr { .plyr {
@include plyr-font-smoothing($plyr-font-smoothing); @include plyr-font-smoothing($plyr-font-smoothing);
align-items: center;
direction: ltr; direction: ltr;
display: flex;
font-family: $plyr-font-family; font-family: $plyr-font-family;
font-variant-numeric: tabular-nums; // Force monosace-esque number widths font-variant-numeric: tabular-nums; // Force monosace-esque number widths
font-weight: $plyr-font-weight-regular; font-weight: $plyr-font-weight-regular;

2
src/sass/components/video.scss
View File

@ -15,8 +15,10 @@
.plyr__video-wrapper { .plyr__video-wrapper {
background: #000; background: #000;
border-radius: inherit; border-radius: inherit;
margin: auto;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
width: 100%;
// Require z-index to force border-radius // Require z-index to force border-radius
z-index: 0; z-index: 0;
} }

2
src/sass/states/fullscreen.scss
View File

@ -24,8 +24,8 @@
// Fallback for unsupported browsers // Fallback for unsupported browsers
.plyr--fullscreen-fallback { .plyr--fullscreen-fallback {
@include plyr-fullscreen-active(); @include plyr-fullscreen-active();
bottom: 0; bottom: 0;
display: block;
left: 0; left: 0;
position: fixed; position: fixed;
right: 0; right: 0;