aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-12-11 10:26:29 +0100
committerChocobozzz <florian.bigard@gmail.com>2017-12-11 10:26:29 +0100
commit9e6b41cc1d825182bcfdf51364fdf3eae8001244 (patch)
tree5aa2111351d78b04d21839a9d2b34463a243d7c4 /client
parent20206dfb0bfe1537912ae0a5b99f2fa40c881d33 (diff)
downloadPeerTube-9e6b41cc1d825182bcfdf51364fdf3eae8001244.tar.gz
PeerTube-9e6b41cc1d825182bcfdf51364fdf3eae8001244.tar.zst
PeerTube-9e6b41cc1d825182bcfdf51364fdf3eae8001244.zip
Embed player responsive
Diffstat (limited to 'client')
-rw-r--r--client/src/sass/video-js-custom.scss1
-rw-r--r--client/src/standalone/videos/embed.html2
-rw-r--r--client/src/standalone/videos/embed.scss32
3 files changed, 24 insertions, 11 deletions
diff --git a/client/src/sass/video-js-custom.scss b/client/src/sass/video-js-custom.scss
index fe9495e77..1c5701bea 100644
--- a/client/src/sass/video-js-custom.scss
+++ b/client/src/sass/video-js-custom.scss
@@ -23,6 +23,7 @@ $control-bar-height: 34px;
23 } 23 }
24 24
25 .vjs-big-play-button { 25 .vjs-big-play-button {
26 outline: 0;
26 font-size: 8em; 27 font-size: 8em;
27 28
28 $big-play-width: 3em; 29 $big-play-width: 3em;
diff --git a/client/src/standalone/videos/embed.html b/client/src/standalone/videos/embed.html
index 0a35bc362..fa4d0bdba 100644
--- a/client/src/standalone/videos/embed.html
+++ b/client/src/standalone/videos/embed.html
@@ -11,7 +11,7 @@
11 11
12 <body> 12 <body>
13 13
14 <video id="video-container" class="video-js vjs-sublime-skin vjs-big-play-centered"> 14 <video id="video-container" class="video-js vjs-peertube-skin">
15 </video> 15 </video>
16 16
17 </body> 17 </body>
diff --git a/client/src/standalone/videos/embed.scss b/client/src/standalone/videos/embed.scss
index b76f09677..9140cd37c 100644
--- a/client/src/standalone/videos/embed.scss
+++ b/client/src/standalone/videos/embed.scss
@@ -23,17 +23,13 @@ html, body {
23} 23}
24 24
25.vjs-peertube-link { 25.vjs-peertube-link {
26 color: white; 26 color: #fff;
27 text-decoration: none; 27 text-decoration: none;
28 font-size: 1.3em; 28 font-size: $font-size;
29 line-height: 2.20; 29 line-height: $control-bar-height;
30 transition: all .4s; 30 transition: all .4s;
31 position: relative; 31 font-weight: $font-semibold;
32 right: 8px; 32 margin-right: 3px;
33}
34
35.vjs-resolution-button-label {
36 left: -7px;
37} 33}
38 34
39.vjs-peertube-link:hover { 35.vjs-peertube-link:hover {
@@ -42,5 +38,21 @@ html, body {
42 38
43// Fix volume panel because we added a new component (PeerTube link) 39// Fix volume panel because we added a new component (PeerTube link)
44.vjs-volume-panel { 40.vjs-volume-panel {
45 margin-right: 130px !important; 41 margin-right: 121px !important;
42}
43
44@media screen and (max-width: 350px) {
45 .vjs-play-control {
46 padding: 0 5px !important;
47 width: 25px !important;
48 }
49
50 .vjs-volume-control {
51 display: none !important;
52 }
53
54 .vjs-volume-panel {
55 width: 26px !important;
56 margin-right: 140px !important;
57 }
46} 58}