diff options
Diffstat (limited to 'client/src/app/shared/misc')
-rw-r--r-- | client/src/app/shared/misc/loader.component.html | 2 | ||||
-rw-r--r-- | client/src/app/shared/misc/loader.component.scss | 14 |
2 files changed, 8 insertions, 8 deletions
diff --git a/client/src/app/shared/misc/loader.component.html b/client/src/app/shared/misc/loader.component.html index b8b7ad343..ca8ed063e 100644 --- a/client/src/app/shared/misc/loader.component.html +++ b/client/src/app/shared/misc/loader.component.html | |||
@@ -1,5 +1,5 @@ | |||
1 | <div *ngIf="loading"> | 1 | <div *ngIf="loading"> |
2 | <div class="lds-ring"> | 2 | <div class="loader"> |
3 | <div></div> | 3 | <div></div> |
4 | <div></div> | 4 | <div></div> |
5 | <div></div> | 5 | <div></div> |
diff --git a/client/src/app/shared/misc/loader.component.scss b/client/src/app/shared/misc/loader.component.scss index ddb64f07a..ffac9c707 100644 --- a/client/src/app/shared/misc/loader.component.scss +++ b/client/src/app/shared/misc/loader.component.scss | |||
@@ -3,14 +3,14 @@ | |||
3 | 3 | ||
4 | // Thanks to https://loading.io/css/ (CC0 License) | 4 | // Thanks to https://loading.io/css/ (CC0 License) |
5 | 5 | ||
6 | .lds-ring { | 6 | .loader { |
7 | display: inline-block; | 7 | display: inline-block; |
8 | position: relative; | 8 | position: relative; |
9 | width: 50px; | 9 | width: 50px; |
10 | height: 50px; | 10 | height: 50px; |
11 | } | 11 | } |
12 | 12 | ||
13 | .lds-ring div { | 13 | .loader div { |
14 | box-sizing: border-box; | 14 | box-sizing: border-box; |
15 | display: block; | 15 | display: block; |
16 | position: absolute; | 16 | position: absolute; |
@@ -19,23 +19,23 @@ | |||
19 | margin: 6px; | 19 | margin: 6px; |
20 | border: 4px solid; | 20 | border: 4px solid; |
21 | border-radius: 50%; | 21 | border-radius: 50%; |
22 | animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; | 22 | animation: loader 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; |
23 | border-color: #999999 transparent transparent transparent; | 23 | border-color: #999999 transparent transparent transparent; |
24 | } | 24 | } |
25 | 25 | ||
26 | .lds-ring div:nth-child(1) { | 26 | .loader div:nth-child(1) { |
27 | animation-delay: -0.45s; | 27 | animation-delay: -0.45s; |
28 | } | 28 | } |
29 | 29 | ||
30 | .lds-ring div:nth-child(2) { | 30 | .loader div:nth-child(2) { |
31 | animation-delay: -0.3s; | 31 | animation-delay: -0.3s; |
32 | } | 32 | } |
33 | 33 | ||
34 | .lds-ring div:nth-child(3) { | 34 | .loader div:nth-child(3) { |
35 | animation-delay: -0.15s; | 35 | animation-delay: -0.15s; |
36 | } | 36 | } |
37 | 37 | ||
38 | @keyframes lds-ring { | 38 | @keyframes loader { |
39 | 0% { | 39 | 0% { |
40 | transform: rotate(0deg); | 40 | transform: rotate(0deg); |
41 | } | 41 | } |