]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/sass/player/spinner.scss
Move to sass module
[github/Chocobozzz/PeerTube.git] / client / src / sass / player / spinner.scss
CommitLineData
8cbc40b2
C
1@use '_variables' as *;
2@use '_mixins' as *;
2a19a1e4
C
3
4// Thanks: https://projects.lukehaas.me/css-loaders/
5.vjs-loading-spinner {
6 left: 50%;
7 font-size: 10px;
8 text-indent: -9999em;
9 border: 0.7em solid rgba(255, 255, 255, 0.2);
10 border-left-color: #ffffff;
11 transform: translateZ(0);
12 animation: 0.3s ease-out 1.1s forwards vjs-spinner-show, spinner 1.4s infinite linear !important;
13 overflow: hidden;
14 visibility: hidden;
15
16 &::before {
17 animation: none !important;
18 }
19
20 &::after {
21 border-radius: 50%;
22 width: 6em;
23 height: 6em;
24 animation: none !important;
25 }
26
27 @keyframes spinner {
28 0% {
29 transform: rotate(0deg);
30 }
31 100% {
32 transform: rotate(360deg);
33 }
34 }
35
36 @keyframes vjs-spinner-show {
37 0% {
38 display: none;
39 opacity: 0;
40 }
41
42 1% {
43 display: block;
44 visibility: visible;
45 opacity: 0;
46 }
47
48 100% {
49 display: block;
50 visibility: visible;
51 opacity: 1;
52 }
53 }
931d3430 54}