lbry-desktop/ui/component/viewers/videoViewer/internal/plugins/videojs-overlay/plugin.scss

85 lines
1.4 KiB
SCSS
Raw Normal View History

.video-js {
$bottom: 3.5em;
$nudge: 5px;
$middle: 50%;
$offset-h: -16.5%;
$offset-v: -15px;
.vjs-overlay {
color: #fff;
position: absolute;
text-align: center;
}
.vjs-overlay-no-background {
max-width: 33%;
}
.vjs-overlay-background {
// IE8
background-color: #646464;
background-color: rgba(255, 255, 255, 0.4);
2022-03-23 21:00:57 +01:00
border-radius: calc(#{$nudge} / 2);
padding: $nudge * 2;
width: 33%;
}
.vjs-overlay-top-left {
top: $nudge;
left: $nudge;
}
.vjs-overlay-top {
left: $middle;
margin-left: $offset-h;
top: $nudge;
}
.vjs-overlay-top-right {
right: $nudge;
top: $nudge;
}
.vjs-overlay-right {
right: $nudge;
top: $middle;
transform: translateY(-50%);
}
.vjs-overlay-bottom-right {
bottom: $bottom;
right: $nudge;
}
.vjs-overlay-bottom {
bottom: $bottom;
left: $middle;
margin-left: $offset-h;
}
.vjs-overlay-bottom-left {
bottom: $bottom;
left: $nudge;
}
.vjs-overlay-left {
left: $nudge;
top: $middle;
transform: translateY(-50%);
}
.vjs-overlay-center {
left: $middle;
margin-left: $offset-h;
top: $middle;
transform: translateY(-50%);
}
// Fallback for IE8 and IE9
.vjs-no-flex .vjs-overlay-left,
.vjs-no-flex .vjs-overlay-center,
.vjs-no-flex .vjs-overlay-right {
margin-top: $offset-v;
}
2021-02-13 13:26:07 +01:00
}