Unfloyded/Legamunt
0
0
Fork 0
Code Activity

Volume sliders for videos #7429 (#9366)

Browse source 
* Volume sliders for videos #7429

* Code formatting updates

* Code formatting updates
This commit is contained in:
Sumit Khanna 2018-11-27 05:25:38 -06:00 • committed by Eugen Rochko
parent b6681d21ad
commit f978afa487
2 changed files with 122 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

57
app/javascript/styles/mastodon/components.scss
View file

@ -4658,6 +4658,19 @@ a.status-card.compact:hover {
z-index: 5;
}
.detailed,
.fullscreen {
.video-player__volume__current,
.video-player__volume::before {
bottom: 27px;
}
.video-player__volume__handle {
bottom: 23px;
}
}
.video-player {
overflow: hidden;
position: relative;
@ -4806,7 +4819,7 @@ a.status-card.compact:hover {
&__time-current {
color: $white;
margin-left: 10px;
margin-left: 60px;
}
&__time-sep {
@ -4819,6 +4832,48 @@ a.status-card.compact:hover {
color: $white;
}
&__volume {
cursor: pointer;
height: 24px;
display: inline;
&::before {
content: "";
width: 50px;
background: rgba($white, 0.35);
border-radius: 4px;
display: block;
position: absolute;
height: 4px;
left: 70px;
bottom: 20px;
}
&__current {
display: block;
position: absolute;
height: 4px;
border-radius: 4px;
left: 70px;
bottom: 20px;
background: lighten($ui-highlight-color, 8%);
}
&__handle {
position: absolute;
z-index: 3;
border-radius: 50%;
width: 12px;
height: 12px;
bottom: 16px;
left: 70px;
transition: opacity .1s ease;
background: lighten($ui-highlight-color, 8%);
box-shadow: 1px 2px 6px rgba($base-shadow-color, 0.2);
pointer-events: none;
}
}
&__seek {
cursor: pointer;
height: 24px;