diff --git a/index.html b/index.html index 7dde93e..8ad5acb 100644 --- a/index.html +++ b/index.html @@ -1,15 +1,15 @@ - + SplatNet | Stages - - + +
- +
@@ -18,8 +18,7 @@
- Stage Info - + Stage Info
diff --git a/stages.js b/stages.js index d45bf33..cd319d8 100644 --- a/stages.js +++ b/stages.js @@ -63,7 +63,7 @@ function animateLoadingCanvas() { let currentFrame = 0; let lastUpdateTime = 0; - const frameDuration = 50; // ms per frame + const frameDuration = 50; let animationId; @@ -116,7 +116,7 @@ async function renderStages() {

Something went wrong! Try reloading the page. If this problem persists you may be ratelimited.

-`; + `; return; } @@ -144,4 +144,5 @@ async function renderStages() { } } +animateLoadingCanvas(); renderStages(); diff --git a/styles.css b/styles.css index d501591..fac166c 100644 --- a/styles.css +++ b/styles.css @@ -5,45 +5,6 @@ font-style: normal; } -.loading-overlay { - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - background-color: rgba(0,0,0,0.8); - border: 3px solid white; - border-radius: 12px; - padding: 20px 24px; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - z-index: 9999; - user-select: none; - pointer-events: none; - width: 200px; /* Updated width */ - height: 250px; /* Updated height */ - box-sizing: border-box; -} - -#loading-canvas { - image-rendering: pixelated; - /* Make sure canvas doesn't get resized by CSS */ - width: 100px; - height: 100px; - display: block; - margin: 0 auto; /* center horizontally */ -} - -#loading-text { - margin-top: 12px; - color: white; - font-family: "Splatoon1", sans-serif; - font-size: 20px; - letter-spacing: 1.2px; - text-align: center; -} - html, body { margin: 0; padding: 0; @@ -139,3 +100,41 @@ body { text-align: center; margin-top: 40px; } + +.loading-overlay { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 200px; + height: 250px; + background-color: rgba(0,0,0,0.8); + border: 3px solid white; + border-radius: 12px; + padding: 20px 24px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + z-index: 9999; + user-select: none; + pointer-events: none; + box-sizing: border-box; +} + +#loading-canvas { + image-rendering: pixelated; + width: 100px; + height: 100px; + display: block; + margin: 0 auto; +} + +#loading-text { + margin-top: 12px; + color: white; + font-family: "Splatoon1", sans-serif; + font-size: 20px; + letter-spacing: 1.2px; + text-align: center; +}