Skip to content

Commit dd16a16

Browse files
zbryiktzbryikt
committed
restrucutre files
1 parent be8f161 commit dd16a16

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

71 files changed

+3488
-12691
lines changed

‎basic.styl

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
vendors = official
2-
31
transition()
42
if index(vendors, 'ms') != null && index(vendors, 'ms') >= 0
53
-ms-transition arguments
@@ -58,7 +56,7 @@ animation-delay()
5856
if index(vendors, 'o') != null && index(vendors, 'o') >= 0
5957
-o-animation-delay arguments
6058
if index(vendors, 'official') != null && index(vendors, 'official') >= 0
61-
animation-delay arguments
59+
animation-delay: arguments
6260

6361
animation-timing-function()
6462
if index(vendors, 'ms') != null && index(vendors, 'ms') >= 0

‎build/circle/main.css

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
.lds-circle {
2+
display: inline-block;
3+
width: 51px;
4+
height: 51px;
5+
margin: 6px;
6+
border-radius: 50%;
7+
background: #900;
8+
animation: lds-circle 2.4s cubic-bezier(0, 0.2, 0.8, 1) infinite;
9+
}
10+
@keyframes lds-circle {
11+
0%, 100% {
12+
animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);
13+
}
14+
0% {
15+
transform: rotateY(0deg);
16+
}
17+
50% {
18+
transform: rotateY(1800deg);
19+
animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
20+
}
21+
100% {
22+
transform: rotateY(3600deg);
23+
}
24+
}

‎build/circle/main.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<div class="lds-circle"></div>

‎build/circle/sample.html

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<style type="text/css">
2+
.lds-circle {
3+
display: inline-block;
4+
width: 51px;
5+
height: 51px;
6+
margin: 6px;
7+
border-radius: 50%;
8+
background: #900;
9+
animation: lds-circle 2.4s cubic-bezier(0, 0.2, 0.8, 1) infinite;
10+
}
11+
@keyframes lds-circle {
12+
0%, 100% {
13+
animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);
14+
}
15+
0% {
16+
transform: rotateY(0deg);
17+
}
18+
50% {
19+
transform: rotateY(1800deg);
20+
animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
21+
}
22+
100% {
23+
transform: rotateY(3600deg);
24+
}
25+
}
26+
27+
</style>
28+
<div class="lds-circle"></div>

‎build/default/main.css

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
.lds-default {
2+
display: inline-block;
3+
position: relative;
4+
width: 64px;
5+
height: 64px;
6+
}
7+
.lds-default div {
8+
position: absolute;
9+
width: 5px;
10+
height: 5px;
11+
background: #900;
12+
border-radius: 50%;
13+
animation: lds-default 1.2s linear infinite;
14+
}
15+
.lds-default div:nth-child(1) {
16+
animation-delay: 0s;
17+
top: 29px;
18+
left: 53px;
19+
}
20+
.lds-default div:nth-child(2) {
21+
animation-delay: -0.1s;
22+
top: 18px;
23+
left: 50px;
24+
}
25+
.lds-default div:nth-child(3) {
26+
animation-delay: -0.2s;
27+
top: 9px;
28+
left: 41px;
29+
}
30+
.lds-default div:nth-child(4) {
31+
animation-delay: -0.3s;
32+
top: 6px;
33+
left: 29px;
34+
}
35+
.lds-default div:nth-child(5) {
36+
animation-delay: -0.4s;
37+
top: 9px;
38+
left: 18px;
39+
}
40+
.lds-default div:nth-child(6) {
41+
animation-delay: -0.5s;
42+
top: 18px;
43+
left: 9px;
44+
}
45+
.lds-default div:nth-child(7) {
46+
animation-delay: -0.6s;
47+
top: 29px;
48+
left: 6px;
49+
}
50+
.lds-default div:nth-child(8) {
51+
animation-delay: -0.7s;
52+
top: 41px;
53+
left: 9px;
54+
}
55+
.lds-default div:nth-child(9) {
56+
animation-delay: -0.8s;
57+
top: 50px;
58+
left: 18px;
59+
}
60+
.lds-default div:nth-child(10) {
61+
animation-delay: -0.9s;
62+
top: 53px;
63+
left: 29px;
64+
}
65+
.lds-default div:nth-child(11) {
66+
animation-delay: -1s;
67+
top: 50px;
68+
left: 41px;
69+
}
70+
.lds-default div:nth-child(12) {
71+
animation-delay: -1.1s;
72+
top: 41px;
73+
left: 50px;
74+
}
75+
@keyframes lds-default {
76+
0%, 20%, 80%, 100% {
77+
transform: scale(1);
78+
}
79+
50% {
80+
transform: scale(1.5);
81+
}
82+
}

‎build/default/main.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<div class="lds-default"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>

