60 lines
1.3 KiB
SCSS
60 lines
1.3 KiB
SCSS
@import "~theme/globals";
|
|
|
|
:host {
|
|
--loading-background: var(--ion-background-color);
|
|
--loading-spinner: var(--ion-color-primary);
|
|
--loading-text-color: var(--ion-text-color);
|
|
|
|
position: static;
|
|
@include core-transition(height, 200ms);
|
|
color: var(--loading-text-color);
|
|
|
|
ion-spinner {
|
|
--color: var(--loading-spinner);
|
|
color: var(--color);
|
|
}
|
|
|
|
> .core-loading-container {
|
|
position: absolute;
|
|
@include position(0, 0, 0, 0);
|
|
display: table;
|
|
height: 100%;
|
|
width: 100%;
|
|
text-align: center;
|
|
clear: both;
|
|
z-index: 3;
|
|
margin: 0;
|
|
padding: 10px 0 0 0;
|
|
background-color: var(--loading-background);
|
|
-webkit-transition: all 200ms ease-in-out;
|
|
transition: all 200ms ease-in-out;
|
|
|
|
.core-loading-spinner {
|
|
display: table-cell;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
|
|
.core-loading-content {
|
|
display: contents;
|
|
}
|
|
|
|
&.core-loading-noheight .core-loading-content {
|
|
height: auto;
|
|
}
|
|
|
|
&.core-loading-loaded {
|
|
position: unset;
|
|
}
|
|
|
|
&.core-loading-center {
|
|
display: block;
|
|
|
|
.core-loading-container {
|
|
padding-top: 20px;
|
|
position: relative;
|
|
}
|
|
}
|
|
}
|