aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/sass
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-06-11 16:49:56 +0200
committerChocobozzz <me@florianbigard.com>2018-06-11 16:49:56 +0200
commit054a103b286277708a3a807a52da6cca12e1b0ce (patch)
treec52421b96951be9c4fbf654ab0c4b759aeb9aff9 /client/src/sass
parent54a3a12ed2d972386c12d59717eedfadd7203767 (diff)
downloadPeerTube-054a103b286277708a3a807a52da6cca12e1b0ce.tar.gz
PeerTube-054a103b286277708a3a807a52da6cca12e1b0ce.tar.zst
PeerTube-054a103b286277708a3a807a52da6cca12e1b0ce.zip
Add theatre mode
Diffstat (limited to 'client/src/sass')
-rw-r--r--client/src/sass/include/_variables.scss2
-rw-r--r--client/src/sass/player/peertube-skin.scss25
2 files changed, 27 insertions, 0 deletions
diff --git a/client/src/sass/include/_variables.scss b/client/src/sass/include/_variables.scss
index 95b4b166e..092f8ed24 100644
--- a/client/src/sass/include/_variables.scss
+++ b/client/src/sass/include/_variables.scss
@@ -31,3 +31,5 @@ $footer-border-color: $header-border-color;
31 31
32$video-thumbnail-height: 110px; 32$video-thumbnail-height: 110px;
33$video-thumbnail-width: 200px; 33$video-thumbnail-width: 200px;
34
35$theater-bottom-space: 85px;
diff --git a/client/src/sass/player/peertube-skin.scss b/client/src/sass/player/peertube-skin.scss
index de6501962..e60a854d4 100644
--- a/client/src/sass/player/peertube-skin.scss
+++ b/client/src/sass/player/peertube-skin.scss
@@ -135,6 +135,7 @@
135 .vjs-resolution-control, 135 .vjs-resolution-control,
136 .vjs-fullscreen-control, 136 .vjs-fullscreen-control,
137 .vjs-peertube-link, 137 .vjs-peertube-link,
138 .vjs-theater-control,
138 .vjs-settings 139 .vjs-settings
139 { 140 {
140 color: $primary-foreground-color !important; 141 color: $primary-foreground-color !important;
@@ -394,6 +395,26 @@
394 padding: 0 5px; 395 padding: 0 5px;
395 } 396 }
396 397
398 .vjs-theater-control {
399 @include disable-outline;
400
401 width: 37px;
402 margin-right: 1px;
403
404 .vjs-icon-placeholder {
405 display: inline-block;
406 width: 22px;
407 height: 22px;
408 vertical-align: middle;
409 background: url('#{$assets-path}/player/images/theater.svg') no-repeat;
410 background-size: contain;
411
412 &::before {
413 content: '';
414 }
415 }
416 }
417
397 .vjs-fullscreen-control { 418 .vjs-fullscreen-control {
398 @include disable-outline; 419 @include disable-outline;
399 420
@@ -440,6 +461,10 @@
440 } 461 }
441 462
442 @media screen and (max-width: 750px) { 463 @media screen and (max-width: 750px) {
464 .vjs-theater-control {
465 display: none;
466 }
467
443 .vjs-dock-text { 468 .vjs-dock-text {
444 font-size: 16px; 469 font-size: 16px;
445 } 470 }