aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/sass
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/sass')
-rw-r--r--client/src/sass/video-js-custom.scss59
1 files changed, 11 insertions, 48 deletions
diff --git a/client/src/sass/video-js-custom.scss b/client/src/sass/video-js-custom.scss
index c5f668f17..6ad21988e 100644
--- a/client/src/sass/video-js-custom.scss
+++ b/client/src/sass/video-js-custom.scss
@@ -334,71 +334,34 @@ $slider-bg-color: lighten($primary-background-color, 33%);
334 334
335// Thanks: https://projects.lukehaas.me/css-loaders/ 335// Thanks: https://projects.lukehaas.me/css-loaders/
336.vjs-loading-spinner { 336.vjs-loading-spinner {
337 border: none; 337 margin: -25px 0 0 -25px;
338 opacity: 1; 338 position: absolute;
339 top: 50%;
340 left: 50%;
339 font-size: 10px; 341 font-size: 10px;
340 text-indent: -9999em;
341 width: 5em;
342 height: 5em;
343 border-radius: 50%;
344 background: #ffffff;
345 background: -moz-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
346 background: -webkit-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
347 background: -o-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
348 background: -ms-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
349 background: linear-gradient(to right, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
350 position: relative; 342 position: relative;
351 -webkit-animation: load3 1.4s infinite linear; 343 text-indent: -9999em;
352 animation: load3 1.4s infinite linear; 344 border: 0.7em solid rgba(255, 255, 255, 0.2);
353 -webkit-transform: translateZ(0); 345 border-left-color: #ffffff;
354 -ms-transform: translateZ(0);
355 transform: translateZ(0); 346 transform: translateZ(0);
347 animation: spinner 1.4s infinite linear;
356 348
357 &:before { 349 &:before {
358 width: 50%;
359 height: 50%;
360 background: #ffffff;
361 border-radius: 100% 0 0 0;
362 position: absolute;
363 top: 0;
364 left: 0;
365 content: '';
366 animation: none !important; 350 animation: none !important;
367 margin: 0 !important;
368 } 351 }
369 352
370 &:after { 353 &:after {
371 background: #000;
372 width: 75%;
373 height: 75%;
374 border-radius: 50%; 354 border-radius: 50%;
375 content: ''; 355 width: 6em;
376 margin: auto; 356 height: 6em;
377 position: absolute;
378 top: 0;
379 left: 0;
380 bottom: 0;
381 right: 0;
382 animation: none !important; 357 animation: none !important;
383 } 358 }
384 359
385 @-webkit-keyframes load3 { 360 @keyframes spinner {
386 0% {
387 -webkit-transform: rotate(0deg);
388 transform: rotate(0deg);
389 }
390 100% {
391 -webkit-transform: rotate(360deg);
392 transform: rotate(360deg);
393 }
394 }
395 @keyframes load3 {
396 0% { 361 0% {
397 -webkit-transform: rotate(0deg);
398 transform: rotate(0deg); 362 transform: rotate(0deg);
399 } 363 }
400 100% { 364 100% {
401 -webkit-transform: rotate(360deg);
402 transform: rotate(360deg); 365 transform: rotate(360deg);
403 } 366 }
404 } 367 }