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

Tab focus and caption position fixes (fixes #61, fixes #92)

Browse Source
This commit is contained in:
Sam Potts
2015-07-25 18:30:47 +10:00
parent 4dbbbd04cc
commit df64fdac9e
12 changed files with 98 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/less/plyr.less
View File

@ -351,9 +351,9 @@
}
}
label:hover .player-tooltip,
input:focus + label .player-tooltip,
input.tab-focus:focus + label .player-tooltip,
button:hover .player-tooltip,
button:focus .player-tooltip {
button.tab-focus:focus .player-tooltip {
visibility: visible;
opacity: 1;
transform: translate(-50%, 0) scale(1);
@ -596,16 +596,7 @@
.player-video-wrapper {
height: 100%;
width: 100%;
.player-captions {
top: auto;
bottom: 90px;
@media (min-width: @bp-control-split) {
bottom: 60px;
}
}
}
}
.player-controls {
position: absolute;
bottom: 0;
@ -614,13 +605,29 @@
}
// Hide controls when playing in full screen
&.fullscreen-hide-controls.playing .player-controls {
transform: translateY(100%) translateY(@control-spacing / 2);
transition: transform .3s .2s ease;
&.hover {
&.fullscreen-hide-controls.playing {
.player-controls {
transform: translateY(100%) translateY(@control-spacing / 2);
transition: transform .3s .2s ease;
}
&.player-hover .player-controls {
transform: translateY(0);
}
.player-captions {
bottom: (@control-spacing / 2);
transition: bottom .3s .2s ease;
}
}
// Captions
.player-captions,
&.fullscreen-hide-controls.playing.player-hover .player-captions {
top: auto;
bottom: 90px;
@media (min-width: @bp-control-split) {
bottom: 60px;
}
}
}