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

SASS updated for icon changes

Browse Source
This commit is contained in:
Sam Potts 2015-03-04 21:44:41 +11:00
parent 3459387f04
commit 617ae146c1
1 changed files with 12 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/sass/plyr.scss
View File

@ -202,13 +202,13 @@ $bp-captions-large: 768px; // When captions jump to the larger font size
transition: fill .3s ease;
}
}
input + label,
input.inverted:checked + label {
[type="checkbox"] + label,
.inverted:checked + label {
color: $control-color-inactive;
}
button,
input.inverted + label,
input:checked + label {
.inverted + label,
[type="checkbox"]:checked + label {
color: $control-color;
}
button {
@ -216,18 +216,19 @@ $bp-captions-large: 768px; // When captions jump to the larger font size
background: transparent;
overflow: hidden;
}
input:focus + label,
[type="checkbox"]:focus + label,
button:focus {
@include tab-focus();
color: $control-color-focus;
}
button:hover,
input + label:hover {
[type="checkbox"] + label:hover {
background: $control-bg-hover;
color: $control-color-hover;
}
.icon-exit-fullscreen,
.icon-muted {
.icon-muted,
.icon-captions-on {
display: none;
}
.player-time {
@ -301,15 +302,6 @@ $bp-captions-large: 768px; // When captions jump to the larger font size
display: inline-block;
}
// Muted
&.muted .player-controls .icon-muted {
display: block;
& + svg {
display: none;
}
}
// Volume control
// <input[type='range']> element
// Specificity is for bootstrap compatibility
@ -412,8 +404,10 @@ $bp-captions-large: 768px; // When captions jump to the larger font size
}
}
// When true full screen, show exit fullscreen icon
&.fullscreen-active .icon-exit-fullscreen {
// Change icons on state change
&.fullscreen-active .icon-exit-fullscreen,
&.muted .player-controls .icon-muted,
&.captions-active .player-controls .icon-captions-on {
display: block;
& + svg {