‎build/default/sample.html

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
<style type="text/css">
2+
.lds-default {
3+
display: inline-block;
4+
position: relative;
5+
width: 64px;
6+
height: 64px;
7+
}
8+
.lds-default div {
9+
position: absolute;
10+
width: 5px;
11+
height: 5px;
12+
background: #900;
13+
border-radius: 50%;
14+
animation: lds-default 1.2s linear infinite;
15+
}
16+
.lds-default div:nth-child(1) {
17+
animation-delay: 0s;
18+
top: 29px;
19+
left: 53px;
20+
}
21+
.lds-default div:nth-child(2) {
22+
animation-delay: -0.1s;
23+
top: 18px;
24+
left: 50px;
25+
}
26+
.lds-default div:nth-child(3) {
27+
animation-delay: -0.2s;
28+
top: 9px;
29+
left: 41px;
30+
}
31+
.lds-default div:nth-child(4) {
32+
animation-delay: -0.3s;
33+
top: 6px;
34+
left: 29px;
35+
}
36+
.lds-default div:nth-child(5) {
37+
animation-delay: -0.4s;
38+
top: 9px;
39+
left: 18px;
40+
}
41+
.lds-default div:nth-child(6) {
42+
animation-delay: -0.5s;
43+
top: 18px;
44+
left: 9px;
45+
}
46+
.lds-default div:nth-child(7) {
47+
animation-delay: -0.6s;
48+
top: 29px;
49+
left: 6px;
50+
}
51+
.lds-default div:nth-child(8) {
52+
animation-delay: -0.7s;
53+
top: 41px;
54+
left: 9px;
55+
}
56+
.lds-default div:nth-child(9) {
57+
animation-delay: -0.8s;
58+
top: 50px;
59+
left: 18px;
60+
}
61+
.lds-default div:nth-child(10) {
62+
animation-delay: -0.9s;
63+
top: 53px;
64+
left: 29px;
65+
}
66+
.lds-default div:nth-child(11) {
67+
animation-delay: -1s;
68+
top: 50px;
69+
left: 41px;
70+
}
71+
.lds-default div:nth-child(12) {
72+
animation-delay: -1.1s;
73+
top: 41px;
74+
left: 50px;
75+
}
76+
@keyframes lds-default {
77+
0%, 20%, 80%, 100% {
78+
transform: scale(1);
79+
}
80+
50% {
81+
transform: scale(1.5);
82+
}
83+
}
84+
85+
</style>
86+
<div class="lds-default"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>

‎build/dual-ring/main.css

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
.lds-dual-ring {
2+
display: inline-block;
3+
width: 64px;
4+
height: 64px;
5+
}
6+
.lds-dual-ring:after {
7+
content: " ";
8+
display: block;
9+
width: 46px;
10+
height: 46px;
11+
margin: 1px;
12+
border-radius: 50%;
13+
border: 5px solid #900;
14+
border-color: #900 transparent #900 transparent;
15+
animation: lds-dual-ring 1.2s linear infinite;
16+
}
17+
@keyframes lds-dual-ring {
18+
0% {
19+
transform: rotate(0deg);
20+
}
21+
100% {
22+
transform: rotate(360deg);
23+
}
24+
}

‎build/dual-ring/main.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<div class="lds-dual-ring"></div>

‎build/dual-ring/sample.html

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<style type="text/css">
2+
.lds-dual-ring {
3+
display: inline-block;
4+
width: 64px;
5+
height: 64px;
6+
}
7+
.lds-dual-ring:after {
8+
content: " ";
9+
display: block;
10+
width: 46px;
11+
height: 46px;
12+
margin: 1px;
13+
border-radius: 50%;
14+
border: 5px solid #900;
15+
border-color: #900 transparent #900 transparent;
16+
animation: lds-dual-ring 1.2s linear infinite;
17+
}
18+
@keyframes lds-dual-ring {
19+
0% {
20+
transform: rotate(0deg);
21+
}
22+
100% {
23+
transform: rotate(360deg);
24+
}
25+
}
26+
27+
</style>
28+
<div class="lds-dual-ring"></div>

‎build/ellipsis/main.css

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
.lds-ellipsis {
2+
display: inline-block;
3+
position: relative;
4+
width: 64px;
5+
height: 64px;
6+
}
7+
.lds-ellipsis div {
8+
position: absolute;
9+
top: 27px;
10+
width: 11px;
11+
height: 11px;
12+
border-radius: 50%;
13+
background: #900;
14+
animation-timing-function: cubic-bezier(0, 1, 1, 0);
15+
}
16+
.lds-ellipsis div:nth-child(1) {
17+
left: 6px;
18+
animation: lds-ellipsis1 0.48s infinite;
19+
}
20+
.lds-ellipsis div:nth-child(2) {
21+
left: 6px;
22+
animation: lds-ellipsis2 0.48s infinite;
23+
}
24+
.lds-ellipsis div:nth-child(3) {
25+
left: 26px;
26+
animation: lds-ellipsis2 0.48s infinite;
27+
}
28+
.lds-ellipsis div:nth-child(4) {
29+
left: 45px;
30+
animation: lds-ellipsis3 0.48s infinite;
31+
}
32+
@keyframes lds-ellipsis1 {
33+
0% {
34+
transform: scale(0);
35+
}
36+
100% {
37+
transform: scale(1);
38+
}
39+
}
40+
@keyframes lds-ellipsis3 {
41+
0% {
42+
transform: scale(1);
43+
}
44+
100% {
45+
transform: scale(0);
46+
}
47+
}
48+
@keyframes lds-ellipsis2 {
49+
0% {
50+
transform: translate(0, 0);
51+
}
52+
100% {
53+
transform: translate(19px, 0);
54+
}
55+
}

‎build/ellipsis/main.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div>

0 commit comments

Comments
 (0)