Skip to content

Commit 3505861

Browse files
committed
build local spinner file to be @plotdb/block compatible. upgrade @plotdb/block and @plotdb/csscope
1 parent fa1354b commit 3505861

File tree

22 files changed

+1719
-7
lines changed

22 files changed

+1719
-7
lines changed

build.ls

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
require! <[fs fs-extra path progress colors stylus pug uglifycss]>
22

3+
weblib = "web/static/assets/lib/@loadingio/css-spinner/dev"
4+
fs-extra.ensure-dir-sync weblib
5+
36
console.log "Build all CSS-spinners..."
47

58
progress-bar = (total = 10, text = "converting") ->
@@ -35,19 +38,18 @@ spinners.map ->
3538
fs.write-file-sync "dist/entries/#it/index.min.css", css-min
3639
fs.write-file-sync "dist/entries/#it/index.html", html
3740
fs.write-file-sync "dist/#it.html", html-css
41+
fs.write-file-sync path.join(weblib, "#it.html"), "<div>#html-css</div>"
3842
mixin-pug = src.pug.replace /^([^: ]+)([: ])/, "$1&attributes(attributes)$2"
3943
all-pug += """
4044
mixin lds-#it()
4145
#{mixin-pug.split(\\n).filter(->it).map(->" #it").join(\\n)}\n
4246
"""
4347
bar.tick!
4448
45-
weblib = "web/static/assets/lib/@loadingio/css-spinner/dev"
4649
all-css-min = uglifycss.processString(all-css, uglyComments: true)
4750
fs.write-file-sync "dist/index.css", all-css
4851
fs.write-file-sync "dist/index.min.css", all-css-min
4952
fs.write-file-sync "dist/mixin.pug", all-pug
50-
fs-extra.ensure-dir-sync weblib
5153
fs.write-file-sync path.join(weblib, "index.css"), all-css
5254
fs.write-file-sync path.join(weblib, "index.min.css"), all-css-min
5355
fs.write-file-sync path.join(weblib, "mixin.pug"), all-pug

web/.view/index.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

