refactor, wrap controller within shadowroot

This commit is contained in:
Ilya Grigorik
2016-05-31 23:15:28 -07:00
parent 9f793167a5
commit b0547496c9
3 changed files with 92 additions and 118 deletions

View File

@@ -1,30 +1,11 @@
.tc-videoController {
position: absolute;
top: 0;
left: 0;
background: black;
color: white;
border-radius: 5px;
padding: 5px;
margin: 10px 10px 10px 15px;
cursor: default;
z-index: 9999999;
opacity: 0.3;
}
.tc-videoController:hover {
opacity: 0.7;
}
/* Origin specific overrides */
/* YouTube player */
.ytp-hide-info-bar .tc-videoController {
.ytp-hide-info-bar .vsc-controller {
margin-top: 10px;
}
.ytp-autohide .tc-videoController {
.ytp-autohide .vsc-controller {
visibility: hidden;
transition: opacity .25s cubic-bezier(0.4,0,0.2,1);
opacity: 0;
@@ -32,18 +13,18 @@
/* YouTube embedded player */
/* e.g. https://www.igvita.com/2012/09/12/web-fonts-performance-making-pretty-fast/ */
.full-frame .html5-video-player:not(.ytp-fullscreen) .tc-videoController {
.full-frame .html5-video-player:not(.ytp-fullscreen) .vsc-controller {
margin-top: 45px;
}
.ytp-fullscreen .tc-videoController {
.ytp-fullscreen .vsc-controller {
display: block;
margin-top: 60px;
}
/* shift controller on vine.co */
/* e.g. https://vine.co/v/OrJj39YlL57 */
.video-container .vine-video-container .tc-videoController {
.video-container .vine-video-container .vsc-controller {
margin-left: 40px;
}
@@ -52,6 +33,7 @@
.ytp-webgl-spherical-control {
top: 50px !important;
}
.ytp-fullscreen .ytp-webgl-spherical-control {
top: 100px !important;
}