|
0
|
1 // compileExpanded ../css/$1.css
|
|
|
2 @import "variables";
|
|
|
3 @import "vendors/bourbon";
|
|
|
4
|
|
|
5 /*
|
|
|
6 * Name: #{ $theme-name }
|
|
|
7 * Written by: Unifato - (http://unifato.com)
|
|
|
8 * Version: 1.0.0
|
|
|
9 */
|
|
|
10
|
|
|
11 /* Page Pre Loader
|
|
|
12 ========================*/
|
|
|
13 body {
|
|
|
14 &:after {
|
|
|
15 content: "";
|
|
|
16 @include position(fixed, 0);
|
|
|
17 z-index: 99;
|
|
|
18 background: #fff;
|
|
|
19 }
|
|
|
20 &.pace-done:after {
|
|
|
21 display: none;
|
|
|
22 }
|
|
|
23 }
|
|
|
24
|
|
|
25 .pace {
|
|
|
26 @include position(fixed, 0);
|
|
|
27 display: flex;
|
|
|
28 justify-content: center;
|
|
|
29 align-items: center;
|
|
|
30 background: #fff;
|
|
|
31 z-index: 100;
|
|
|
32 transition: all 0.3s ease;
|
|
|
33 }
|
|
|
34
|
|
|
35 .pace-active {
|
|
|
36 opacity: 1;
|
|
|
37 visibility: visible;
|
|
|
38 }
|
|
|
39 .pace-active * {
|
|
|
40 box-sizing: border-box;
|
|
|
41 }
|
|
|
42
|
|
|
43 .pace-inactive {
|
|
|
44 opacity: 0;
|
|
|
45 visibility: hidden;
|
|
|
46 }
|
|
|
47
|
|
|
48 .pace-activity {
|
|
|
49 @include position(absolute, 50% null null 50%);
|
|
|
50 transform: translateY(-50%) translateX(-50%);
|
|
|
51 width: 1em;
|
|
|
52 height: 1em;
|
|
|
53 font-size: 70px;
|
|
|
54 display:block;
|
|
|
55 }
|
|
|
56
|
|
|
57 .pace-activity::before,
|
|
|
58 .pace-activity::after {
|
|
|
59 content: "";
|
|
|
60 top: 0;
|
|
|
61 display: block;
|
|
|
62 width: 1em;
|
|
|
63 height: 1em;
|
|
|
64 position: absolute;
|
|
|
65 border-width: 0.5em;
|
|
|
66 border-style: double;
|
|
|
67 border-color: transparent;
|
|
|
68 border-radius: 1em;
|
|
|
69 box-sizing: border-box;
|
|
|
70 animation: spin 1.15s infinite;
|
|
|
71 }
|
|
|
72
|
|
|
73 .pace-activity::before {
|
|
|
74 right: 0;
|
|
|
75 border-right-color: $color-scheme;
|
|
|
76 animation-delay: -0.29s;
|
|
|
77 }
|
|
|
78
|
|
|
79 .pace-activity::after {
|
|
|
80 left: 0;
|
|
|
81 border-left-color: $color-scheme;
|
|
|
82 }
|
|
|
83
|
|
|
84 @keyframes spin {
|
|
|
85 from {
|
|
|
86 transform: rotate(360deg);
|
|
|
87 }
|
|
|
88 }
|
