spacebar/SplatNet
spacebar/SplatNet
Watch
13
1
Fork
You've already forked SplatNet
 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

migrate previously font rendered text to use ninty images

Browse source
This commit is contained in:
kittentm 2026-02-03 04:38:47 +01:00
commit 7e5e388e6c
3 changed files with 33 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

4
stages/index.html
View file

@ -14,7 +14,9 @@
<div id="loading-overlay" class="loading-overlay">
<canvas id="loading-canvas" width="100" height="100"></canvas>
<div id="loading-text">Loading</div>
<div id="loading-text">
<img src="/assets/en/svg/text/wait/tx_loading-dccf3fb801ca859f2d17992f5cd7da62995c1fe81a306dd103398ef7c0e25b70.svg" alt="Loading">
</div>
</div>
<div class="main-wrapper">

7
stages/stages.js
View file

@ -106,7 +106,6 @@ function animateLoadingCanvas() {
};
}
//pain in the ass to implement. im proud of ts
const canvas = document.getElementById("squid-canvas");
const ctx = canvas.getContext("2d");
const frameWidth = 64;
@ -209,7 +208,7 @@ async function renderStages() {
<div class="stages-section">
<div class="mode-header">
<img class="mode-title" src="/assets/en/svg/ui/ico_stage_regular-54557ab86d0cba16cf002e6d299f87dccb41655de8a171d32928bfebda3f3692.svg" alt="Regular Battle">
<div class="mode-text">Regular Battle</div>
<div class="mode-text"><img src="/assets/en/svg/text/scene/stage/tx_regularmatch-2cee60cbe41a1594b8d5ef867138f99d843cfce6efe0c490a41632b2e99ec685.svg" alt="Regular Battle"></div>
</div>
<div class="stages">
@ -225,11 +224,11 @@ async function renderStages() {
<div class="stages-section">
<div class="mode-header">
<img class="mode-title" src="/assets/en/svg/ui/ico_stage_gachi-d2041f3d0fc360ad6c7c00dc4f5bfd1aa626a251d35af88c076b5498d8eb991d.svg" alt="Ranked Battle">
<div class="mode-text">Ranked Battle</div>
<div class="mode-text"><img src="/assets/en/svg/text/scene/stage/tx_gachimatch-08a066c73d4dcf466c435be611b996ffd7930d19d9a6a865b712cd5dd802534f.svg" alt="Ranked Battle"></div>
</div>
<div class="ranked-mode-labels">
<div class="battle-mode-text">Battle Mode</div>
<div class="battle-mode-text"><img src="/assets/en/svg/text/scene/stage/tx_rule-76cf0777fb715a9478f8b579512541f3f14ed834566e0b6e153834a57d726021.svg" alt="Battle Mode"></div>
<div class="ranked-mode-text">${rotation.ranked_mode}</div>
</div>

42
stages/styles.css
View file

@ -101,13 +101,15 @@ body {
.mode-text {
margin: 0;
text-align: left;
color: white;
font-family: "Splatoon1", sans-serif;
font-size: 44px;
letter-spacing: 1.2px;
user-select: none;
margin-left: -60px;
display: flex;
align-items: center;
}
.mode-text img {
height: 88px;
width: auto;
display: block;
}
.stages {
@ -149,11 +151,15 @@ body {
}
.battle-mode-text {
font-family: "Splatoon1", sans-serif;
color: white;
font-size: 30px;
letter-spacing: 1px;
margin-bottom: 4px;
display: flex;
justify-content: center;
}
.battle-mode-text img {
height: 70px;
width: auto;
display: block;
}
.ranked-mode-text {
@ -235,9 +241,15 @@ body {
#loading-text {
margin-top: 12px;
color: white;
font-family: "Splatoon1", sans-serif;
font-size: 20px;
letter-spacing: 1.2px;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}
#loading-text img {
height: 35px;
width: auto;
display: block;
user-select: none;
pointer-events: none;
}