aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/standalone
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-03-01 19:02:51 +0100
committerChocobozzz <me@florianbigard.com>2018-03-01 19:02:51 +0100
commit3ec8dc096276ac3c7e5d8dca5f100017516f62ec (patch)
treeefeab8056224d54f44dc498a110fba54d831d4f0 /client/src/standalone
parentc7bfd4532ea5783be525525c8260159497cb0f64 (diff)
downloadPeerTube-3ec8dc096276ac3c7e5d8dca5f100017516f62ec.tar.gz
PeerTube-3ec8dc096276ac3c7e5d8dca5f100017516f62ec.tar.zst
PeerTube-3ec8dc096276ac3c7e5d8dca5f100017516f62ec.zip
Cleaner videojs control bar implementation
Diffstat (limited to 'client/src/standalone')
-rw-r--r--client/src/standalone/videos/embed.scss11
-rw-r--r--client/src/standalone/videos/embed.ts23
2 files changed, 25 insertions, 9 deletions
diff --git a/client/src/standalone/videos/embed.scss b/client/src/standalone/videos/embed.scss
index fbc0e33a0..9fa868c9b 100644
--- a/client/src/standalone/videos/embed.scss
+++ b/client/src/standalone/videos/embed.scss
@@ -26,25 +26,21 @@ html, body {
26 } 26 }
27 27
28 .vjs-peertube-link { 28 .vjs-peertube-link {
29 @include disable-outline;
30
29 color: #fff; 31 color: #fff;
30 text-decoration: none; 32 text-decoration: none;
31 font-size: $font-size; 33 font-size: $font-size;
32 line-height: $control-bar-height; 34 line-height: $control-bar-height;
33 transition: all .4s; 35 transition: all .4s;
34 font-weight: $font-semibold; 36 font-weight: $font-semibold;
35 margin-right: 3px; 37 padding-right: 5px;
36 padding: 0 5px;
37 } 38 }
38 39
39 .vjs-peertube-link:hover { 40 .vjs-peertube-link:hover {
40 text-shadow: 0 0 1em #fff; 41 text-shadow: 0 0 1em #fff;
41 } 42 }
42 43
43 // Fix volume panel because we added a new component (PeerTube link)
44 .vjs-volume-panel {
45 margin-right: 137px !important;
46 }
47
48 @media screen and (max-width: 350px) { 44 @media screen and (max-width: 350px) {
49 .vjs-play-control { 45 .vjs-play-control {
50 padding: 0 5px !important; 46 padding: 0 5px !important;
@@ -57,7 +53,6 @@ html, body {
57 53
58 .vjs-volume-panel { 54 .vjs-volume-panel {
59 width: 26px !important; 55 width: 26px !important;
60 margin-right: 140px !important;
61 } 56 }
62 57
63 .vjs-peertube-link { 58 .vjs-peertube-link {
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index bb6baf7f0..739ed5f45 100644
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -31,13 +31,34 @@ loadVideoInfo(videoId)
31 peertube: { 31 peertube: {
32 videoFiles: videoInfo.files, 32 videoFiles: videoInfo.files,
33 playerElement: videoElement, 33 playerElement: videoElement,
34 peerTubeLink: true,
35 videoViewUrl: getVideoUrl(videoId) + '/views', 34 videoViewUrl: getVideoUrl(videoId) + '/views',
36 videoDuration: videoInfo.duration 35 videoDuration: videoInfo.duration
37 }, 36 },
38 hotkeys: { 37 hotkeys: {
39 enableVolumeScroll: false 38 enableVolumeScroll: false
40 } 39 }
40 },
41 controlBar: {
42 children: [
43 'playToggle',
44 'currentTimeDisplay',
45 'timeDivider',
46 'durationDisplay',
47 'liveDisplay',
48
49 'flexibleWidthSpacer',
50 'progressControl',
51
52 'webTorrentButton',
53
54 'muteToggle',
55 'volumeControl',
56
57 'resolutionMenuButton',
58 'peerTubeLinkButton',
59
60 'fullscreenToggle'
61 ]
41 } 62 }
42 } 63 }
43 videojs('video-container', videojsOptions, function () { 64 videojs('video-container', videojsOptions, function () {