aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--.gitignore3
-rw-r--r--.vscode/settings.json3
-rw-r--r--package.json5
-rw-r--r--src/lib/minecraft/Inventory.svelte22
-rw-r--r--src/lib/minecraft/Item.svelte21
-rw-r--r--src/lib/minecraft/inventory.ts54
-rw-r--r--src/lib/sections/Armor.svelte4
-rw-r--r--src/lib/sections/Inventories.svelte55
-rw-r--r--src/routes/about.svelte50
-rw-r--r--src/routes/index.svelte52
-rw-r--r--src/routes/player/[player]/[profile].svelte22
-rw-r--r--static/backgrounds/67.jpgbin43436 -> 16140 bytes
-rw-r--r--static/emoji/1f6b6.svg2
-rw-r--r--static/style.css855
-rw-r--r--svelte.config.js36
-rw-r--r--yarn.lock142
16 files changed, 269 insertions, 1057 deletions
diff --git a/.gitignore b/.gitignore
index 5b11e81..09319ad 100644
--- a/.gitignore
+++ b/.gitignore
@@ -8,4 +8,5 @@ node_modules
!.env.example
.vercel
.output
-.yarn \ No newline at end of file
+.yarn
+/.vercel_build_output \ No newline at end of file
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..3b61434
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+ "editor.formatOnSave": true
+} \ No newline at end of file
diff --git a/package.json b/package.json
index 3b9bcfd..d4f22e9 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,7 @@
{
"name": "skyblock-stats-svelte",
"version": "0.0.1",
+ "license": "MIT",
"scripts": {
"dev": "svelte-kit dev",
"build": "svelte-kit build",
@@ -33,8 +34,10 @@
"type": "module",
"dependencies": {
"@lukeed/uuid": "^2.0.0",
+ "@sveltejs/adapter-node": "^1.0.0-next.68",
+ "@sveltejs/adapter-vercel": "^1.0.0-next.43",
"cookie": "^0.4.1",
- "skyblock-assets": "^1.1.12"
+ "skyblock-assets": "^2.0.3"
},
"packageManager": "yarn@3.1.1"
}
diff --git a/src/lib/minecraft/Inventory.svelte b/src/lib/minecraft/Inventory.svelte
index 3d3b9c0..d29b1e0 100644
--- a/src/lib/minecraft/Inventory.svelte
+++ b/src/lib/minecraft/Inventory.svelte
@@ -4,6 +4,7 @@
export let items
export let name = ''
export let pack = ''
+ export let groupLimit = 9
if (name === 'inventory')
// in the inventory, the first 9 items are the hotbar and should be at the end
@@ -13,14 +14,14 @@
let itemGroups = []
$: {
itemGroups = []
- for (let i = 0; i < items.length; i += 9) {
- itemGroups.push(items.slice(i, i + 9))
+ for (let i = 0; i < items.length; i += groupLimit) {
+ itemGroups.push(items.slice(i, i + groupLimit))
}
}
</script>
<div class:inventory-container-{name}={name !== ''}>
- {#each itemGroups as itemGroup, groupIndex}
+ {#each itemGroups as itemGroup}
<div>
{#each itemGroup as item}
<Item {item} {pack} isslot />
@@ -28,18 +29,3 @@
</div>
{/each}
</div>
-
-<!-- {%- macro inventory(items, name='', pack='') -%}
- <div{% if name %} class="inventory-container-{{ name }}"{% endif %}>
- {%- if name == 'inventory' -%}
- {%- set items = items|slice(9)|append(items|slice(0, 9)) -%}
- {%- endif -%}
-
- {%- for itemData in items -%}
- {%- if loop.index0 > 0 and loop.index0 % 9 == 0 %}</div>{%- endif -%}
- {%- if loop.index0 % 9 == 0 %}<div>{%- endif -%}
- {{- item(itemData, slot=true, pack=pack) -}}
- {%- endfor -%}
- </div>
- </div>
-{%- endmacro -%} -->
diff --git a/src/lib/minecraft/Item.svelte b/src/lib/minecraft/Item.svelte
index 8ddc4a8..c944f1b 100644
--- a/src/lib/minecraft/Item.svelte
+++ b/src/lib/minecraft/Item.svelte
@@ -1,22 +1,26 @@
<script lang="ts">
import MinecraftTooltip from './MinecraftTooltip.svelte'
import { formattingCodeToHtml, removeFormattingCode } from '$lib/utils'
- import { itemToUrlCached } from './inventory'
+ import { itemToUrl } from './inventory'
export let item: any | null
export let isslot = true
export let pack = ''
- $: itemLoreHtml = item.display.lore.map(l => formattingCodeToHtml(l)).join('<br>')
- $: itemNameHtml = formattingCodeToHtml(item.display.name)
+ let itemLoreHtml: string | null
+ let itemNameHtml: string | null
+ let imageUrl: string | null
- $: imageUrl = itemToUrlCached(item, pack)
+ $: itemLoreHtml = item ? item.display.lore.map(l => formattingCodeToHtml(l)).join('<br>') : null
+ $: itemNameHtml = item ? formattingCodeToHtml(item.display.name) : null
+
+ $: imageUrl = item ? itemToUrl(item, pack) : null
</script>
<MinecraftTooltip>
<span slot="name">{@html itemNameHtml}</span>
<span slot="lore">{@html itemLoreHtml}</span>
- <span class="item item-slot" class:item-slot={isslot}>
+ <span class="item" class:item-slot={isslot}>
<!-- we have an if here because the item might be air -->
{#if item}
{#if imageUrl}
@@ -60,6 +64,13 @@
image-rendering: pixelated;
}
+ img.item-custom-head {
+ width: 0.75em;
+ height: 0.75em;
+ margin-top: 0.1875em;
+ margin-left: 0.1875em;
+ }
+
.item-slot {
margin: 0.05em;
}
diff --git a/src/lib/minecraft/inventory.ts b/src/lib/minecraft/inventory.ts
index fa75887..cb926b4 100644
--- a/src/lib/minecraft/inventory.ts
+++ b/src/lib/minecraft/inventory.ts
@@ -1,7 +1,7 @@
-import vanillaDamages from 'skyblock-assets/data/vanilla_damages.json'
import * as skyblockAssets from 'skyblock-assets'
+import vanilla from 'skyblock-assets/matchers/vanilla.json'
+import packshq from 'skyblock-assets/matchers/vanilla.json'
-const itemToUrlCache: Record<string, string> = {}
interface Item {
id?: string
@@ -36,10 +36,7 @@ const INVENTORIES = {
export type Inventories = { [name in keyof typeof INVENTORIES]: Item[] }
-export async function itemToUrl(item: Item, packName?: string): Promise<string> {
- const stringifiedItem = (packName ?? 'packshq') + JSON.stringify(item)
- if (stringifiedItem in itemToUrlCache)
- return itemToUrlCache[stringifiedItem]
+export function itemToUrl(item: Item, packName?: string): string {
const itemNbt: skyblockAssets.NBT = {
display: {
Name: item.display?.name
@@ -52,21 +49,22 @@ export async function itemToUrl(item: Item, packName?: string): Promise<string>
if (item.head_texture)
textureUrl = `https://mc-heads.net/head/${item.head_texture}`
else
- textureUrl = await skyblockAssets.getTextureUrl({
+ textureUrl = skyblockAssets.getTextureUrl({
id: item.vanillaId,
nbt: itemNbt,
- pack: packName ?? 'packshq'
+ packs: [packshq, vanilla]
})
if (!textureUrl)
console.log('no texture', item)
- itemToUrlCache[stringifiedItem] = textureUrl
return textureUrl
}
+
export async function skyblockItemToUrl(skyblockItemName: string) {
const item = skyblockItemNameToItem(skyblockItemName)
const itemTextureUrl = await itemToUrl(item, 'packshq')
return itemTextureUrl
}
+
export function skyblockItemNameToItem(skyblockItemName: string): Item {
let item: Item
if (Object.keys(skyblockItems).includes(skyblockItemName)) {
@@ -78,6 +76,7 @@ export function skyblockItemNameToItem(skyblockItemName: string): Item {
}
return item
}
+
const skyblockItems: { [itemName: string]: Item } = {
ink_sac: { vanillaId: 'minecraft:dye' },
cocoa_beans: { vanillaId: 'minecraft:dye:3' },
@@ -102,41 +101,4 @@ const skyblockItems: { [itemName: string]: Item } = {
head_texture: '39b6e047d3b2bca85e8cc49e5480f9774d8a0eafe6dfa9559530590283715142'
},
hard_stone: { vanillaId: 'minecraft:stone' },
-}
-
-export function itemToUrlCached(item: Item, packName?: string): string {
- if (!item) return null
- if (typeof item === 'string') {
- let itemId: string = vanillaDamages[item] ?? item
- let damage: number = null
- // remove the minecraft: namespace since we already know it's all vanilla
- if (itemId.startsWith('minecraft:')) itemId = itemId.slice('minecraft:'.length)
- // split the damage into its own variable
- if (itemId.includes(':')) {
- damage = parseInt(itemId.split(':')[1])
- itemId = itemId.split(':')[0]
- }
- item = {
- count: 1,
- display: {
- glint: false,
- lore: null,
- name: null
- },
- id: null,
- // vanillaId: damage === null ? `minecraft:${itemId}` : `minecraft:${itemId}:${damage}`
- vanillaId: `minecraft:${itemId}`
- }
- }
- const stringifiedItem = (packName ?? 'packshq') + JSON.stringify(item)
- return itemToUrlCache[stringifiedItem]
-}
-/** Get all the items in an inventories object to cache them */
-export async function cacheInventories(inventories: Inventories, packName?: string) {
- const promises: Promise<any>[] = []
- for (const inventoryItems of Object.values(inventories ?? {}))
- for (const inventoryItem of inventoryItems)
- if (inventoryItem)
- promises.push(itemToUrl(inventoryItem, packName))
- await Promise.all(promises)
} \ No newline at end of file
diff --git a/src/lib/sections/Armor.svelte b/src/lib/sections/Armor.svelte
index c4e7950..ab0e73b 100644
--- a/src/lib/sections/Armor.svelte
+++ b/src/lib/sections/Armor.svelte
@@ -4,4 +4,6 @@
export let pack
</script>
-<Inventory items={data.member.inventories.armor} name="armor" {pack} />
+<span>
+ <Inventory items={data.member.inventories.armor} name="armor" groupLimit={1} {pack} />
+</span>
diff --git a/src/lib/sections/Inventories.svelte b/src/lib/sections/Inventories.svelte
new file mode 100644
index 0000000..49a00c2
--- /dev/null
+++ b/src/lib/sections/Inventories.svelte
@@ -0,0 +1,55 @@
+<script lang="ts">
+ import Inventory from '$lib/minecraft/Inventory.svelte'
+ import { fade } from 'svelte/transition'
+ import { cleanId } from '$lib/utils'
+
+ export let data
+ export let pack
+
+ let displayingInventories: string[] = []
+ for (const inventoryName in data.member.inventories)
+ if (inventoryName !== 'armor') displayingInventories.push(inventoryName)
+
+ let selectedInventoryName: string = displayingInventories[0]
+</script>
+
+<div id="inventory-tabs">
+ {#each displayingInventories as inventoryName}
+ <button
+ class="inventory-tab"
+ class:inventory-tab-active={inventoryName === selectedInventoryName}
+ on:click={() => (selectedInventoryName = inventoryName)}
+ >
+ {cleanId(inventoryName)}
+ </button>
+ {/each}
+</div>
+{#each displayingInventories as inventoryName}
+ {#if inventoryName === selectedInventoryName}
+ <div id={inventoryName} class="inventory-content">
+ <Inventory items={data.member.inventories[inventoryName]} {pack} />
+ </div>
+ {/if}
+{/each}
+
+<style>
+ #inventory-tabs {
+ margin-bottom: 1em;
+ overflow: hidden;
+ border-radius: 1em;
+ max-width: max-content;
+ width: min(40em, 100%);
+ }
+ .inventory-tab {
+ background-color: var(--theme-lighter-background);
+ color: var(--theme-main-text);
+ border: none;
+ padding: 1em;
+ cursor: pointer;
+ transition-duration: 200ms;
+ }
+ .inventory-tab:hover,
+ .inventory-tab-active {
+ background-color: var(--theme-lightest-background);
+ }
+</style>
diff --git a/src/routes/about.svelte b/src/routes/about.svelte
deleted file mode 100644
index 569d3e1..0000000
--- a/src/routes/about.svelte
+++ /dev/null
@@ -1,50 +0,0 @@
-<script context="module">
- import { browser, dev } from '$app/env';
-
- // we don't need any JS on this page, though we'll load
- // it in dev so that we get hot module replacement...
- export const hydrate = dev;
-
- // ...but if the client-side router is already loaded
- // (i.e. we came here from elsewhere in the app), use it
- export const router = browser;
-
- // since there's no dynamic data here, we can prerender
- // it so that it gets served as a static asset in prod
- export const prerender = true;
-</script>
-
-<svelte:head>
- <title>About</title>
-</svelte:head>
-
-<div class="content">
- <h1>About this app</h1>
-
- <p>
- This is a <a href="https://kit.svelte.dev">SvelteKit</a> app. You can make your own by typing the
- following into your command line and following the prompts:
- </p>
-
- <!-- TODO lose the @next! -->
- <pre>npm init svelte@next</pre>
-
- <p>
- The page you're looking at is purely static HTML, with no client-side interactivity needed.
- Because of that, we don't need to load any JavaScript. Try viewing the page's source, or opening
- the devtools network panel and reloading.
- </p>
-
- <p>
- The <a href="/todos">TODOs</a> page illustrates SvelteKit's data loading and form handling. Try using
- it with JavaScript disabled!
- </p>
-</div>
-
-<style>
- .content {
- width: 100%;
- max-width: var(--column-width);
- margin: var(--column-margin-top) auto 0 auto;
- }
-</style>
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 68311dd..524df13 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -1,9 +1,5 @@
<script context="module" lang="ts">
- export const prerender = true;
-</script>
-
-<script lang="ts">
- import Counter from '$lib/Counter.svelte';
+ export const prerender = true
</script>
<svelte:head>
@@ -11,49 +7,5 @@
</svelte:head>
<section>
- <h1>
- <div class="welcome">
- <picture>
- <source srcset="svelte-welcome.webp" type="image/webp" />
- <img src="svelte-welcome.png" alt="Welcome" />
- </picture>
- </div>
-
- to your new<br />SvelteKit app
- </h1>
-
- <h2>
- try editing <strong>src/routes/index.svelte</strong>
- </h2>
-
- <Counter />
+ <h1>SkyBlock Stats</h1>
</section>
-
-<style>
- section {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- flex: 1;
- }
-
- h1 {
- width: 100%;
- }
-
- .welcome {
- position: relative;
- width: 100%;
- height: 0;
- padding: 0 0 calc(100% * 495 / 2048) 0;
- }
-
- .welcome img {
- position: absolute;
- width: 100%;
- height: 100%;
- top: 0;
- display: block;
- }
-</style>
diff --git a/src/routes/player/[player]/[profile].svelte b/src/routes/player/[player]/[profile].svelte
index bd9402d..e28dae7 100644
--- a/src/routes/player/[player]/[profile].svelte
+++ b/src/routes/player/[player]/[profile].svelte
@@ -1,5 +1,4 @@
<script lang="ts" context="module">
- import { cacheInventories } from '$lib/minecraft/inventory'
import type { Load } from '@sveltejs/kit'
import { API_URL } from '$lib/api'
@@ -12,8 +11,6 @@
const pack = params.pack ?? data?.customization?.pack
- await cacheInventories(data.member.inventories, pack)
-
return {
props: {
data,
@@ -24,16 +21,16 @@
</script>
<script lang="ts">
+ import Inventories from '$lib/sections/Inventories.svelte'
import Username from '$lib/minecraft/Username.svelte'
import Infobox from '$lib/sections/Infobox.svelte'
+ import Skills from '$lib/sections/Skills.svelte'
import { generateInfobox } from '$lib/profile'
+ import Armor from '$lib/sections/Armor.svelte'
import Header from '$lib/Header.svelte'
import Emoji from '$lib/Emoji.svelte'
- import { cleanId } from '$lib/utils'
import Head from '$lib/Head.svelte'
import Toc from '$lib/Toc.svelte'
- import Skills from '$lib/sections/Skills.svelte'
- import Armor from '$lib/sections/Armor.svelte'
export let data
export let pack: string
@@ -98,13 +95,14 @@
<Armor {data} {pack} />
</section>
{/if}
- <!-- {%- if data.member.inventories.armor -%}
- <section id="armor"{% if data.member.inventories.inventory %} class="armor-float"{% endif %}>
- <h2>Armor</h2>
- {%- include 'sections/armor.njk' -%}
+ {#if data.member.inventories.inventory}
+ <section id="inventories">
+ <h2>Inventories</h2>
+ <Inventories {data} {pack} />
</section>
- {%- endif -%}
- {%- if data.member.inventories.inventory -%}
+ {/if}
+
+ <!-- {%- if data.member.inventories.inventory -%}
<section id="inventories">
<h2>Inventories</h2>
{%- include 'sections/inventories.njk' -%}
diff --git a/static/backgrounds/67.jpg b/static/backgrounds/67.jpg
index 4e23623..628256a 100644
--- a/static/backgrounds/67.jpg
+++ b/static/backgrounds/67.jpg
Binary files differ
diff --git a/static/emoji/1f6b6.svg b/static/emoji/1f6b6.svg
index 124c296..758c068 100644
--- a/static/emoji/1f6b6.svg
+++ b/static/emoji/1f6b6.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><path fill="#292F33" d="M18.011 34.975l-.052.016c.018-.068.042-.19.042-.383 0-.303-.156-.869-.199-.95s-.09-.139-.194-.11c-.079.022-.685.326-1.072.341-.719.027-1.066-.618-1.066-.618s-.399.228-.716.413c-.318.185-.687.462-.959.627-.232.141-.497.208-.771.243s-.497.023-.563.029c-.066.006-.621-.061-.641.488l.003.127-.054-.026s-.048.17-.052.202c-.004.033-.024.052.046.096.07.044.378.176.77.274s1.028.243 1.519.243.909-.098 1.151-.156c.243-.058.763-.169.813-.146.05.023.116.191.173.243.058.052 1.61-.081 1.721-.104.112-.023.146-.119.146-.162v-.649c.002-.027-.021-.045-.045-.038zm10.947-3.752l-.504-.429c-.019-.016-.048-.011-.059.012l-.022.051c-.041-.059-.12-.158-.269-.285-.235-.2-.777-.454-.868-.473-.091-.02-.167-.022-.213.077-.035.076-.199.746-.444 1.056-.454.575-1.184.418-1.184.418l-.153.828c-.067.368-.096.838-.148 1.158-.044.273-.167.523-.322.758-.154.236-.31.4-.35.456-.039.055-.457.441-.045.82l.101.081-.055.025s.1.149.122.174c.022.025.025.053.104.028s.386-.177.721-.416c.336-.24.868-.637 1.192-1.018.325-.381.524-.77.64-.996.116-.226.373-.703.424-.727.051-.024.224.036.303.026.078-.01 1.001-1.302 1.057-1.403s.005-.193-.028-.221z"/><path fill="#F9CA55" d="M19.3 12.243c.927.96 3.062 2.89 3.109 3.121.251 1.223.614 2.606.52 3.454-.068.615.376 1.298.551 1.583.218.354.781.898 1.141.86.224-.023.567-.43.384-.636-.357-.4-.298-1.009-.522-1.559-.449-1.105-.045-3.194-.661-4.563-.256-.567-.733-1.693-2.824-3.626-.511.462-1.698 1.366-1.698 1.366z"/><path fill="#2A6797" d="M16.062 34.203c-1.266.109-1.853-.233-1.721-.416.165-.228.128-.397.13-.536C14.499 30.81 14 27.26 14 27.26c0-.348.003-.813.312-1.562.778-1.883 3.951-7.69 3.951-7.69.548-.958 1.771-1.293 2.729-.744.959.548 1.122 1.405.744 2.729-.715 2.508-2.965 5.602-3.903 7.477.224 2.121-.174 3.853.035 5.857.03.288-.54.767-1.806.876z"/><path fill="#4289C1" d="M26.797 31.931c-.364.553-.97.942-1.598.838-1.269-1.924-4.955-5.321-4.955-5.321-.241-.25-.562-.587-.86-1.341-.748-1.895-2.498-8.277-2.498-8.277-.272-1.07.376-2.16 1.446-2.43 1.07-.272 1.783.232 2.43 1.446 1.227 2.301 1.757 6.09 2.384 8.09 1.87 1.568 2.383 3.603 4.275 5.151-.065.857-.26 1.291-.624 1.844z"/><path fill="#FFDC5D" d="M18.604 1.418c-1.616-.481-3.893.53-4.11 2.372-.303 2.57 1.323 4.585 2.901 4.276 1.654-.324 2.648-.782 3.177-2.559.528-1.777-.352-3.608-1.968-4.089z"/><path fill="#FFDC5D" d="M20.165 5.988c2.045-2.867-3.411-2.136-3.411-2.136-1.034.127-.172 1.793-.579 2.778-.279.682 1.16.907 1.16.907s.646-.065.748.716l.001.007c.025.199.024.438-.042.763-.329 1.61 1.862 2.392 2.19.779.13-.638.012-1.18-.124-1.677l-.013-.045c-.205-.74-.435-1.383.07-2.092z"/><path fill="#FFAC33" d="M20.616 1.791c-.861-.977-3.527-1.676-5.056-.215-1.154-.1-1.497 1.019-1.347 1.633.12.49 1.352.514 1.739 1.431.193-.255.207-.744.139-.999.421.341.336 1.339 1.92 1.85 1.532.494 1.382 1.822 1.382 1.822s.747-.435 1.235-1.109c.934-1.286.937-3.336-.012-4.413z"/><path fill="#FA743E" d="M23 20s0 1-2 1h-4.898c1-4.578-.094-5.84.241-8.581.361-2.954 2.287-4.771 3.475-4.34 1.822.661 2.693 2.641 2.932 5.858S23 20 23 20z"/><path fill="#FFDC5D" d="M17.75 11.792c-.167 1.399-.322 4.433-.479 4.625-.833 1.021-1.722 2.24-2.479 2.729-.549.354-.811 1.174-.927 1.507-.144.414-.213 1.238.057 1.507.169.168.73.177.776-.11.09-.559.626-.917.927-1.467.604-1.104 2.583-2.167 3.292-3.584.294-.588.896-1.729 1.083-4.729-.72-.11-2.25-.478-2.25-.478z"/></svg> \ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><path fill="#292f33" d="M18.011 34.975l-.052.016c.018-.068.042-.19.042-.383a3.51 3.51 0 0 0-.199-.95c-.043-.081-.09-.139-.194-.11-.079.022-.685.326-1.072.341-.719.027-1.066-.618-1.066-.618l-.716.413c-.318.185-.687.462-.959.627-.232.141-.497.208-.771.243s-.497.023-.563.029-.621-.061-.641.488l.003.127-.054-.026-.052.202c-.004.033-.024.052.046.096s.378.176.77.274 1.028.243 1.519.243.909-.098 1.151-.156.763-.169.813-.146.116.191.173.243 1.61-.081 1.721-.104.146-.119.146-.162v-.649c.002-.027-.021-.045-.045-.038zm10.947-3.752l-.504-.429c-.019-.016-.048-.011-.059.012l-.022.051c-.041-.059-.12-.158-.269-.285-.235-.2-.777-.454-.868-.473s-.167-.022-.213.077c-.035.076-.199.746-.444 1.056-.454.575-1.184.418-1.184.418l-.153.828c-.067.368-.096.838-.148 1.158-.044.273-.167.523-.322.758s-.31.4-.35.456-.457.441-.045.82l.101.081-.055.025.122.174c.022.025.025.053.104.028s.386-.177.721-.416.868-.637 1.192-1.018.524-.77.64-.996.373-.703.424-.727.224.036.303.026 1.001-1.302 1.057-1.403.005-.193-.028-.221z"/><path fill="#f9ca55" d="M19.3 12.243l3.109 3.121c.251 1.223.614 2.606.52 3.454-.068.615.376 1.298.551 1.583.218.354.781.898 1.141.86.224-.023.567-.43.384-.636-.357-.4-.298-1.009-.522-1.559-.449-1.105-.045-3.194-.661-4.563-.256-.567-.733-1.693-2.824-3.626-.511.462-1.698 1.366-1.698 1.366z"/><path fill="#2a6797" d="M16.062 34.203c-1.266.109-1.853-.233-1.721-.416.165-.228.128-.397.13-.536C14.499 30.81 14 27.26 14 27.26a3.64 3.64 0 0 1 .312-1.562c.778-1.883 3.951-7.69 3.951-7.69a2 2 0 0 1 2.729-.744c.959.548 1.122 1.405.744 2.729-.715 2.508-2.965 5.602-3.903 7.477.224 2.121-.174 3.853.035 5.857.03.288-.54.767-1.806.876z"/><path fill="#4289c1" d="M26.797 31.931c-.364.553-.97.942-1.598.838-1.269-1.924-4.955-5.321-4.955-5.321-.241-.25-.562-.587-.86-1.341-.748-1.895-2.498-8.277-2.498-8.277a2 2 0 0 1 1.446-2.43c1.07-.272 1.783.232 2.43 1.446 1.227 2.301 1.757 6.09 2.384 8.09 1.87 1.568 2.383 3.603 4.275 5.151-.065.857-.26 1.291-.624 1.844z"/><g fill="#ffdc5d"><path d="M18.604 1.418c-1.616-.481-3.893.53-4.11 2.372-.303 2.57 1.323 4.585 2.901 4.276 1.654-.324 2.648-.782 3.177-2.559s-.352-3.608-1.968-4.089z"/><path d="M20.165 5.988c2.045-2.867-3.411-2.136-3.411-2.136-1.034.127-.172 1.793-.579 2.778-.279.682 1.16.907 1.16.907s.646-.065.748.716l.001.007c.025.199.024.438-.042.763-.329 1.61 1.862 2.392 2.19.779.13-.638.012-1.18-.124-1.677l-.013-.045c-.205-.74-.435-1.383.07-2.092z"/></g><path fill="#ffac33" d="M20.616 1.791c-.861-.977-3.527-1.676-5.056-.215-1.154-.1-1.497 1.019-1.347 1.633.12.49 1.352.514 1.739 1.431.193-.255.207-.744.139-.999.421.341.336 1.339 1.92 1.85 1.532.494 1.382 1.822 1.382 1.822s.747-.435 1.235-1.109c.934-1.286.937-3.336-.012-4.413z"/><path fill="#fa743e" d="M23 20s0 1-2 1h-4.898c1-4.578-.094-5.84.241-8.581.361-2.954 2.287-4.771 3.475-4.34 1.822.661 2.693 2.641 2.932 5.858L23 20z"/><path fill="#ffdc5d" d="M17.75 11.792l-.479 4.625c-.833 1.021-1.722 2.24-2.479 2.729-.549.354-.811 1.174-.927 1.507-.144.414-.213 1.238.057 1.507.169.168.73.177.776-.11.09-.559.626-.917.927-1.467.604-1.104 2.583-2.167 3.292-3.584.294-.588.896-1.729 1.083-4.729-.72-.11-2.25-.478-2.25-.478z"/></svg> \ No newline at end of file
diff --git a/static/style.css b/static/style.css
deleted file mode 100644
index 42a44fa..0000000
--- a/static/style.css
+++ /dev/null
@@ -1,855 +0,0 @@
-:root {
- --theme-main-background: #111;
- --theme-lighter-background: #222;
- --theme-lightest-background: #333;
-
- --theme-main-text: #eee;
- --theme-darker-text: #999;
- --theme-transparent-border: rgba(128,128,128,.3);
-
- --theme-yellow: #ff0;
-}
-
-/* minecraft font */
-@font-face {
- font-family: Minecraft;
- src: url(https://cdn.matdoes.dev/fonts/Minecraft.ttf);
- font-display: swap;
-}
-
-/* latin-ext */
-@font-face {
- font-family: 'Atkinson Hyperlegible';
- font-style: italic;
- font-weight: 400;
- font-display: swap;
- src: url(https://cdn.matdoes.dev/fonts/atkinson-hyperlegible/latin-ext-italic.woff2) format('woff2');
- unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
- font-family: 'Atkinson Hyperlegible';
- font-style: italic;
- font-weight: 400;
- font-display: swap;
- src: url(https://cdn.matdoes.dev/fonts/atkinson-hyperlegible/latin-italic.woff2) format('woff2');
- unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* latin-ext */
-@font-face {
- font-family: 'Atkinson Hyperlegible';
- font-style: italic;
- font-weight: 700;
- font-display: swap;
- src: url(https://cdn.matdoes.dev/fonts/atkinson-hyperlegible/latin-ext-italic-bold.woff2) format('woff2');
- unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
- font-family: 'Atkinson Hyperlegible';
- font-style: italic;
- font-weight: 700;
- font-display: swap;
- src: url(https://cdn.matdoes.dev/fonts/atkinson-hyperlegible/latin-italic-bold.woff2) format('woff2');
- unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
- }
-/* latin-ext */
-@font-face {
- font-family: 'Atkinson Hyperlegible';
- font-style: normal;
- font-weight: 400;
- font-display: swap;
- src: url(https://cdn.matdoes.dev/fonts/atkinson-hyperlegible/latin-ext-italic-bold.woff2) format('woff2');
- unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
- }
-/* latin */
-@font-face {
- font-family: 'Atkinson Hyperlegible';
- font-style: normal;
- font-weight: 400;
- font-display: swap;
- src: url(https://cdn.matdoes.dev/fonts/atkinson-hyperlegible/latin.woff2) format('woff2');
- unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* latin-ext */
-@font-face {
- font-family: 'Atkinson Hyperlegible';
- font-style: normal;
- font-weight: 700;
- font-display: swap;
- src: url(https://cdn.matdoes.dev/fonts/atkinson-hyperlegible/latin-ext-bold.woff2) format('woff2');
- unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
- font-family: 'Atkinson Hyperlegible';
- font-style: normal;
- font-weight: 700;
- font-display: swap;
- src: url(https://cdn.matdoes.dev/fonts/atkinson-hyperlegible/latin-bold.woff2) format('woff2');
- unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-
-
-
-body {
- font-family: Twemoji, 'Atkinson Hyperlegible', sans-serif;
- color: var(--theme-main-text);
- background-color: var(--theme-main-background);
- margin: 0;
- overflow-x: hidden;
-}
-html {
- scroll-behavior: smooth
-}
-
-/* content is uglier when its max width */
-main {
- margin: 0 auto;
- width: 80%;
- padding: 1em;
-}
-
-.member-container {
- position: relative
-}
-
-/* makes random height and stuff look less broken */
-* {
- box-sizing: border-box;
- vertical-align: baseline;
-}
-
-/* base styles for inputs */
-input[type=text], input[type=submit] {
- -webkit-appearance: none;
- background-color: transparent;
- color: var(--theme-darker-text);
- transition-duration: 250ms;
- border: 1px solid var(--theme-transparent-border);
- border-radius: 4px;
- margin: 0;
- height: 2em;
- font-size: 1em;
-}
-
-/* base styles for text input boxes */
-input[type=text] {
- text-align: left;
- padding-left: .5em
-}
-/* Selecting a text box */
-input[type=text]:focus {
- /* make the text lighter */
- color: var(--theme-main-text)
-}
-
-
-/* base styles for buttons */
-input[type=submit] {
- margin-left: .2em;
- cursor: pointer;
-}
-/* Hovering over a button */
-input[type=submit]:hover {
- /* make the text lighter */
- color: var(--theme-main-text)
-}
-
-/* base styles for anchor tags */
-a {
- color: #19f;
- text-decoration: none;
-}
-
-
-h1 {
- font-size: 2.5em;
- overflow-wrap: anywhere
-}
-h2, h3 {
- margin-top: 0;
- margin-bottom: .2em
-}
-hr {
- opacity: .2
-}
-button {
- outline: none;
- font-family: inherit
-}
-
-
-.enter-username-button, .view-profiles-button {
- /* add a slight shadow on the form in the index page */
- box-shadow: 0 0 1em #000;
-}
-.enter-username-button {
- max-width: calc(90vw - 8em);
-}
-
-/* the main "SkyBlock stats" title */
-#main-title {
- text-align: center;
- font-size: calc(2em + 1vw);
- margin-top: 0;
- /*! top: 1em; */
- /*! position: relative; */
- padding-top: .5em;
-}
-
-/* the main "enter username" form */
-.user-form {
- text-align: center;
- font-size: 1.25rem;
-
- /* center the forms */
- margin: 0 auto;
- width: max-content;
-}
-
-.username {
- /* usernames have the minecraft font */
- font-family: Minecraft, sans-serif;
- /* rreduce the size of the text because the font is too big */
- font-size: .8em;
- overflow-wrap: anywhere
-}
-
-.emoji {
- position: relative;
- height: 1em;
- vertical-align: text-bottom;
- bottom: .1em
-}
-
-.username-rank-prefix {
- font-family: Minecraft, sans-serif;
- font-size: .8em;
- overflow-wrap: anywhere
-}
-
-.profile-name {
- margin-right: .5em
-}
-
-.profile-members {
- color: var(--theme-main-text)
-}
-.profile-members .username {
- margin-right: .35em;
-}
-
-.profile-list, .leaderboard-profile-list {
- font-size: 1.5em;
-}
-
-.profile-list-item {
- margin-bottom: .5em;
- color: var(--theme-darker-text)
-}
-.profile-list-item-active {
- color: #fff
-}
-.profile-list-item-online {
- color: #0e0
-}
-
-.head {
- user-select: none
-}
-
-.head2d {
- /* pixelated rendering on 2d heads */
- image-rendering: crisp-edges;
- image-rendering: pixelated;
- /* make the head centered correctly */
- position: relative;
- top: .1em;
- /* same size as font */
- height: 1em;
- width: 1em;
-}
-
-.head3d {
- /* make the head centered correctly */
- position: relative;
- top: .2em;
- /* same size as font */
- height: 1em;
- width: 1em;
-}
-
-.userHead {
- /* make the head not be touching the username */
- margin-right: .2em;
-}
-
-/* add a collapsible svg arrow */
-.collapseArrow {
- background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj48cGF0aCBkPSJNMTcuNSA0Ljc1bC03LjUgNy41LTcuNS03LjVMMSA2LjI1bDkgOSA5LTl6IiBmaWxsPSIjYWFhIi8+IDwvc3ZnPg==);
- width: 20px;
- height: 20px;
- display: inline-block;
- margin-right: 1em;
- /* transition-duration: 100ms */
-}
-
-.collapsePart:not(.collapsed) .collapseArrow {
- transform: rotate(-180deg)
-}
-
-.sectionTitle {
- display: inline-block;
- margin: 0;
- text-shadow: 0 0 .5em #000;
-}
-
-/* hide all elements preceding a collapsed section */
-.collapsePart.collapsed ~ * {
- display: none
-}
-.collapsePart {
- cursor: pointer
-}
-
-#categories section {
- margin-bottom: .5em
-}
-
-h2.sectionTitle {
- font-size: 1.5em
-}
-
-#toc {
- border: 1px solid rgba(255,255,255,0.1);
- max-width: max-content;
- padding: .75em;
- border-radius: 1em;
-
- display: inline-block;
- background: rgba(0,0,0,.1);
-}
-#toc li {
- list-style-type: none;
-}
-.member-leaderboard-item-anchor {
- color: inherit
-}
-.member-leaderboard-item {
- list-style-type: none
-}
-
-.item {
- display: inline-block;
- font-size: 32px;
- width: 1.2em;
- height: 1.2em;
- transition-property: font-size;
- transition-duration: 500ms
-}
-.item-slot {
- border: 1px solid #888;
- border-radius: .1em
-}
-.item img {
- position: absolute;
- margin-top: .075em;
- margin-left: .075em;
- width: 1em;
- height: 1em;
-}
-/* only pixelate items if they're not a head */
-.item img:not(.item-custom-head) {
- image-rendering: crisp-edges;
- image-rendering: pixelated;
-}
-
-.item-slot {
- margin: .05em
-}
-
-.item-count {
- font-size: .45em;
- float: right;
- position: relative;