diff options
| author | Sam Potts <sam@potts.es> | 2021-05-12 23:31:01 +1000 |
|---|---|---|
| committer | Sam Potts <sam@potts.es> | 2021-05-12 23:37:05 +1000 |
| commit | 5fd4391cd923bac874f67413cbacc42c77648759 (patch) | |
| tree | f1c9f02aed2989597e9c4cb6dcb231831a3c98ed /src/sass | |
| parent | b050fde276b181464e0ccbf2d3ac7835032517fd (diff) | |
| download | plyr-5fd4391cd923bac874f67413cbacc42c77648759.tar.lz plyr-5fd4391cd923bac874f67413cbacc42c77648759.tar.xz plyr-5fd4391cd923bac874f67413cbacc42c77648759.zip | |
fix: fullscreen issues with Vimeo (fixes #2175)
Diffstat (limited to 'src/sass')
| -rw-r--r-- | src/sass/lib/mixins.scss | 11 | ||||
| -rw-r--r-- | src/sass/types/video.scss | 15 |
2 files changed, 5 insertions, 21 deletions
diff --git a/src/sass/lib/mixins.scss b/src/sass/lib/mixins.scss index cbb8cc78..d1bc4b3e 100644 --- a/src/sass/lib/mixins.scss +++ b/src/sass/lib/mixins.scss @@ -59,17 +59,6 @@ height: 100%; } - .plyr__video-wrapper { - height: 100%; - position: static; - } - - // Vimeo requires some different styling - &.plyr--vimeo .plyr__video-wrapper { - height: 0; - position: relative; - } - // Display correct icon .plyr__control .icon--exit-fullscreen { display: block; diff --git a/src/sass/types/video.scss b/src/sass/types/video.scss index fe7d8b37..e0de7acc 100644 --- a/src/sass/types/video.scss +++ b/src/sass/types/video.scss @@ -14,7 +14,6 @@ .plyr__video-wrapper { background: var(--plyr-video-background, $plyr-video-background); - height: 100%; margin: auto; overflow: hidden; position: relative; @@ -45,17 +44,13 @@ $embed-padding: ((100 / 16) * 9); width: 100%; } -// If the full custom UI is supported -.plyr--full-ui .plyr__video-embed { +// For Vimeo, if the full custom UI is supported +.plyr--full-ui .plyr__video-embed > .plyr__video-embed__container { $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); - } + padding-bottom: to-percentage($height); + position: relative; + transform: translateY(-$offset); } // Controls container |