-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
128 lines (114 loc) · 3.78 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link data-trunk rel="copy-dir" href="/icons" />
<link data-trunk rel="copy-dir" href="/images" />
<link data-trunk rel="copy-file" href="/manifest.json" />
<link data-trunk rel="rust" data-wasm-opt="z" />
<link data-trunk rel="icon" type="image/ico" href="public/favicon.ico" />
<link data-trunk rel="tailwind-css" href="input.css" />
<link rel="manifest" href="/trader-crow-leptos/manifest.json" />
<script>
function checkResourcesLoaded() {
if (window.myWasmIsReady) {
removeElement("elementToRemove");
} else {
setTimeout(checkResourcesLoaded, 100);
}
}
function removeElement(elementId) {
var element = document.getElementById(elementId);
if (element) {
element.parentNode.removeChild(element);
}
}
document.addEventListener("DOMContentLoaded", function () {
checkResourcesLoaded();
});
</script>
</head>
<style>
.spinner {
animation: spin 2s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.rocker {
animation: rocking 2s infinite ease-in-out;
transform-style: preserve-3d;
transform-origin: center;
}
@keyframes rock {
0% {
transform: rotate(-5deg);
}
50% {
transform: rotate(5deg);
}
100% {
transform: rotate(-5deg);
}
}
@keyframes rocking {
0% {
transform: rotateY(-10deg);
}
50% {
transform: rotateY(10deg);
}
100% {
transform: rotateY(-10deg);
}
}
</style>
<body>
<div
id="elementToRemove"
class="pointer-events-none absolute inset-0 flex flex-col items-center justify-center gap-2 overflow-hidden bg-neutral-400 bg-opacity-50 dark:bg-neutral-900 dark:bg-opacity-50"
style="perspective: 600px; backdrop-filter: blur(2px)"
>
<svg
viewBox="0 0 59 59"
fill="none"
xmlns="http://www.w3.org/2000/svg"
class="spinner z-[50] flex max-h-[50vh] max-w-[320px] opacity-80"
>
<path
d="M29.5 57C44.6878 57 57 44.6878 57 29.5C57 14.3122 44.6878 2 29.5 2C14.3122 2 2 14.3122 2 29.5C2 44.6878 14.3122 57 29.5 57Z"
fill="none"
class="stroke-[#75b6e7] dark:stroke-[#75b6e7]"
stroke-width="2.0122"
stroke-miterlimit="10"
/>
<path
d="M20.3672 18.8621L26.0882 15.8511L24.5827 22.1743L35.1214 28.3094L40.8425 33.6164L40.2403 40.2408L36.0248 42.3485L35.1214 36.3264L24.2816 30.3042L19.4639 24.5832L20.3672 18.8621Z"
fill="none"
/>
<path
d="M28.9569 44.8452C31.7683 44.9192 36.2073 43.4395 36.2813 40.1102C36.5772 30.6403 19.0431 33.3777 19.413 22.4281C19.561 17.4712 25.5536 14.2899 30.5105 14.5119"
class="stroke-[#75b6e7] dark:stroke-[#75b6e7]"
stroke-width="2.0122"
stroke-miterlimit="10"
/>
<path
d="M41.2382 19.8387C38.7227 16.8794 35.8374 14.8078 31.6203 14.5119C28.8089 14.29 24.8138 15.6217 24.5179 18.9509C23.704 28.2729 42.126 26.5712 41.1642 37.5208C40.7203 42.4777 34.1357 44.9932 28.9569 44.8452C24.7398 44.6972 21.1146 42.7737 18.1553 39.5184"
class="stroke-[#75b6e7] dark:stroke-[#75b6e7]"
stroke-width="2.0122"
stroke-miterlimit="10"
/>
</svg>
<code
class="unstyled rocker flex items-center whitespace-nowrap rounded bg-surface-50 px-2 py-0.5 font-mono text-lg font-bold dark:bg-neutral-800"
>Loading...</code
>
</div>
</body>
</html>