{page.status}
{page.status === 404 ? "Post not found" : "Something went wrong"}
diff --git a/src/routes/newsroom/+page.svelte b/src/routes/newsroom/+page.svelte
index 4c6001e64..42a01120c 100644
--- a/src/routes/newsroom/+page.svelte
+++ b/src/routes/newsroom/+page.svelte
@@ -1,17 +1,14 @@
-
+
Oops! Something went wrong
An error occurred while trying to fetch the stats for '{page.params.ign}'
Try again or contact us if the problem persists.
diff --git a/src/routes/stats/[ign]/[[profile]]/+page.svelte b/src/routes/stats/[ign]/[[profile]]/+page.svelte
index 26fa015cd..cf4b88952 100644
--- a/src/routes/stats/[ign]/[[profile]]/+page.svelte
+++ b/src/routes/stats/[ign]/[[profile]]/+page.svelte
@@ -8,7 +8,6 @@
import Main from "$lib/layouts/stats/Main.svelte";
import type { SectionName } from "$lib/sections/types";
import { getProfileStats } from "$lib/shared/api/skycrypt-api.remote";
- import { cn } from "$lib/shared/utils";
import LoaderCircle from "@lucide/svelte/icons/loader-circle";
import { type PageServerData } from "./$types";
@@ -47,7 +46,7 @@
{#snippet pending()}
-
+
Loading profile...
From 2ba78417b17abb4815b78655d529835bd6e34568 Mon Sep 17 00:00:00 2001
From: DarthGigi <47110839+DarthGigi@users.noreply.github.com>
Date: Sat, 6 Jun 2026 15:41:37 +0200
Subject: [PATCH 02/11] chore: move app.css to routes/layout.css and update
references
---
.changeset/brown-clowns-dress.md | 5 +++++
.prettierrc | 2 +-
AGENTS.md | 2 +-
src/lib/shared/themes/presets.ts | 2 +-
src/lib/shared/themes/schema.ts | 4 ++--
src/routes/+layout.svelte | 2 +-
src/{app.css => routes/layout.css} | 0
src/routes/stats/[ign]/[[profile]]/card/+server.ts | 2 +-
8 files changed, 12 insertions(+), 7 deletions(-)
create mode 100644 .changeset/brown-clowns-dress.md
rename src/{app.css => routes/layout.css} (100%)
diff --git a/.changeset/brown-clowns-dress.md b/.changeset/brown-clowns-dress.md
new file mode 100644
index 000000000..92f51afed
--- /dev/null
+++ b/.changeset/brown-clowns-dress.md
@@ -0,0 +1,5 @@
+---
+"skycrypt-frontend": patch
+---
+
+Move app.css to routes/layout.css
diff --git a/.prettierrc b/.prettierrc
index 0f2cb621a..e2d48df97 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -14,7 +14,7 @@
}
}
],
- "tailwindStylesheet": "./src/app.css",
+ "tailwindStylesheet": "./src/routes/layout.css",
"tailwindAttributes": ["class", "class:*", "class:name", "payload"],
"tailwindFunctions": ["cn"],
"tailwindPreserveWhitespace": false
diff --git a/AGENTS.md b/AGENTS.md
index 6d8628bab..c9f09a706 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -134,7 +134,7 @@ All content injection uses Svelte 5 snippets. No `` usage.
### Styling
- Tailwind v4 primary, `cn()` helper (clsx + twMerge) from `$lib/shared/utils.ts`
-- MC color CSS vars: `--§a` (green), `--§b` (aqua), `--§c` (red), etc. in `app.css`
+- MC color CSS vars: `--§a` (green), `--§b` (aqua), `--§c` (red), etc. in `layout.css`
- Theme plugin: `src/plugins/themes.ts` → `:root[data-theme="..."]` CSS vars
### Formatting
diff --git a/src/lib/shared/themes/presets.ts b/src/lib/shared/themes/presets.ts
index 3c290d241..34b79287a 100644
--- a/src/lib/shared/themes/presets.ts
+++ b/src/lib/shared/themes/presets.ts
@@ -1,5 +1,5 @@
/**
- * Minecraft color palettes extracted from app.css utilities
+ * Minecraft color palettes extracted from layout.css utilities
* Each palette maps §0–§f color codes to OKLCH color values
*/
diff --git a/src/lib/shared/themes/schema.ts b/src/lib/shared/themes/schema.ts
index 7b5d5bc34..51d828915 100644
--- a/src/lib/shared/themes/schema.ts
+++ b/src/lib/shared/themes/schema.ts
@@ -7,7 +7,7 @@ import { z } from "zod";
* Organized into logical groups: colors, backgrounds, minecraft, enchantedGlint, meta.
*
* Color and background properties are OPTIONAL — when omitted, the CSS cascade
- * provides the correct values (e.g., the `light` utility class in app.css).
+ * provides the correct values (e.g., the `light` utility class in layout.css).
* Only DEFAULT_THEME is expected to have all properties fully specified.
*/
@@ -91,7 +91,7 @@ const backgroundsSchema = z.object({
*
* Color and background properties are individually optional.
* When a CSS property is omitted, it won't be applied to the DOM,
- * allowing the CSS cascade (e.g., app.css light/dark defaults) to take effect.
+ * allowing the CSS cascade (e.g., layout.css light/dark defaults) to take effect.
*/
export const themeV3Schema = z.object({
schema: z.literal(3),
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index a46a99943..74e872d55 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -22,7 +22,7 @@
import { writable } from "svelte/store";
import { fly } from "svelte/transition";
import { Drawer } from "vaul-svelte";
- import "../app.css";
+ import "./layout.css";
let { children }: { children: Snippet } = $props();
let isMobile = $state(new IsMobile());
diff --git a/src/app.css b/src/routes/layout.css
similarity index 100%
rename from src/app.css
rename to src/routes/layout.css
diff --git a/src/routes/stats/[ign]/[[profile]]/card/+server.ts b/src/routes/stats/[ign]/[[profile]]/card/+server.ts
index 4a25e5b82..32fde4610 100644
--- a/src/routes/stats/[ign]/[[profile]]/card/+server.ts
+++ b/src/routes/stats/[ign]/[[profile]]/card/+server.ts
@@ -1,6 +1,6 @@
import { building, dev } from "$app/environment";
import { env } from "$env/dynamic/public";
-import appStyles from "$src/app.css?inline";
+import appStyles from "$routes/layout.css?inline";
import { DefaultCard } from "$src/lib/components/cards";
import ErrorCard from "$src/lib/components/cards/default/ErrorCard.svelte";
import { parseSettingsFromParams } from "$src/lib/components/cards/default/schema";
From bd953662c9e8425fa0b9b55af66e7348ed3c6de8 Mon Sep 17 00:00:00 2001
From: DarthGigi <47110839+DarthGigi@users.noreply.github.com>
Date: Tue, 16 Jun 2026 16:17:02 +0200
Subject: [PATCH 03/11] feat: update Tailwind CSS configuration and integrate
new utility paths
---
.prettierrc | 10 +++++-----
.vscode/settings.json | 11 +++++++++--
vite.config.ts | 20 ++++++++++++++++----
3 files changed, 30 insertions(+), 11 deletions(-)
diff --git a/.prettierrc b/.prettierrc
index e2d48df97..b218a0006 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -6,6 +6,10 @@
"bracketSameLine": true,
"printWidth": 999999,
"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
+ "tailwindStylesheet": "src/routes/layout.css",
+ "tailwindAttributes": ["class", "class:*", "class:name", "payload", "/.*Classes/"],
+ "tailwindFunctions": ["cn", "clsx", "payload"],
+ "tailwindPreserveWhitespace": false,
"overrides": [
{
"files": "*.svelte",
@@ -13,9 +17,5 @@
"parser": "svelte"
}
}
- ],
- "tailwindStylesheet": "./src/routes/layout.css",
- "tailwindAttributes": ["class", "class:*", "class:name", "payload"],
- "tailwindFunctions": ["cn"],
- "tailwindPreserveWhitespace": false
+ ]
}
diff --git a/.vscode/settings.json b/.vscode/settings.json
index c9e1763da..aa2520306 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -12,9 +12,10 @@
"git.autofetch": true,
"svelte.enable-ts-plugin": true,
"svelte.plugin.svelte.defaultScriptLanguage": "ts",
- "tailwindCSS.classAttributes": ["class", "class:*", "class:name", "payload"],
+
"tailwindCSS.emmetCompletions": true,
- "tailwindCSS.classFunctions": ["cn", "clsx"],
+ "tailwindCSS.colorDecorators": true,
+ "tailwindCSS.experimental.configFile": "./src/routes/layout.css",
"tailwindCSS.includeLanguages": {
"html": "html",
"plaintext": "html",
@@ -22,6 +23,12 @@
"typescript": "typescript",
"svelte": "html"
},
+ "tailwindCSS.classFunctions": ["cn", "clsx", "payload"],
+ "tailwindCSS.classAttributes": ["class", "className", "ngClass", "class:list", "payload"],
+ "tailwindCSS.experimental.classRegex": [
+ ["\\b\\w*Classes\\s*=\\s*[\"']([^\"']*)[\"']", "([^\\s]+)"],
+ ["\\b\\w*Classes\\s*=\\s*\\{\\s*[\"']([^\"']*)[\"']\\s*\\}", "([^\\s]+)"]
+ ],
"js/ts.updateImportsOnFileMove.enabled": "prompt",
"eslint.validate": ["javascript", "typescript", "svelte"],
"prettier.documentSelectors": ["**/*.svelte"],
diff --git a/vite.config.ts b/vite.config.ts
index 4ba5a4061..09d4c6256 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -13,7 +13,6 @@ export default defineConfig({
project: "skycrypt-sveltekit",
adapter: "node"
}),
- tailwindcss(),
sveltekit({
// Consult https://svelte.dev/docs/kit/integrations
// for more information about preprocessors
@@ -32,7 +31,13 @@ export default defineConfig({
$constants: "./src/lib/server/constants",
$ctx: "./src/context",
$routes: "./src/routes",
- $src: "./src"
+ $src: "./src",
+ $ui: "./src/lib/components/ui",
+ $lib: "./src/lib",
+ $utils: "./src/lib/shared/utils.ts",
+ $hooks: "./src/lib/hooks",
+ $components: "./src/lib/components",
+ "$utils.js": "./src/lib/shared/utils.ts"
},
csrf: {
trustedOrigins: ["https://cupcake.shiiyu.moe", "https://sky.shiiyu.moe", "http://localhost:5173", "http://localhost:4173", "http://localhost:3000", "http://localhost:8080"]
@@ -43,7 +48,7 @@ export default defineConfig({
"script-src": ["self", "unsafe-inline"],
"worker-src": ["self", "blob:"],
"style-src": ["self", "unsafe-inline", "https://fonts.googleapis.com"],
- "img-src": ["self", "data:", "https://textures.minecraft.net", "http://localhost:8080", "https://cupcake.shiiyu.moe", "https://sky.shiiyu.moe", "https://nmsr.nickac.dev", "https://cms.shiiyu.moe", "http://localhost:3000"],
+ "img-src": ["self", "data:", "https://textures.minecraft.net", "http://localhost:8080", "https://cupcake.shiiyu.moe", "https://sky.shiiyu.moe", "https://nmsr.nickac.dev", "https://cms.shiiyu.moe", "http://localhost:3000", "https://eliteskyblock.com"],
"connect-src": ["self", "https://mowojang.matdoes.dev", "https://mowojang.seraph.si", "http://localhost:8080", "https://cupcake.shiiyu.moe", "https://sky.shiiyu.moe", "https://cms.shiiyu.moe", "http://localhost:3000"],
"font-src": ["self", "https://fonts.gstatic.com"],
"frame-ancestors": ["self", "https://cms.shiiyu.moe", "http://localhost:3000"],
@@ -60,8 +65,15 @@ export default defineConfig({
...config,
include: [...config.include, "../drizzle.config.ts"]
})
+ },
+ vitePlugin: {
+ experimental: {
+ sendWarningsToBrowser: process.env.NODE_ENV === "development"
+ },
+ inspector: process.env.NODE_ENV === "development"
}
- })
+ }),
+ tailwindcss()
],
build: { sourcemap: true },
test: {
From 7244b342c921940cfae96ef9b856def4e7a93430 Mon Sep 17 00:00:00 2001
From: DarthGigi <47110839+DarthGigi@users.noreply.github.com>
Date: Tue, 16 Jun 2026 16:17:33 +0200
Subject: [PATCH 04/11] feat: add optional 'important' parameter to
getRarityClass function
---
src/lib/shared/helper.ts | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/lib/shared/helper.ts b/src/lib/shared/helper.ts
index 6e47ceebd..213ed106b 100644
--- a/src/lib/shared/helper.ts
+++ b/src/lib/shared/helper.ts
@@ -44,10 +44,10 @@ export function titleCase(string: string): string {
* @param {"bg" | "text"} type the type of color to get
* @returns {string} the tailwind css color class
*/
-export function getRarityClass(rarity: string, type: "bg" | "text"): string {
+export function getRarityClass(rarity: string, type: "bg" | "text", important?: true): string {
const rarityColor = RARITY_COLORS[rarity.toLowerCase() as keyof typeof RARITY_COLORS];
// minecraft colors are safelisted in the tailwind config, so they are always generated
- return rarityColor ? `${type}-minecraft-${rarityColor}` : "";
+ return rarityColor ? `${type}-minecraft-${rarityColor}${important ? "!" : ""}` : "";
}
/**
From 84ec8b391f49c24f522912dee7632b6e80398657 Mon Sep 17 00:00:00 2001
From: DarthGigi <47110839+DarthGigi@users.noreply.github.com>
Date: Tue, 16 Jun 2026 16:25:39 +0200
Subject: [PATCH 05/11] feat: enhance layout styles with new utility classes
and font adjustments
---
src/routes/layout.css | 440 ++++++++++++++++++++++++++++++++++--------
1 file changed, 364 insertions(+), 76 deletions(-)
diff --git a/src/routes/layout.css b/src/routes/layout.css
index 4c9d41df7..130c9132c 100644
--- a/src/routes/layout.css
+++ b/src/routes/layout.css
@@ -1,8 +1,12 @@
@import "tailwindcss";
+@import "tw-animate-css";
+@import "shadcn-svelte/tailwind.css";
+@import "@fontsource-variable/montserrat";
+@import "@fontsource/unifontex";
@source "app.html";
-@source inline("{group-data-[rainbow=false]/html:,}{text-,bg-}minecraft-{0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f}");
-@custom-variant dark (&:where(.dark, .dark *));
-@custom-variant light (&:where(.light, .light *));
+@source inline("{group-data-[rainbow=false]/html:,}{text-,bg-}minecraft-{0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f}{,!}");
+@custom-variant dark (&:is(.dark *));
+@custom-variant light (&:is(.light *));
@custom-variant performance (&:where([data-performance="true"], [data-performance="true"] *));
@custom-variant standard (&:where([data-performance="false"], [data-performance="false"] *));
@@ -13,7 +17,7 @@
--color-icon: var(--icon);
--color-link: var(--link);
--color-hover: var(--hover);
- --color-skillbar: var(--skillbar);
+ --color-skillbar: var(--primary);
--color-maxedbar: var(--maxedbar);
--color-maxed: var(--maxed);
--color-gold: var(--gold);
@@ -58,10 +62,51 @@
}
/* Fonts */
- --font-icomoon: "icomoon", Montserrat;
- --font-sans: Montserrat, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
- --font-minecraft: "Minecraft", var(--font-icomoon), var(--font-sans);
- --font-minecraft-upper: "Minecraft-Upper", var(--font-sans);
+ --font-sans: "Montserrat Variable", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+ --font-skyblock-icons: "SkyBlockIcons", var(--font-sans);
+ --font-unifontex: "UnifontEX", var(--font-sans);
+ --font-minecraft: "Minecraft", var(--font-unifontex), var(--font-sans);
+ --font-heading: var(--font-sans);
+ --color-sidebar-ring: var(--sidebar-ring);
+ --color-sidebar-border: var(--sidebar-border);
+ --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+ --color-sidebar-accent: var(--sidebar-accent);
+ --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+ --color-sidebar-primary: var(--sidebar-primary);
+ --color-sidebar-foreground: var(--sidebar-foreground);
+ --color-sidebar: var(--sidebar);
+ --color-chart-5: var(--chart-5);
+ --color-chart-4: var(--chart-4);
+ --color-chart-3: var(--chart-3);
+ --color-chart-2: var(--chart-2);
+ --color-chart-1: var(--chart-1);
+ --color-ring: var(--ring);
+ --color-input: var(--input);
+ --color-border: var(--border);
+ --color-destructive: var(--destructive);
+ --color-accent-foreground: var(--accent-foreground);
+ --color-accent: var(--accent);
+ --color-accent-2: var(--accent-2);
+ --color-accent-3: var(--accent-3);
+ --color-accent-4: var(--accent-4);
+ --color-muted-foreground: var(--muted-foreground);
+ --color-muted: var(--muted);
+ --color-secondary-foreground: var(--secondary-foreground);
+ --color-secondary: var(--secondary);
+ --color-primary-foreground: var(--primary-foreground);
+ --color-primary: var(--primary);
+ --color-popover-foreground: var(--popover-foreground);
+ --color-popover: var(--popover);
+ --color-card-foreground: var(--card-foreground);
+ --color-card: var(--card);
+ --color-foreground: var(--foreground);
+ --radius-sm: calc(var(--radius) * 0.6);
+ --radius-md: calc(var(--radius) * 0.8);
+ --radius-lg: var(--radius);
+ --radius-xl: calc(var(--radius) * 1.4);
+ --radius-2xl: calc(var(--radius) * 1.8);
+ --radius-3xl: calc(var(--radius) * 2.2);
+ --radius-4xl: calc(var(--radius) * 2.6);
}
@theme inline {
@@ -85,63 +130,23 @@
@layer base {
@font-face {
- font-family: "Montserrat";
- font-style: italic;
- font-weight: 100 900;
- font-display: swap;
- src: url("/fonts/montserrat/montserrat-italic.woff2") format("woff2");
- unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
- }
-
- @font-face {
- font-family: "Montserrat";
- font-style: normal;
- font-weight: 100 900;
- font-display: swap;
- src: url("/fonts/montserrat/montserrat-normal.woff2") format("woff2");
- unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
- }
-
- @font-face {
- font-family: "icomoon";
- src:
- url("/fonts/icomoon/icomoon.woff2") format("woff2"),
- url("/fonts/icomoon/icomoon.woff") format("woff"),
- url("/fonts/icomoon/icomoon.ttf") format("truetype"),
- url("/fonts/icomoon/icomoon.svg#icomoon") format("svg");
- font-weight: normal;
+ font-family: "SkyBlockIcons";
font-style: normal;
font-display: block;
+ font-weight: 400;
+ src:
+ url("@fontsource/unifontex/files/unifontex-latin-400-normal.woff2") format("woff2"),
+ url("@fontsource/unifontex/files/unifontex-latin-400-normal.woff") format("woff");
unicode-range:
- /* ✪ dungeon-star */
- U+272A,
- /* ⍟ dungeon-master-star (no longer used) */ U+235F,
- /* ⚔ attack-speed */ U+2694,
- /* ☣ critical-chance */ U+2623,
- /* ☠ critical-damage */ U+2620,
- /* ❈ defense */ U+2748,
- /* ☘ fortune */ U+2618,
- /* ⫽ ferocity */ U+2AFD,
- /* ❤ health */ U+2764,
- /* ✎ intelligence */ U+270E,
- /* ✯ magic-find */ U+272F,
- /* ⸕ mining-speed */ U+2E15,
- /* ♣ pet-luck */ U+2663,
- /* ✧ pristine */ U+2727,
- /* α sea-creature-chance */ U+03B1,
- /* ✦ speed */ U+2726,
- /* ❁ strength */ U+2741,
- /* ๑ ability-damage */ U+0E51,
- /* ➊ 1-dungeon-star */ U+278A,
- /* ➋ 2-dungeon-star */ U+278B,
- /* ➌ 3-dungeon-star */ U+278C,
- /* ➍ 4-dungeon-star */ U+278D,
- /* ➎ 5-dungeon-star */ U+278E,
- /* ❂ true-defense, */ U+2742,
- /* ⸎ soulflow */ U+2E0E,
- /* ᠅ powder, */ U+1805,
- /* ✿ dye, */ U+273F,
- /* ⚚ dungeon-upgrade, */ U+269A;
+ /* Greek and Coptic, e.g. α */
+ U+0370-03FF,
+ /* Malayalam, e.g. ൠ */ U+0D00-0D7F,
+ /* Thai, e.g. ๑ */ U+0E00-0E7F,
+ /* Mongolian, e.g. ᠅ */ U+1800-18AF,
+ /* Letterlike and enclosed symbols, e.g. Ⓟ and Ⓢ */ U+2100-24FF,
+ /* Box drawing, symbols, dingbats, arrows, operators, e.g. ❤, ☘, ⚔, ➊ */ U+2500-2BFF,
+ /* Supplemental punctuation, e.g. ⸕ and ⸎ */ U+2E00-2E7F,
+ /* Text presentation selector for emoji-capable symbols */ U+FE0E;
}
@font-face {
@@ -152,19 +157,11 @@
font-display: swap;
}
- @font-face {
- font-family: "Minecraft-Upper";
- src: url("/fonts/minecraft/MinecraftTenv2-Regular.woff2") format("woff2");
- font-weight: normal;
- font-style: normal;
- font-display: swap;
- text-transform: uppercase;
- }
-
/* For color preview to work you need to have the 'naumovs.color-highlight' extension installed */
:root {
/* Icon Green (used for Skill Icons, Underlines etc.) */
- --icon: oklch(73.62% 0.2129 147.69);
+ /* --icon: oklch(73.62% 0.2129 147.69); */
+ --icon: var(--chart-2);
/* Link Green (used for Links, Unclaimed Slayers, Crafted Minions etc.) */
--link: oklch(81.56% 0.2459 146.24);
@@ -173,7 +170,8 @@
--hover: oklch(83.81% 0.2303 149.89);
/* Skill Bar Green (used for Skill Progress Bars) */
- --skillbar: oklch(63.98% 0.1731 150.18);
+ /* --skillbar: oklch(63.98% 0.1731 150.18); */
+ --skillbar: var(--primary);
/* Maxed Bar Gold (used for Maxed Progress Bars) */
--maxedbar: oklch(69.69% 0.1423 76.74);
@@ -189,8 +187,6 @@
/* Most of the text */
--text: oklch(1 0 0);
- /* background to make text more visible */
- --background: oklch(0 0 0);
/* background of the header */
--header: oklch(0.28 0 0);
/* used for info box and theme/pack selector */
@@ -226,6 +222,79 @@
--§f: oklch(0.66 0 0);
color-scheme: dark;
+
+ --background: oklch(1 0 0);
+ --foreground: oklch(0.145 0 0);
+ --card: oklch(1 0 0);
+ --card-foreground: oklch(0.145 0 0);
+ --popover: oklch(1 0 0);
+ --popover-foreground: oklch(0.145 0 0);
+ --primary: var(--chart-3);
+ --primary-foreground: oklch(0.982 0.018 155.826);
+ --secondary: oklch(0.967 0.001 286.375);
+ --secondary-foreground: oklch(0.21 0.006 285.885);
+ --muted: oklch(0.97 0 0);
+ --muted-foreground: oklch(0.556 0 0);
+ --accent: oklch(0.527 0.154 150.069);
+ --accent-foreground: oklch(0.982 0.018 155.826);
+ --accent-2: oklch(72.84% 0.1506 75.86);
+ --accent-3: oklch(69.69% 0.1423 76.74);
+ --accent-4: oklch(82.84% 0.1548 78.27);
+ --destructive: oklch(0.577 0.245 27.325);
+ --border: oklch(0.922 0 0);
+ --input: oklch(0.922 0 0);
+ --ring: oklch(0.708 0 0);
+ --chart-1: oklch(0.871 0.15 154.449);
+ --chart-2: oklch(0.723 0.219 149.579);
+ --chart-3: oklch(0.627 0.194 149.214);
+ --chart-4: oklch(0.527 0.154 150.069);
+ --chart-5: oklch(0.448 0.119 151.328);
+ --radius: 0.625rem;
+ --sidebar: oklch(0.985 0 0);
+ --sidebar-foreground: oklch(0.145 0 0);
+ --sidebar-primary: oklch(0.627 0.194 149.214);
+ --sidebar-primary-foreground: oklch(0.982 0.018 155.826);
+ --sidebar-accent: oklch(0.97 0 0);
+ --sidebar-accent-foreground: oklch(0.205 0 0);
+ --sidebar-border: oklch(0.922 0 0);
+ --sidebar-ring: oklch(0.708 0 0);
+ }
+
+ .dark {
+ --background: oklch(0.145 0 0);
+ --foreground: oklch(0.985 0 0);
+ --card: oklch(0.205 0 0);
+ --card-foreground: oklch(0.985 0 0);
+ --popover: oklch(0.205 0 0);
+ --popover-foreground: oklch(0.985 0 0);
+ --primary: var(--chart-3);
+ --primary-foreground: oklch(0.982 0.018 155.826);
+ --secondary: oklch(0.274 0.006 286.033);
+ --secondary-foreground: oklch(0.985 0 0);
+ --muted: oklch(0.269 0 0);
+ --muted-foreground: oklch(0.708 0 0);
+ --accent: oklch(0.448 0.119 151.328);
+ --accent-foreground: oklch(0.982 0.018 155.826);
+ --accent-2: oklch(72.84% 0.1506 75.86);
+ --accent-3: oklch(69.69% 0.1423 76.74);
+ --accent-4: oklch(82.84% 0.1548 78.27);
+ --destructive: oklch(0.704 0.191 22.216);
+ --border: oklch(1 0 0 / 10%);
+ --input: oklch(1 0 0 / 15%);
+ --ring: oklch(0.556 0 0);
+ --chart-1: oklch(0.871 0.15 154.449);
+ --chart-2: oklch(0.723 0.219 149.579);
+ --chart-3: oklch(0.627 0.194 149.214);
+ --chart-4: oklch(0.527 0.154 150.069);
+ --chart-5: oklch(0.448 0.119 151.328);
+ --sidebar: oklch(0.205 0 0);
+ --sidebar-foreground: oklch(0.985 0 0);
+ --sidebar-primary: oklch(0.723 0.219 149.579);
+ --sidebar-primary-foreground: oklch(0.982 0.018 155.826);
+ --sidebar-accent: oklch(0.269 0 0);
+ --sidebar-accent-foreground: oklch(0.985 0 0);
+ --sidebar-border: oklch(1 0 0 / 10%);
+ --sidebar-ring: oklch(0.556 0 0);
}
::-webkit-scrollbar {
@@ -281,6 +350,39 @@
clip-path: polygon(50% -71%, -50% 71%, 50% 171%, 171% 50%);
}
}
+
+ @keyframes scroll-fade-out {
+ from {
+ opacity: 1;
+ }
+ to {
+ opacity: 0;
+ }
+ }
+
+ * {
+ @apply border-border outline-ring/50;
+ }
+
+ body {
+ @apply bg-background text-foreground;
+ }
+
+ html {
+ @apply scrollbar-gutter-stable font-sans;
+ }
+
+ [data-slot="scroll-area-thumb"] {
+ @apply bg-primary! group-data-[orientation=horizontal]/scroll:px-2 group-data-[orientation=vertical]/scroll:py-2;
+ }
+
+ [data-slot="collapsible-content"] {
+ @apply overflow-clip duration-150 ease-out data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down;
+ }
+
+ .\@container-scroll {
+ container-type: scroll-state;
+ }
}
@layer components {
@@ -340,7 +442,8 @@
--grey_background: oklch(0.92 0 0);
--lore_background: oklch(1 0 0 / 0.93);
- --bg: oklch(1 0 0) color-scheme: light;
+ --bg: oklch(1 0 0);
+ color-scheme: light;
}
@utility shine {
@@ -461,3 +564,188 @@
@utility minecraft-tooltip {
@apply relative rounded-sm border-2 border-solid border-transparent bg-mctooltip-bg px-1 pt-1 pb-0.75 indent-[initial] font-minecraft text-[0.9375rem] leading-4.5 font-normal text-pretty [border-image:linear-gradient(to_bottom,oklch(48.503%_0.297_278.42/0.31),oklch(29.365%_0.17619_281.21/0.31))_1] text-shadow-[0.09375rem_0.09375rem_oklch(36.768%,0.00004,271.152)];
}
+
+@utility hit-area-debug {
+ position: relative;
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ @apply border border-dashed border-blue-500 bg-blue-500/10;
+ }
+ &:hover::before {
+ @apply border border-dashed border-green-500 bg-green-500/10;
+ }
+}
+
+@utility hit-area {
+ position: relative;
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ }
+}
+
+@utility hit-area-* {
+ position: relative;
+ --hit-area-t: --spacing(--value(number) * -1);
+ --hit-area-t: calc(--value([*]) * -1);
+ --hit-area-b: --spacing(--value(number) * -1);
+ --hit-area-b: calc(--value([*]) * -1);
+ --hit-area-l: --spacing(--value(number) * -1);
+ --hit-area-l: calc(--value([*]) * -1);
+ --hit-area-r: --spacing(--value(number) * -1);
+ --hit-area-r: calc(--value([*]) * -1);
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ }
+}
+
+@utility hit-area-l-* {
+ position: relative;
+ --hit-area-l: --spacing(--value(number) * -1);
+ --hit-area-l: calc(--value([*]) * -1);
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ }
+}
+
+@utility hit-area-r-* {
+ position: relative;
+ --hit-area-r: --spacing(--value(number) * -1);
+ --hit-area-r: calc(--value([*]) * -1);
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ }
+}
+
+@utility hit-area-t-* {
+ position: relative;
+ --hit-area-t: --spacing(--value(number) * -1);
+ --hit-area-t: calc(--value([*]) * -1);
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ }
+}
+
+@utility hit-area-b-* {
+ position: relative;
+ --hit-area-b: --spacing(--value(number) * -1);
+ --hit-area-b: calc(--value([*]) * -1);
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ }
+}
+
+@utility hit-area-x-* {
+ position: relative;
+ --hit-area-l: --spacing(--value(number) * -1);
+ --hit-area-l: calc(--value([*]) * -1);
+ --hit-area-r: --spacing(--value(number) * -1);
+ --hit-area-r: calc(--value([*]) * -1);
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ }
+}
+
+@utility hit-area-y-* {
+ position: relative;
+ --hit-area-t: --spacing(--value(number) * -1);
+ --hit-area-t: calc(--value([*]) * -1);
+ --hit-area-b: --spacing(--value(number) * -1);
+ --hit-area-b: calc(--value([*]) * -1);
+ &::before {
+ content: "";
+ position: absolute;
+ top: var(--hit-area-t, 0px);
+ right: var(--hit-area-r, 0px);
+ bottom: var(--hit-area-b, 0px);
+ left: var(--hit-area-l, 0px);
+ pointer-events: inherit;
+ }
+}
+
+/* On the scroll container: expose a named scroll-progress timeline per axis. */
+@utility scroll-fade-track-y {
+ scroll-timeline-name: --scroll-fade-y;
+ scroll-timeline-axis: block;
+}
+
+@utility scroll-fade-track-x {
+ scroll-timeline-name: --scroll-fade-x;
+ scroll-timeline-axis: inline;
+}
+
+@utility scroll-fade-track-both {
+ scroll-timeline-name: --scroll-fade-y, --scroll-fade-x;
+ scroll-timeline-axis: block, inline;
+}
+
+@utility scroll-fade-y {
+ opacity: 0;
+ animation-name: scroll-fade-out;
+ animation-timing-function: linear;
+ animation-fill-mode: both;
+ animation-timeline: --scroll-fade-y;
+}
+
+@utility scroll-fade-x {
+ opacity: 0;
+ animation-name: scroll-fade-out;
+ animation-timing-function: linear;
+ animation-fill-mode: both;
+ animation-timeline: --scroll-fade-x;
+}
+
+@custom-variant @stuck-top {
+ @supports (container-type: scroll-state) {
+ @container scroll-state(stuck: top) {
+ @slot;
+ }
+ }
+}
From a80e39162044f99f6fdfdb04e6a7f6355f712702 Mon Sep 17 00:00:00 2001
From: DarthGigi <47110839+DarthGigi@users.noreply.github.com>
Date: Tue, 16 Jun 2026 16:26:46 +0200
Subject: [PATCH 06/11] chore(fonts): remove unused fonts
---
static/fonts/icomoon/README.md | 30 --------------
static/fonts/icomoon/icomoon.svg | 38 ------------------
static/fonts/icomoon/icomoon.ttf | Bin 8828 -> 0 bytes
static/fonts/icomoon/icomoon.woff | Bin 8904 -> 0 bytes
static/fonts/icomoon/icomoon.woff2 | Bin 5020 -> 0 bytes
static/fonts/icomoon/selection.json | 36 -----------------
.../minecraft/MinecraftTenv2-Regular.woff2 | Bin 8912 -> 0 bytes
.../fonts/montserrat/montserrat-italic.woff2 | Bin 37120 -> 0 bytes
.../fonts/montserrat/montserrat-normal.woff2 | Bin 35508 -> 37956 bytes
9 files changed, 104 deletions(-)
delete mode 100644 static/fonts/icomoon/README.md
delete mode 100644 static/fonts/icomoon/icomoon.svg
delete mode 100644 static/fonts/icomoon/icomoon.ttf
delete mode 100644 static/fonts/icomoon/icomoon.woff
delete mode 100644 static/fonts/icomoon/icomoon.woff2
delete mode 100644 static/fonts/icomoon/selection.json
delete mode 100644 static/fonts/minecraft/MinecraftTenv2-Regular.woff2
delete mode 100644 static/fonts/montserrat/montserrat-italic.woff2
diff --git a/static/fonts/icomoon/README.md b/static/fonts/icomoon/README.md
deleted file mode 100644
index da3ab0117..000000000
--- a/static/fonts/icomoon/README.md
+++ /dev/null
@@ -1,30 +0,0 @@
-# SkyCrypt custom icon font
-
-This font is loaded on top of the normal fonts and replaces only specific characters (icons such as the item stars, dungeon master stars) with svg icons.
-
-## How to edit
-
-You can import _selection.json_ back to the IcoMoon app using the _Import Icons_ button (or via Main Menu → Manage Projects) to retrieve your icon selection.
-
-## How to add new icons/characters
-
-First off find the UNICODE character you want to edit, you can use [this website](https://www.babelstone.co.uk/Unicode/whatisit.html).
-
-Then import the icomoon font in the app and add a new character by dropping an svg in the selection. At this point go to "Generate Font" and make sure to associate your newly imported icon to the correct character.
-
-If you want you can resize the icon:
-
-- for dungeon stars and dungeon master stars I scaled down 10 times the icons (by using IcoMoon GUI, clicking 10 times the "scale down" button) and then aligned the svg bottom center
-- for skill icons I kept their original size and centered them middle center.
-
-Download the generated SVG font, replace the files in the `/public/resources/fonts/icomoon/` directory:
-
-- Font files
-- selection.json
-
-Update the `_fonts.scss` file:
-
-- Bump the cachebusting version (ex: `?v2` -> `?v3`)
-- Add the UNICODE characters to the list in the css property `unicode-range`
-
-And you are done!
diff --git a/static/fonts/icomoon/icomoon.svg b/static/fonts/icomoon/icomoon.svg
deleted file mode 100644
index 97319566e..000000000
--- a/static/fonts/icomoon/icomoon.svg
+++ /dev/null
@@ -1,38 +0,0 @@
-
-
-
\ No newline at end of file
diff --git a/static/fonts/icomoon/icomoon.ttf b/static/fonts/icomoon/icomoon.ttf
deleted file mode 100644
index 63df20ab4e6b351954ddff80f7eba5ade90786bd..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001
literal 8828
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
Oops! Something went wrong
An error occurred while trying to fetch the stats for '{page.params.ign}'
Try again or contact us if the problem persists.
diff --git a/src/routes/stats/[ign]/[[profile]]/+page.svelte b/src/routes/stats/[ign]/[[profile]]/+page.svelte index 26fa015cd..cf4b88952 100644 --- a/src/routes/stats/[ign]/[[profile]]/+page.svelte +++ b/src/routes/stats/[ign]/[[profile]]/+page.svelte @@ -8,7 +8,6 @@ import Main from "$lib/layouts/stats/Main.svelte"; import type { SectionName } from "$lib/sections/types"; import { getProfileStats } from "$lib/shared/api/skycrypt-api.remote"; - import { cn } from "$lib/shared/utils"; import LoaderCircle from "@lucide/svelte/icons/loader-circle"; import { type PageServerData } from "./$types"; @@ -47,7 +46,7 @@