web/src/pug/index.ls

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<-(->it.apply {}) _
22
mgr = new block.manager {
3-
registry: ({name,version,path,type}) -> "/assets/lib/@loadingio/css-spinner/dev/entries/#name/#path"
3+
registry: ({name,version,path,type}) -> "/assets/lib/@loadingio/css-spinner/dev/#name.html"
44
}
55
mgr.init!
66
.then ~>
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<div><style type="text/css">
2+
.lds-circle,
3+
.lds-circle div {
4+
box-sizing: border-box;
5+
}
6+
.lds-circle {
7+
display: inline-block;
8+
transform: translateZ(1px);
9+
}
10+
.lds-circle > div {
11+
display: inline-block;
12+
width: 64px;
13+
height: 64px;
14+
margin: 8px;
15+
background: currentColor;
16+
border-radius: 50%;
17+
animation: lds-circle 2.4s cubic-bezier(0, 0.2, 0.8, 1) infinite;
18+
}
19+
@keyframes lds-circle {
20+
0%, 100% {
21+
animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);
22+
}
23+
0% {
24+
transform: rotateY(0deg);
25+
}
26+
50% {
27+
transform: rotateY(1800deg);
28+
animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
29+
}
30+
100% {
31+
transform: rotateY(3600deg);
32+
}
33+
}
34+
35+
</style>
36+
<div class="lds-circle"><div></div></div></div>
Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
<div><style type="text/css">
2+
.lds-default,
3+
.lds-default div {
4+
box-sizing: border-box;
5+
}
6+
.lds-default {
7+
display: inline-block;
8+
position: relative;
9+
width: 80px;
10+
height: 80px;
11+
}
12+
.lds-default div {
13+
position: absolute;
14+
width: 6.4px;
15+
height: 6.4px;
16+
background: currentColor;
17+
border-radius: 50%;
18+
animation: lds-default 1.2s linear infinite;
19+
}
20+
.lds-default div:nth-child(1) {
21+
animation-delay: 0s;
22+
top: 36.8px;
23+
left: 66.24px;
24+
}
25+
.lds-default div:nth-child(2) {
26+
animation-delay: -0.1s;
27+
top: 22.08px;
28+
left: 62.29579px;
29+
}
30+
.lds-default div:nth-child(3) {
31+
animation-delay: -0.2s;
32+
top: 11.30421px;
33+
left: 51.52px;
34+
}
35+
.lds-default div:nth-child(4) {
36+
animation-delay: -0.3s;
37+
top: 7.36px;
38+
left: 36.8px;
39+
}
40+
.lds-default div:nth-child(5) {
41+
animation-delay: -0.4s;
42+
top: 11.30421px;
43+
left: 22.08px;
44+
}
45+
.lds-default div:nth-child(6) {
46+
animation-delay: -0.5s;
47+
top: 22.08px;
48+
left: 11.30421px;
49+
}
50+
.lds-default div:nth-child(7) {
51+
animation-delay: -0.6s;
52+
top: 36.8px;
53+
left: 7.36px;
54+
}
55+
.lds-default div:nth-child(8) {
56+
animation-delay: -0.7s;
57+
top: 51.52px;
58+
left: 11.30421px;
59+
}
60+
.lds-default div:nth-child(9) {
61+
animation-delay: -0.8s;
62+
top: 62.29579px;
63+
left: 22.08px;
64+
}
65+
.lds-default div:nth-child(10) {
66+
animation-delay: -0.9s;
67+
top: 66.24px;
68+
left: 36.8px;
69+
}
70+
.lds-default div:nth-child(11) {
71+
animation-delay: -1s;
72+
top: 62.29579px;
73+
left: 51.52px;
74+
}
75+
.lds-default div:nth-child(12) {
76+
animation-delay: -1.1s;
77+
top: 51.52px;
78+
left: 62.29579px;
79+
}
80+
@keyframes lds-default {
81+
0%, 20%, 80%, 100% {
82+
transform: scale(1);
83+
}
84+
50% {
85+
transform: scale(1.5);
86+
}
87+
}
88+
89+
</style>
90+
<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></div>
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<div><style type="text/css">
2+
.lds-dual-ring,
3+
.lds-dual-ring:after {
4+
box-sizing: border-box;
5+
}
6+
.lds-dual-ring {
7+
display: inline-block;
8+
width: 80px;
9+
height: 80px;
10+
}
11+
.lds-dual-ring:after {
12+
content: " ";
13+
display: block;
14+
width: 64px;
15+
height: 64px;
16+
margin: 8px;
17+
border-radius: 50%;
18+
border: 6.4px solid currentColor;
19+
border-color: currentColor transparent currentColor transparent;
20+
animation: lds-dual-ring 1.2s linear infinite;
21+
}
22+
@keyframes lds-dual-ring {
23+
0% {
24+
transform: rotate(0deg);
25+
}
26+
100% {
27+
transform: rotate(360deg);
28+
}
29+
}
30+
31+
</style>
32+
<div class="lds-dual-ring"></div></div>
Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
<div><style type="text/css">
2+
.lds-ellipsis,
3+
.lds-ellipsis div {
4+
box-sizing: border-box;
5+
}
6+
.lds-ellipsis {
7+
display: inline-block;
8+
position: relative;
9+
width: 80px;
10+
height: 80px;
11+
}
12+
.lds-ellipsis div {
13+
position: absolute;
14+
top: 33.33333px;
15+
width: 13.33333px;
16+
height: 13.33333px;
17+
border-radius: 50%;
18+
background: currentColor;
19+
animation-timing-function: cubic-bezier(0, 1, 1, 0);
20+
}
21+
.lds-ellipsis div:nth-child(1) {
22+
left: 8px;
23+
animation: lds-ellipsis1 0.6s infinite;
24+
}
25+
.lds-ellipsis div:nth-child(2) {
26+
left: 8px;
27+
animation: lds-ellipsis2 0.6s infinite;
28+
}
29+
.lds-ellipsis div:nth-child(3) {
30+
left: 32px;
31+
animation: lds-ellipsis2 0.6s infinite;
32+
}
33+
.lds-ellipsis div:nth-child(4) {
34+
left: 56px;
35+
animation: lds-ellipsis3 0.6s infinite;
36+
}
37+
@keyframes lds-ellipsis1 {
38+
0% {
39+
transform: scale(0);
40+
}
41+
100% {
42+
transform: scale(1);
43+
}
44+
}
45+
@keyframes lds-ellipsis3 {
46+
0% {
47+
transform: scale(1);
48+
}
49+
100% {
50+
transform: scale(0);
51+
}
52+
}
53+
@keyframes lds-ellipsis2 {
54+
0% {
55+
transform: translate(0, 0);
56+
}
57+
100% {
58+
transform: translate(24px, 0);
59+
}
60+
}
61+
62+
</style>
63+
<div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div></div>
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<div><style type="text/css">
2+
.lds-facebook,
3+
.lds-facebook div {
4+
box-sizing: border-box;
5+
}
6+
.lds-facebook {
7+
display: inline-block;
8+
position: relative;
9+
width: 80px;
10+
height: 80px;
11+
}
12+
.lds-facebook div {
13+
display: inline-block;
14+
position: absolute;
15+
left: 8px;
16+
width: 16px;
17+
background: currentColor;
18+
animation: lds-facebook 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
19+
}
20+
.lds-facebook div:nth-child(1) {
21+
left: 8px;
22+
animation-delay: -0.24s;
23+
}
24+
.lds-facebook div:nth-child(2) {
25+
left: 32px;
26+
animation-delay: -0.12s;
27+
}
28+
.lds-facebook div:nth-child(3) {
29+
left: 56px;
30+
animation-delay: 0s;
31+
}
32+
@keyframes lds-facebook {
33+
0% {
34+
top: 8px;
35+
height: 64px;
36+
}
37+
50%, 100% {
38+
top: 24px;
39+
height: 32px;
40+
}
41+
}
42+
43+
</style>
44+
<div class="lds-facebook"><div></div><div></div><div></div></div></div>
Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
<div><style type="text/css">
2+
.lds-grid,
3+
.lds-grid div {
4+
box-sizing: border-box;
5+
}
6+
.lds-grid {
7+
display: inline-block;
8+
position: relative;
9+
width: 80px;
10+
height: 80px;
11+
}
12+
.lds-grid div {
13+
position: absolute;
14+
width: 16px;
15+
height: 16px;
16+
border-radius: 50%;
17+
background: currentColor;
18+
animation: lds-grid 1.2s linear infinite;
19+
}
20+
.lds-grid div:nth-child(1) {
21+
top: 8px;
22+
left: 8px;
23+
animation-delay: 0s;
24+
}
25+
.lds-grid div:nth-child(2) {
26+
top: 8px;
27+
left: 32px;
28+
animation-delay: -0.4s;
29+
}
30+
.lds-grid div:nth-child(3) {
31+
top: 8px;
32+
left: 56px;
33+
animation-delay: -0.8s;
34+
}
35+
.lds-grid div:nth-child(4) {
36+
top: 32px;
37+
left: 8px;
38+
animation-delay: -0.4s;
39+
}
40+
.lds-grid div:nth-child(5) {
41+
top: 32px;
42+
left: 32px;
43+
animation-delay: -0.8s;
44+
}
45+
.lds-grid div:nth-child(6) {
46+
top: 32px;
47+
left: 56px;
48+
animation-delay: -1.2s;
49+
}
50+
.lds-grid div:nth-child(7) {
51+
top: 56px;
52+
left: 8px;
53+
animation-delay: -0.8s;
54+
}
55+
.lds-grid div:nth-child(8) {
56+
top: 56px;
57+
left: 32px;
58+
animation-delay: -1.2s;
59+
}
60+
.lds-grid div:nth-child(9) {
61+
top: 56px;
62+
left: 56px;
63+
animation-delay: -1.6s;
64+
}
65+
@keyframes lds-grid {
66+
0%, 100% {
67+
opacity: 1;
68+
}
69+
50% {
70+
opacity: 0.5;
71+
}
72+
}
73+
74+
</style>
75+
<div class="lds-grid"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div>

0 commit comments

Comments
 (0)