aboutsummaryrefslogtreecommitdiffstats
path: root/src/less/components
diff options
context:
space:
mode:
authorSam Potts <sam@potts.es>2017-12-08 15:54:08 +0000
committerSam Potts <sam@potts.es>2017-12-08 15:54:08 +0000
commit82f81f4f735c74b7425a66b7c9ec6f0bd91ae7a2 (patch)
tree8a0f1839efbf7b91d346cc79b87ca6f5324df347 /src/less/components
parentc8990bd379d97f4eb14cc35aaa90caebfb7db220 (diff)
downloadplyr-82f81f4f735c74b7425a66b7c9ec6f0bd91ae7a2.tar.lz
plyr-82f81f4f735c74b7425a66b7c9ec6f0bd91ae7a2.tar.xz
plyr-82f81f4f735c74b7425a66b7c9ec6f0bd91ae7a2.zip
More Edge fixes and small UI bugs
Diffstat (limited to 'src/less/components')
-rw-r--r--src/less/components/menus.less3
-rw-r--r--src/less/components/progress.less21
-rw-r--r--src/less/components/sliders.less4
3 files changed, 7 insertions, 21 deletions
diff --git a/src/less/components/menus.less b/src/less/components/menus.less
index 80b8fabe..f0a92d06 100644
--- a/src/less/components/menus.less
+++ b/src/less/components/menus.less
@@ -3,6 +3,7 @@
// --------------------------------------------------------------
.plyr__menu {
+ display: flex; // Edge fix
position: relative;
// Animate the icon
@@ -11,7 +12,7 @@
}
.plyr__control[aria-expanded='true'] {
svg {
- transform: rotate(45deg);
+ transform: rotate(90deg);
}
// Hide tooltip
diff --git a/src/less/components/progress.less b/src/less/components/progress.less
index 1472f9c5..1a252937 100644
--- a/src/less/components/progress.less
+++ b/src/less/components/progress.less
@@ -4,7 +4,7 @@
.plyr__progress {
position: relative;
- display: none;
+ display: flex;
flex: 1;
input[type='range'] {
@@ -19,10 +19,6 @@
}
}
-.plyr .plyr__progress {
- display: inline-block;
-}
-
.plyr__progress--buffer {
position: absolute;
left: 0;
@@ -40,6 +36,7 @@
&::-webkit-progress-bar {
background: transparent;
+ transition: width 0.2s ease;
}
&::-webkit-progress-value {
@@ -53,24 +50,12 @@
background: currentColor;
border-radius: 100px;
min-width: @plyr-range-track-height;
+ transition: width 0.2s ease;
}
// Microsoft
&::-ms-fill {
border-radius: 100px;
- }
-}
-
-.plyr__progress--buffer {
- &::-webkit-progress-value {
- transition: width 0.2s ease;
- }
-
- &::-moz-progress-bar {
- transition: width 0.2s ease;
- }
-
- &::-ms-fill {
transition: width 0.2s ease;
}
}
diff --git a/src/less/components/sliders.less b/src/less/components/sliders.less
index b420c8ad..41954a97 100644
--- a/src/less/components/sliders.less
+++ b/src/less/components/sliders.less
@@ -5,7 +5,7 @@
// Specificity is for bootstrap compatibility
.plyr--full-ui input[type='range'] {
display: block;
- height: (@plyr-range-thumb-height * @plyr-range-thumb-active-scale);
+ height: @plyr-range-thumb-active-height;
width: 100%;
margin: 0;
padding: 0;
@@ -16,7 +16,7 @@
border-radius: (@plyr-range-thumb-height * 2);
// Used in JS to populate lower fill for WebKit
- color: @plyr-range-selected-bg;
+ color: @plyr-range-fill-bg;
// WebKit
-webkit-appearance: none;