}
.vjs-big-play-button {
+ outline: 0;
font-size: 8em;
$big-play-width: 3em;
$big-play-height: 1.5em;
- line-height: $big-play-height;
- height: $big-play-height;
- width: $big-play-width;
-
border: 0;
border-radius: 0.3em;
top: 50%;
margin-left: -($big-play-width / 2);
margin-top: -($big-play-height / 2);
- }
-
- &:hover .vjs-big-play-button {
- background-color: transparent;
+ background-color: transparent !important;
}
.vjs-control-bar,
padding: 0;
.vjs-current-time-display {
- line-height: $control-bar-height;
+ line-height: calc(#{$control-bar-height} + 1px);
&::after {
content: "/";
padding: 0;
.vjs-duration-display {
- line-height: $control-bar-height;
+ line-height: calc(#{$control-bar-height} + 1px);
}
}
text-align: right;
padding-right: 60px;
+ .vjs-webtorrent-displayed {
+ display: block;
+ }
+
+ .vjs-webtorrent-hidden {
+ display: none;
+ }
+
.download-speed-number, .upload-speed-number, .peers-number {
font-weight: $font-semibold;
}
.vjs-menu-button-popup {
font-size: 13px;
font-weight: $font-semibold;
- width: 42px;
+ width: 50px;
// Thanks: https://github.com/kmoskwiak/videojs-resolution-switcher/pull/92/files
.vjs-resolution-button-label {
line-height: $control-bar-height;
position: absolute;
top: 0;
- left: -1px;
+ left: 4px;
width: 100%;
height: 100%;
text-align: center;
box-sizing: inherit;
+ text-align: center;
}
.vjs-resolution-button {
top: 20px;
.vjs-menu-content {
- width: 4em;
+ width: 50px;
left: 50%; /* Center the menu, in it's parent */
- margin-left: -2em; /* half of width, to center */
+ margin-left: -21px;
}
li {
}
}
}
+
+ @media screen and (max-width: 550px) {
+ .vjs-webtorrent {
+ padding: 0 !important;
+
+ .vjs-webtorrent-displayed {
+ display: none !important;
+ }
+ }
+ }
+
+ @media screen and (max-width: 300px) {
+ .vjs-volume-control {
+ display: none !important;
+ }
+
+ .vjs-volume-panel {
+ width: 26px !important;
+ margin-right: 83px !important;
+ }
+ }
}
// Thanks: https://projects.lukehaas.me/css-loaders/
.vjs-loading-spinner {
- margin: 0 !important;
- //position: absolute;
- // 15px is the nav bar height
- top: calc(50% - 15px);
left: 50%;
font-size: 10px;
- position: relative;
text-indent: -9999em;
border: 0.7em solid rgba(255, 255, 255, 0.2);
border-left-color: #ffffff;
transform: translateZ(0);
animation: spinner 1.4s infinite linear;
+ overflow: hidden;
&:before {
animation: none !important;
}
}
}
+