diff options
author | Sam Potts <sam@potts.es> | 2020-03-30 10:45:57 +1100 |
---|---|---|
committer | Sam Potts <sam@potts.es> | 2020-03-30 10:45:57 +1100 |
commit | da943b384ca334cad66fd261cb9a0f924716da9d (patch) | |
tree | 5aaac37b474a2708c7910eb536b9d96d4c0dcff3 /src/sass/components/volume.scss | |
parent | 50a7c2fad6f0d9b03788fe57a855894eafcf5ef7 (diff) | |
parent | ad63af5096e014785bd22eac24bc8030c0dc70d6 (diff) | |
download | plyr-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.scss | 26 |
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; } |