Embed player responsive
This commit is contained in:
parent
20206dfb0b
commit
9e6b41cc1d
3 changed files with 24 additions and 11 deletions
|
@ -23,6 +23,7 @@ $control-bar-height: 34px;
|
|||
}
|
||||
|
||||
.vjs-big-play-button {
|
||||
outline: 0;
|
||||
font-size: 8em;
|
||||
|
||||
$big-play-width: 3em;
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
|
||||
<body>
|
||||
|
||||
<video id="video-container" class="video-js vjs-sublime-skin vjs-big-play-centered">
|
||||
<video id="video-container" class="video-js vjs-peertube-skin">
|
||||
</video>
|
||||
|
||||
</body>
|
||||
|
|
|
@ -23,17 +23,13 @@ html, body {
|
|||
}
|
||||
|
||||
.vjs-peertube-link {
|
||||
color: white;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font-size: 1.3em;
|
||||
line-height: 2.20;
|
||||
font-size: $font-size;
|
||||
line-height: $control-bar-height;
|
||||
transition: all .4s;
|
||||
position: relative;
|
||||
right: 8px;
|
||||
}
|
||||
|
||||
.vjs-resolution-button-label {
|
||||
left: -7px;
|
||||
font-weight: $font-semibold;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
.vjs-peertube-link:hover {
|
||||
|
@ -42,5 +38,21 @@ html, body {
|
|||
|
||||
// Fix volume panel because we added a new component (PeerTube link)
|
||||
.vjs-volume-panel {
|
||||
margin-right: 130px !important;
|
||||
margin-right: 121px !important;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 350px) {
|
||||
.vjs-play-control {
|
||||
padding: 0 5px !important;
|
||||
width: 25px !important;
|
||||
}
|
||||
|
||||
.vjs-volume-control {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.vjs-volume-panel {
|
||||
width: 26px !important;
|
||||
margin-right: 140px !important;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue