-
Notifications
You must be signed in to change notification settings - Fork 201
/
index.html
43 lines (42 loc) · 5.95 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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Loading...</title>
<link rel="icon" href="/favicon.ico" />
</head>
<body>
<!-- prettier-ignore -->
<div id="app">
<style>
:root { --bg-color: #fff; --fg-color: #005b9c; }
@media (prefers-color-scheme: dark) { :root { --bg-color: #000; --fg-color: #dff0fc; } }
body { padding: 2rem; background: var(--bg-color); text-align: center; }
svg { margin-top: 40vh; max-width: 500px; }
path { fill: var(--fg-color); animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; --interval: 0.1s; }
path:nth-child(1) { animation-delay: calc(var(--interval) * 0); }
path:nth-child(2) { animation-delay: calc(var(--interval) * 1); }
path:nth-child(3) { animation-delay: calc(var(--interval) * 2); }
path:nth-child(4) { animation-delay: calc(var(--interval) * 3); }
path:nth-child(5) { animation-delay: calc(var(--interval) * 4); }
path:nth-child(6) { animation-delay: calc(var(--interval) * 5); }
path:nth-child(7) { animation-delay: calc(var(--interval) * 6); }
path:nth-child(8) { animation-delay: calc(var(--interval) * 7); }
@keyframes pulse { 50% { opacity: 0.5; } }
</style>
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 1000 110">
<path d="M5,97.5L5,12.5C5,8.35786,8.35786,5,12.5,5L107.5,5C111.642,5,115,8.35786,115,12.5C115,16.6421,111.642,20,107.5,20L20,20L20,97.5C20,101.6421,16.6421,105,12.5,105C8.35786,105,5,101.6421,5,97.5ZM87.5,62.5L47.5,62.5C43.3579,62.5,40,59.1421,40,55C40,50.8579,43.3579,47.5,47.5,47.5L87.5,47.5C91.6421,47.5,95,50.8579,95,55C95,59.1421,91.6421,62.5,87.5,62.5Z" />
<path d="M128.5,5L233.5,5C237.642,5,241,8.35786,241,12.5C241,16.6421,237.642,20,233.5,20L136,20L136,90L233.5,90C237.642,90,241,93.3579,241,97.5C241,101.6421,237.642,105,233.5,105L128.5,105C124.35786,105,121,101.6421,121,97.5L121,12.5C121,8.35786,124.35786,5,128.5,5ZM213.5,47.5C217.6421,47.5,221,50.8579,221,55C221,59.1421,217.6421,62.5,213.5,62.5L163.5,62.5C159.3579,62.5,156,59.1421,156,55C156,50.8579,159.3579,47.5,163.5,47.5L213.5,47.5Z" />
<path d="M316,5C318.37170000000003,5.0125238,320.5973,6.14758,322,8.06L384.5,93.06C385.46500000000003,94.3401,385.991,95.8972,386,97.5C386,101.6421,382.642,105,378.5,105C376.128,104.9907,373.901,103.8549,372.5,101.94L310,16.939999999999998C309.0367,15.6592,308.5108,14.10259,308.5,12.5C308.5,8.35787,311.8579,5,316,5ZM313.19,60L275.56,60C273.1883,60.0125,270.9627,61.1476,269.56,63.06L247.59,92.88C246.780139,93.9405,246.253603,95.1897,246.0600001,96.51C245.408638,101.4131,249.5985,105.593,254.5,104.93C256.5816,104.6241,258.4485,103.483,259.67,101.77L279.35,75L313.5,75C317.7336,75.002,321.1298,71.5017,321,67.27000000000001C320.7647,63.1457,317.3206,59.9397,313.19,60Z" />
<path d="M392,12.5L392,97.5C392,101.6421,395.35786,105,399.5,105C403.6421,105,407,101.6421,407,97.5L407,20L483.25,20C490.84159999999997,20.005499999999998,496.994,26.1584,497,33.75C496.994,41.3416,490.84159999999997,47.4945,483.25,47.5L451.8,47.5C448.6189,47.4982,445.7827,49.5034,444.7236,52.503C443.6646,55.5026,444.613,58.8441,447.09000000000003,60.84L499.79,103.34C501.127,104.4109,502.78700000000003,104.9962,504.5,105C508.642,105,512,101.6421,512,97.5C511.997,95.2326,510.972,93.0873,509.21,91.66L473.05,62.5L483.25,62.5C499.128,62.5,512,49.6282,512,33.75C512,17.8718,499.128,5,483.25,5L399.5,5C395.35786,4.999999506219,392,8.35786,392,12.5Z" />
<path d="M620.5,90L525.5,90C521.35786,90,518,93.3579,518,97.5C518,101.6421,521.35786,105,525.5,105L620.5,105C624.642,105,628,101.6421,628,97.5C628,93.3579,624.642,90,620.5,90ZM525.5,70C529.6421,70,533,66.6421,533,62.5L533,12.5C533,8.35786,529.6421,5,525.5,5C521.35786,5,518,8.35786,518,12.5L518,62.5C518,66.6421,521.35786,70,525.5,70Z" />
<path d="M641.5,5L746.5,5C750.642,5,754,8.35786,754,12.5C754,16.6421,750.642,20,746.5,20L649,20L649,90L746.5,90C750.642,90,754,93.3579,754,97.5C754,101.6421,750.642,105,746.5,105L641.5,105C637.35786,105,634,101.6421,634,97.5L634,12.5C634,8.35786,637.35786,5,641.5,5ZM726.5,47.5C730.6421,47.5,734,50.8579,734,55C734,59.1421,730.6421,62.5,726.5,62.5L676.5,62.5C672.3579,62.5,669,59.1421,669,55C669,50.8579,672.3579,47.5,676.5,47.5L726.5,47.5Z" />
<path d="M874,12.5C874,8.35786,870.642,5,866.5,5L787.75,5C771.8718,5.00000378566,759,17.8718,759,33.75C759.00000378566,49.6282,771.8718,62.5,787.75,62.5L799,62.5C803.1421,62.5,806.5,59.1421,806.5,55C806.5,50.8579,803.1421,47.5,799,47.5L787.75,47.5C780.1584,47.4945,774.0055,41.3416,774,33.75C774.0055,26.1584,780.1584,20.005499999999998,787.75,20L866.5,20C870.642,20,874,16.6421,874,12.5ZM759,97.5C759,101.6421,762.35786,105,766.5,105L845.25,105C861.128,105,874,92.1282,874,76.25C874,60.3718,861.128,47.5,845.25,47.5L834,47.5C829.8579,47.5,826.5,50.8579,826.5,55C826.5,59.1421,829.8579,62.5,834,62.5L845.25,62.5C852.8416,62.5055,858.9945,68.6584,859,76.25C858.9945,83.8416,852.8416,89.9945,845.25,90L766.5,90C762.35786,90,759,93.3579,759,97.5Z" />
<path d="M995,12.5C995,8.35786,991.642,5,987.5,5L908.75,5C892.8718,5.00000378566,880,17.8718,880,33.75C880.00000378566,49.6282,892.8718,62.5,908.75,62.5L920,62.5C924.1421,62.5,927.5,59.1421,927.5,55C927.5,50.8579,924.1421,47.5,920,47.5L908.75,47.5C901.1584,47.4945,895.0055,41.3416,895,33.75C895.0055,26.1584,901.1584,20.005499999999998,908.75,20L987.5,20C991.642,20,995,16.6421,995,12.5ZM880,97.5C880,101.6421,883.35786,105,887.5,105L966.25,105C982.128,105,995,92.1282,995,76.25C995,60.3718,982.128,47.5,966.25,47.5L955,47.5C950.8579,47.5,947.5,50.8579,947.5,55C947.5,59.1421,950.8579,62.5,955,62.5L966.25,62.5C973.8416,62.5055,979.9945,68.6584,980,76.25C979.9945,83.8416,973.8416,89.9945,966.25,90L887.5,90C883.35786,90,880,93.3579,880,97.5Z" />
</svg>
</div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>