aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/sass/player
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/sass/player')
-rw-r--r--client/src/sass/player/index.scss1
-rw-r--r--client/src/sass/player/offline-notification.scss22
-rw-r--r--client/src/sass/player/peertube-skin.scss17
3 files changed, 38 insertions, 2 deletions
diff --git a/client/src/sass/player/index.scss b/client/src/sass/player/index.scss
index 7420460e7..5d0307d95 100644
--- a/client/src/sass/player/index.scss
+++ b/client/src/sass/player/index.scss
@@ -9,3 +9,4 @@
9@use './bezels'; 9@use './bezels';
10@use './playlist'; 10@use './playlist';
11@use './stats'; 11@use './stats';
12@use './offline-notification';
diff --git a/client/src/sass/player/offline-notification.scss b/client/src/sass/player/offline-notification.scss
new file mode 100644
index 000000000..2108c2e30
--- /dev/null
+++ b/client/src/sass/player/offline-notification.scss
@@ -0,0 +1,22 @@
1$height: 40px;
2
3.vjs-peertube-offline-notification {
4 position: absolute;
5 top: 0;
6 left: 0;
7 right: 0;
8 height: $height;
9 color: #000;
10 background-color: var(--mainColorLightest);
11 text-align: center;
12 z-index: 1;
13 display: flex;
14 justify-content: center;
15 align-items: center;
16}
17
18.vjs-modal-dialog
19.vjs-modal-dialog-content,
20.video-js .vjs-modal-dialog {
21 top: $height;
22}
diff --git a/client/src/sass/player/peertube-skin.scss b/client/src/sass/player/peertube-skin.scss
index 43c144624..d4c43ff68 100644
--- a/client/src/sass/player/peertube-skin.scss
+++ b/client/src/sass/player/peertube-skin.scss
@@ -189,9 +189,22 @@ body {
189 } 189 }
190} 190}
191 191
192.vjs-error-display {
193 display: none;
194}
195
196.vjs-custom-error-display {
197 font-family: $main-fonts;
198
199 .error-details {
200 margin-top: 40px;
201 font-size: 80%;
202 }
203}
204
192// Error display disabled 205// Error display disabled
193.vjs-error:not(.vjs-error-display-enabled) { 206.vjs-error:not(.vjs-error-display-enabled) {
194 .vjs-error-display { 207 .vjs-custom-error-display {
195 display: none; 208 display: none;
196 } 209 }
197 210
@@ -202,7 +215,7 @@ body {
202 215
203// Error display enabled 216// Error display enabled
204.vjs-error.vjs-error-display-enabled { 217.vjs-error.vjs-error-display-enabled {
205 .vjs-error-display { 218 .vjs-custom-error-display {
206 display: block; 219 display: block;
207 } 220 }
208} 221}