aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/standalone/videos/embed.scss
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2017-12-20 09:43:51 +0100
committerChocobozzz <me@florianbigard.com>2017-12-20 09:52:59 +0100
commit86f278cb4c582d487959b532b570b1a59f1fe5d2 (patch)
tree4da5a387e457d501f3839b88d31009546cb312cd /client/src/standalone/videos/embed.scss
parente203f2e0e1ba778201191dfaf83bc90341616610 (diff)
downloadPeerTube-86f278cb4c582d487959b532b570b1a59f1fe5d2.tar.gz
PeerTube-86f278cb4c582d487959b532b570b1a59f1fe5d2.tar.zst
PeerTube-86f278cb4c582d487959b532b570b1a59f1fe5d2.zip
Improve player on small screen
Diffstat (limited to 'client/src/standalone/videos/embed.scss')
-rw-r--r--client/src/standalone/videos/embed.scss71
1 files changed, 39 insertions, 32 deletions
diff --git a/client/src/standalone/videos/embed.scss b/client/src/standalone/videos/embed.scss
index b6ca13e0e..fbc0e33a0 100644
--- a/client/src/standalone/videos/embed.scss
+++ b/client/src/standalone/videos/embed.scss
@@ -14,47 +14,54 @@ html, body {
14 margin: 0; 14 margin: 0;
15} 15}
16 16
17.video-js { 17
18
19.video-js.vjs-peertube-skin {
18 width: 100%; 20 width: 100%;
19 height: 100%; 21 height: 100%;
20 overflow: hidden; 22 overflow: hidden;
21}
22
23.vjs-poster {
24 background-size: 100% auto;
25}
26
27.vjs-peertube-link {
28 color: #fff;
29 text-decoration: none;
30 font-size: $font-size;
31 line-height: $control-bar-height;
32 transition: all .4s;
33 font-weight: $font-semibold;
34 margin-right: 3px;
35}
36
37.vjs-peertube-link:hover {
38 text-shadow: 0 0 1em #fff;
39}
40 23
41// Fix volume panel because we added a new component (PeerTube link) 24 .vjs-poster {
42.vjs-volume-panel { 25 background-size: 100% auto;
43 margin-right: 121px !important; 26 }
44}
45 27
46@media screen and (max-width: 350px) { 28 .vjs-peertube-link {
47 .vjs-play-control { 29 color: #fff;
48 padding: 0 5px !important; 30 text-decoration: none;
49 width: 25px !important; 31 font-size: $font-size;
32 line-height: $control-bar-height;
33 transition: all .4s;
34 font-weight: $font-semibold;
35 margin-right: 3px;
36 padding: 0 5px;
50 } 37 }
51 38
52 .vjs-volume-control { 39 .vjs-peertube-link:hover {
53 display: none !important; 40 text-shadow: 0 0 1em #fff;
54 } 41 }
55 42
43 // Fix volume panel because we added a new component (PeerTube link)
56 .vjs-volume-panel { 44 .vjs-volume-panel {
57 width: 26px !important; 45 margin-right: 137px !important;
58 margin-right: 140px !important; 46 }
47
48 @media screen and (max-width: 350px) {
49 .vjs-play-control {
50 padding: 0 5px !important;
51 width: 25px !important;
52 }
53
54 .vjs-volume-control {
55 display: none !important;
56 }
57
58 .vjs-volume-panel {
59 width: 26px !important;
60 margin-right: 140px !important;
61 }
62
63 .vjs-peertube-link {
64 padding: 0;
65 }
59 } 66 }
60} 67}