From 5604bf9e761f5e94a35528a61be781b4095071cf Mon Sep 17 00:00:00 2001
From: KittenTM <aidenplayzroblox123@gmail.com>
Date: Tue, 17 Mar 2026 04:10:04 +0100
Subject: [PATCH] update loading wheel to better match actual splatnet

---
 assets/general.js      |  2 +-
 equipment/styles.css   |  7 +++----
 friend_list/styles.css | 35 +++++++++++++++++------------------
 ranking/styles.css     | 35 +++++++++++++++++------------------
 stages/styles.css      | 35 +++++++++++++++++------------------
 5 files changed, 55 insertions(+), 59 deletions(-)

diff --git a/assets/general.js b/assets/general.js
index 70528d0..03b3072 100644
--- a/assets/general.js
+++ b/assets/general.js
@@ -30,7 +30,7 @@ window.animateLoadingCanvas = function() {
                 return;
             }
             if (!lastUpdateTime) lastUpdateTime = timestamp;
-            if (timestamp - lastUpdateTime > 50) {
+            if (timestamp - lastUpdateTime > 10) {
                 ctx.clearRect(0, 0, canvas.width, canvas.height);
                 ctx.drawImage(image, 0, currentFrame * frameHeight, frameWidth, frameHeight, 0, 0, frameWidth, frameHeight);
                 currentFrame = (currentFrame + 1) % totalFrames;
diff --git a/equipment/styles.css b/equipment/styles.css
index c87af2a..a1ba4dd 100644
--- a/equipment/styles.css
+++ b/equipment/styles.css
@@ -70,10 +70,9 @@ body {
   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;
+  height: 200px;
+  background-color: rgba(0,0,0);
+  border-radius: 20px;
   padding: 20px 24px;
   display: flex;
   flex-direction: column;
diff --git a/friend_list/styles.css b/friend_list/styles.css
index 02c3358..d80a642 100644
--- a/friend_list/styles.css
+++ b/friend_list/styles.css
@@ -43,24 +43,23 @@ body {
 }
 
 .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;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 200px;
+  height: 200px;
+  background-color: rgba(0,0,0);
+  border-radius: 20px;
+  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 {
diff --git a/ranking/styles.css b/ranking/styles.css
index d56d2f3..96bc766 100644
--- a/ranking/styles.css
+++ b/ranking/styles.css
@@ -43,24 +43,23 @@ body {
 }
 
 .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;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 200px;
+  height: 200px;
+  background-color: rgba(0,0,0);
+  border-radius: 20px;
+  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 {
diff --git a/stages/styles.css b/stages/styles.css
index 259cde0..b0fec59 100644
--- a/stages/styles.css
+++ b/stages/styles.css
@@ -220,24 +220,23 @@ body {
 }
 
 .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;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 200px;
+  height: 200px;
+  background-color: rgba(0,0,0);
+  border-radius: 20px;
+  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;
 }
 
 #squid-container {