diff options
author | Chocobozzz <me@florianbigard.com> | 2018-07-17 17:06:34 +0200 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2018-07-17 17:06:34 +0200 |
commit | 3b492bff49bbab71e826cc4fe93db8c6a74a3391 (patch) | |
tree | a3062ab728c2ec462e25a384009e05ef86245e38 /client/src/app/videos/+video-watch/video-watch.component.scss | |
parent | 330eaf12969ed0f15f93d5dd50599885f62ffbed (diff) | |
download | PeerTube-3b492bff49bbab71e826cc4fe93db8c6a74a3391.tar.gz PeerTube-3b492bff49bbab71e826cc4fe93db8c6a74a3391.tar.zst PeerTube-3b492bff49bbab71e826cc4fe93db8c6a74a3391.zip |
Fix regression in theater mode
Diffstat (limited to 'client/src/app/videos/+video-watch/video-watch.component.scss')
-rw-r--r-- | client/src/app/videos/+video-watch/video-watch.component.scss | 24 |
1 files changed, 13 insertions, 11 deletions
diff --git a/client/src/app/videos/+video-watch/video-watch.component.scss b/client/src/app/videos/+video-watch/video-watch.component.scss index 4ce17209f..a2d56bd39 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.scss +++ b/client/src/app/videos/+video-watch/video-watch.component.scss | |||
@@ -5,12 +5,6 @@ | |||
5 | background-color: #000; | 5 | background-color: #000; |
6 | display: flex; | 6 | display: flex; |
7 | justify-content: center; | 7 | justify-content: center; |
8 | height: 500px; | ||
9 | |||
10 | @media screen and (max-width: 600px) { | ||
11 | width: 100vw; | ||
12 | height: calc(100vw / 1.7); // 16/9 | ||
13 | } | ||
14 | 8 | ||
15 | .remote-server-down { | 9 | .remote-server-down { |
16 | color: #fff; | 10 | color: #fff; |
@@ -21,8 +15,8 @@ | |||
21 | justify-content: center; | 15 | justify-content: center; |
22 | background-color: #141313; | 16 | background-color: #141313; |
23 | width: 100%; | 17 | width: 100%; |
24 | height: 100%; | ||
25 | font-size: 24px; | 18 | font-size: 24px; |
19 | height: 500px; | ||
26 | 20 | ||
27 | @media screen and (max-width: 1000px) { | 21 | @media screen and (max-width: 1000px) { |
28 | font-size: 20px; | 22 | font-size: 20px; |
@@ -35,7 +29,12 @@ | |||
35 | 29 | ||
36 | /deep/ .video-js { | 30 | /deep/ .video-js { |
37 | width: 888px; | 31 | width: 888px; |
38 | height: 100%; | 32 | height: 500px; |
33 | |||
34 | &.vjs-theater-enabled { | ||
35 | height: calc(100vh - #{$header-height} - #{$theater-bottom-space}); | ||
36 | width: 100%; | ||
37 | } | ||
39 | 38 | ||
40 | // VideoJS create an inner video player | 39 | // VideoJS create an inner video player |
41 | video { | 40 | video { |
@@ -44,9 +43,12 @@ | |||
44 | } | 43 | } |
45 | } | 44 | } |
46 | 45 | ||
47 | /deep/ .video-js.vjs-theater-enabled { | 46 | @media screen and (max-width: 600px) { |
48 | width: 100%; | 47 | .remote-server-down, |
49 | height: calc(100vh - #{$header-height} - #{$theater-bottom-space}); | 48 | /deep/ .video-js { |
49 | width: 100vw; | ||
50 | height: calc(100vw / 1.7); // 16/9 | ||
51 | } | ||
50 | } | 52 | } |
51 | } | 53 | } |
52 | 54 | ||