myxelium/Toju
1
0
Fork 0
Code Issues 14 Pull Requests Actions Packages Projects 2 Releases 36 Wiki Activity

style: Update default theme

Browse Source
This commit is contained in:
SocksOnHead
2026-05-25 16:51:44 +02:00
parent 155fe20862
commit 1259645706
23 changed files with 1206 additions and 630 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
website/src/styles.scss
View File

@@ -1,4 +1,4 @@
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Outfit:wght@400;500;600;700;800&display=swap');
@tailwind base;
@tailwind components;
@@ -6,22 +6,24 @@
@layer base {
:root {
--background: 240 10% 3.9%;
--foreground: 0 0% 98%;
--card: 240 10% 6%;
--card-foreground: 0 0% 98%;
--primary: 262.1 83.3% 57.8%;
--primary-foreground: 210 20% 98%;
--secondary: 240 3.7% 15.9%;
--secondary-foreground: 0 0% 98%;
--muted: 240 3.7% 15.9%;
--muted-foreground: 240 5% 64.9%;
--accent: 262.1 83.3% 57.8%;
--accent-foreground: 0 0% 98%;
--border: 240 3.7% 15.9%;
--input: 240 3.7% 15.9%;
--ring: 262.1 83.3% 57.8%;
--radius: 0.75rem;
--background: 210 18% 7%;
--foreground: 42 33% 94%;
--card: 210 17% 10%;
--card-foreground: 42 33% 94%;
--primary: 154 49% 55%;
--primary-foreground: 210 18% 7%;
--secondary: 210 14% 15%;
--secondary-foreground: 42 33% 94%;
--muted: 210 14% 15%;
--muted-foreground: 42 13% 67%;
--accent: 38 64% 61%;
--accent-foreground: 210 18% 7%;
--border: 210 13% 22%;
--input: 210 13% 22%;
--ring: 154 49% 55%;
--radius: 0.6rem;
--font-sans: 'Outfit', system-ui, sans-serif;
--font-mono: 'IBM Plex Mono', monospace;
}
* {
@@ -33,8 +35,29 @@
}
body {
@apply bg-background text-foreground font-sans antialiased;
@apply bg-background text-foreground antialiased;
font-family: var(--font-sans);
font-feature-settings: 'rlig' 1, 'calt' 1;
background:
radial-gradient(circle at top left, hsl(var(--primary) / 0.08), transparent 26rem),
linear-gradient(180deg, hsl(210 18% 8%), hsl(var(--background)) 34rem);
}
body::before {
content: '';
position: fixed;
inset: 0;
pointer-events: none;
z-index: 100;
opacity: 0.035;
background-image: linear-gradient(90deg, hsl(var(--foreground)) 1px, transparent 1px), linear-gradient(0deg, hsl(var(--foreground)) 1px, transparent 1px);
background-size: 22px 22px;
}
a,
button {
outline-color: hsl(var(--ring));
outline-offset: 3px;
}
}
@@ -57,12 +80,12 @@
/* Utility classes */
.glass {
backdrop-filter: blur(16px) saturate(180%);
background: hsl(var(--background) / 0.7);
border: 1px solid hsl(var(--border) / 0.3);
background: hsl(var(--background) / 0.82);
border-bottom: 1px solid hsl(var(--border));
}
.gradient-text {
background: linear-gradient(135deg, hsl(var(--primary)), hsl(280 90% 70%), hsl(320 80% 65%));
background: linear-gradient(135deg, hsl(var(--primary)), hsl(var(--accent)));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
@@ -76,7 +99,7 @@
inset: 0;
border-radius: inherit;
padding: 1px;
background: linear-gradient(135deg, hsl(var(--primary)), hsl(280 90% 70%), transparent);
background: linear-gradient(135deg, hsl(var(--primary)), hsl(var(--accent)), transparent);
-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
-webkit-mask-composite: xor;
mask-composite: exclude;