aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/sass
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-12-11 10:02:17 +0100
committerChocobozzz <florian.bigard@gmail.com>2017-12-11 10:02:17 +0100
commit20206dfb0bfe1537912ae0a5b99f2fa40c881d33 (patch)
tree1b51dca6bce2d0dc1c2c667dd13af1ddc50baca1 /client/src/sass
parent9b7d1c723d7c11572d91d606954997e413f56a1f (diff)
downloadPeerTube-20206dfb0bfe1537912ae0a5b99f2fa40c881d33.tar.gz
PeerTube-20206dfb0bfe1537912ae0a5b99f2fa40c881d33.tar.zst
PeerTube-20206dfb0bfe1537912ae0a5b99f2fa40c881d33.zip
Fix loading spinner in player
Diffstat (limited to 'client/src/sass')
-rw-r--r--client/src/sass/application.scss58
-rw-r--r--client/src/sass/video-js-custom.scss14
2 files changed, 30 insertions, 42 deletions
diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss
index 6352dd4fb..9a93411e9 100644
--- a/client/src/sass/application.scss
+++ b/client/src/sass/application.scss
@@ -107,35 +107,6 @@ label {
107 font-weight: bold; 107 font-weight: bold;
108} 108}
109 109
110// On small screen, menu is absolute
111@media screen and (max-width: 800px) {
112 .title-menu-left {
113 width: 150px !important;
114 position: absolute !important;
115 z-index: 10000;
116 }
117
118 .main-col {
119 margin-left: 0;
120
121 &, &.expanded {
122 .margin-content {
123 margin-left: 10px;
124 margin-right: 10px;
125 }
126
127 .sub-menu {
128 padding-left: 10px;
129 margin-bottom: 10px;
130 }
131
132 input[type=text], input[type=password] {
133 width: 100% !important;
134 }
135 }
136 }
137}
138
139// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d 110// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
140.glyphicon-refresh-animate { 111.glyphicon-refresh-animate {
141 -animation: spin .7s infinite linear; 112 -animation: spin .7s infinite linear;
@@ -330,3 +301,32 @@ p-datatable {
330 @include peertube-button-link; 301 @include peertube-button-link;
331 @include grey-button; 302 @include grey-button;
332} 303}
304
305// On small screen, menu is absolute
306@media screen and (max-width: 800px) {
307 .title-menu-left {
308 width: 150px !important;
309 position: absolute !important;
310 z-index: 10000;
311 }
312
313 .main-col {
314 margin-left: 0;
315
316 &, &.expanded {
317 .margin-content {
318 margin-left: 10px;
319 margin-right: 10px;
320 }
321
322 .sub-menu {
323 padding-left: 10px;
324 margin-bottom: 10px;
325 }
326
327 input[type=text], input[type=password] {
328 width: 100% !important;
329 }
330 }
331 }
332}
diff --git a/client/src/sass/video-js-custom.scss b/client/src/sass/video-js-custom.scss
index 2fcfc6203..fe9495e77 100644
--- a/client/src/sass/video-js-custom.scss
+++ b/client/src/sass/video-js-custom.scss
@@ -28,10 +28,6 @@ $control-bar-height: 34px;
28 $big-play-width: 3em; 28 $big-play-width: 3em;
29 $big-play-height: 1.5em; 29 $big-play-height: 1.5em;
30 30
31 line-height: $big-play-height;
32 height: $big-play-height;
33 width: $big-play-width;
34
35 border: 0; 31 border: 0;
36 border-radius: 0.3em; 32 border-radius: 0.3em;
37 33
@@ -39,10 +35,7 @@ $control-bar-height: 34px;
39 top: 50%; 35 top: 50%;
40 margin-left: -($big-play-width / 2); 36 margin-left: -($big-play-width / 2);
41 margin-top: -($big-play-height / 2); 37 margin-top: -($big-play-height / 2);
42 } 38 background-color: transparent !important;
43
44 &:hover .vjs-big-play-button {
45 background-color: transparent;
46 } 39 }
47 40
48 .vjs-control-bar, 41 .vjs-control-bar,
@@ -321,13 +314,8 @@ $control-bar-height: 34px;
321 314
322// Thanks: https://projects.lukehaas.me/css-loaders/ 315// Thanks: https://projects.lukehaas.me/css-loaders/
323.vjs-loading-spinner { 316.vjs-loading-spinner {
324 margin: 0 !important;
325 //position: absolute;
326 // 15px is the nav bar height
327 top: calc(50% - 15px);
328 left: 50%; 317 left: 50%;
329 font-size: 10px; 318 font-size: 10px;
330 position: relative;
331 text-indent: -9999em; 319 text-indent: -9999em;
332 border: 0.7em solid rgba(255, 255, 255, 0.2); 320 border: 0.7em solid rgba(255, 255, 255, 0.2);
333 border-left-color: #ffffff; 321 border-left-color: #ffffff;