aboutsummaryrefslogtreecommitdiffstats
path: root/src/sass/components/volume.scss
diff options
context:
space:
mode:
authorSam Potts <sam@potts.es>2020-03-30 10:45:57 +1100
committerSam Potts <sam@potts.es>2020-03-30 10:45:57 +1100
commitda943b384ca334cad66fd261cb9a0f924716da9d (patch)
tree5aaac37b474a2708c7910eb536b9d96d4c0dcff3 /src/sass/components/volume.scss
parent50a7c2fad6f0d9b03788fe57a855894eafcf5ef7 (diff)
parentad63af5096e014785bd22eac24bc8030c0dc70d6 (diff)
downloadplyr-da943b384ca334cad66fd261cb9a0f924716da9d.tar.lz
plyr-da943b384ca334cad66fd261cb9a0f924716da9d.tar.xz
plyr-da943b384ca334cad66fd261cb9a0f924716da9d.zip
Merge branch 'develop' into css-variables
# Conflicts: # demo/dist/demo.css # demo/dist/demo.min.js.map # demo/index.html # dist/plyr.css # dist/plyr.min.js.map # dist/plyr.min.mjs.map # dist/plyr.polyfilled.min.js.map # dist/plyr.polyfilled.min.mjs.map # gulpfile.js # src/sass/base.scss # src/sass/components/control.scss # src/sass/settings/colors.scss # src/sass/settings/controls.scss
Diffstat (limited to 'src/sass/components/volume.scss')
-rw-r--r--src/sass/components/volume.scss26
1 files changed, 7 insertions, 19 deletions
diff --git a/src/sass/components/volume.scss b/src/sass/components/volume.scss
index 82a6dd36..614b35f5 100644
--- a/src/sass/components/volume.scss
+++ b/src/sass/components/volume.scss
@@ -5,33 +5,21 @@
.plyr__volume {
align-items: center;
display: flex;
- flex: 1;
+ max-width: 110px;
+ min-width: 80px;
position: relative;
+ width: 20%;
input[type='range'] {
margin-left: ($plyr-control-spacing / 2);
+ margin-right: ($plyr-control-spacing / 2);
position: relative;
z-index: 2;
}
-
- @media (min-width: $plyr-bp-sm) {
- max-width: 90px;
- }
-
- @media (min-width: $plyr-bp-md) {
- max-width: 110px;
- }
}
-// Hide sound controls on iOS
-// It's not supported to change volume using JavaScript:
-// https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html
+// Auto size on iOS as there's no slider
.plyr--is-ios .plyr__volume {
- display: none !important;
-}
-
-// Vimeo has no toggle mute method so hide mute button
-// https://github.com/vimeo/player.js/issues/236#issuecomment-384663183
-.plyr--is-ios.plyr--vimeo [data-plyr='mute'] {
- display: none !important;
+ min-width: 0;
+ width: auto;
}