@return #{$pixels/$context}em;
}
-@mixin transition($string: $transition--default) {
- transition: $string;
-}
-
.video-js {
.vjs-upnext-content {
+ transition: opacity 0.1s;
+
font-size: 1.8em;
pointer-events: auto;
position: absolute;
top: 0;
bottom: 0;
- background: rgba(0,0,0,0.6);
+ background: rgba(0, 0, 0, 0.6);
width: 100%;
-
- @include transition(opacity 0.1s);
}
.vjs-upnext-top {
+ margin: 0 auto;
width: 100%;
position: absolute;
- margin-left: auto;
- margin-right: auto;
bottom: 50%;
margin-bottom: 60px;
}
.vjs-upnext-bottom {
+ margin: 0 auto;
width: 100%;
position: absolute;
- margin-left: auto;
- margin-right: auto;
top: 50%;
margin-top: 52px;
}
+ .vjs-upnext-suspended,
.vjs-upnext-cancel {
display: block;
float: none;
text-align: center;
}
+ .vjs-upnext-suspended {
+ font-size: 50%;
+ margin-top: 1rem;
+ }
+
.vjs-upnext-headtext {
display: block;
font-size: 14px;
float: none;
padding: 10px !important;
font-size: 16px !important;
- border: none;
+ border: 0;
}
.vjs-upnext-cancel-button,
}
.vjs-upnext-cancel-button:hover {
- background-color: rgba(255,255,255,0.25);
+ background-color: rgba(255, 255, 255, 0.25);
border-radius: 2px;
}
}
.vjs-upnext-autoplay-icon {
+ transition: stroke-dasharray 0.1s cubic-bezier(0.4, 0, 1, 1);
+
position: absolute;
top: 50%;
left: 50%;
width: 98px;
height: 98px;
margin: -49px 0 0 -49px;
- transition: stroke-dasharray 0.1s cubic-bezier(0.4,0,1,1);
cursor: pointer;
}