1
 2/**
 3 * Loading
 4 * --------------------------------------------------
 5 */
 6
 7.loading-container {
 8  position: absolute;
 9  left: 0;
10  top: 0;
11  right: 0;
12  bottom: 0;
13
14  z-index: $z-index-loading;
15
16  @include display-flex();
17  @include justify-content(center);
18  @include align-items(center);
19
20  @include transition(0.2s opacity linear);
21  visibility: hidden;
22  opacity: 0;
23
24  &:not(.visible) .icon,
25  &:not(.visible) .spinner{
26    display: none;
27  }
28  &.visible {
29    visibility: visible;
30  }
31  &.active {
32    opacity: 1;
33  }
34
35  .loading {
36    padding: $loading-padding;
37
38    border-radius: $loading-border-radius;
39    background-color: $loading-bg-color;
40
41    color: $loading-text-color;
42
43    text-align: center;
44    text-overflow: ellipsis;
45    font-size: $loading-font-size;
46
47    h1, h2, h3, h4, h5, h6 {
48      color: $loading-text-color;
49    }
50  }
51}