SteamWar/Website
10
1
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor styles and components for improved UI consistency

Browse Source 
- Updated login page layout by removing unnecessary classes.
- Redesigned 404 not found page with new layout and styles.
- Enhanced public pages with consistent font styling and hover effects.
- Improved ranking page header styling for better readability.
- Updated rules page with consistent font and link styles.
- Enhanced statistics page header styling.
- Refined global CSS variables for better theme consistency.
- Updated button styles for improved interaction feedback.
- Enhanced table styles for better readability and interaction.
- Updated Tailwind configuration to include new font families.
This commit is contained in:
Chaoscaot
2026-03-28 15:56:32 +01:00
parent f612b15b06
commit d2ee422d6d
31 changed files with 1028 additions and 372 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/app.css
+66 -38
View File
@@ -23,67 +23,77 @@
@layer base {
:root {
--background: 0 0% 100%;
--foreground: 240 10% 3.9%;
--background: 0 0% 3.1%;
--foreground: 0 0% 96%;
--muted: 240 4.8% 95.9%;
--muted-foreground: 240 3.8% 46.1%;
--muted: 0 0% 10%;
--muted-foreground: 0 0% 55%;
--popover: 0 0% 100%;
--popover-foreground: 240 10% 3.9%;
--popover: 0 0% 5%;
--popover-foreground: 0 0% 96%;
--card: 0 0% 100%;
--card-foreground: 240 10% 3.9%;
--card: 0 0% 5%;
--card-foreground: 0 0% 96%;
--border: 240 5.9% 90%;
--input: 240 5.9% 90%;
--border: 0 0% 12%;
--input: 0 0% 12%;
--primary: 240 5.9% 10%;
--primary-foreground: 0 0% 98%;
--primary: 38 92% 50%;
--primary-foreground: 0 0% 4%;
--secondary: 240 4.8% 95.9%;
--secondary-foreground: 240 5.9% 10%;
--secondary: 0 0% 10%;
--secondary-foreground: 0 0% 96%;
--accent: 240 4.8% 95.9%;
--accent-foreground: 240 5.9% 10%;
--accent: 38 92% 50%;
--accent-foreground: 0 0% 4%;
--destructive: 0 84.2% 60.2%;
--destructive-foreground: 0 0% 98%;
--ring: 240 5% 64.9%;
--ring: 38 92% 50%;
--radius: 0.5rem;
--radius: 0;
--sw-bg: #080808;
--sw-bg-raised: #0c0c0c;
--sw-bg-surface: #111111;
--sw-amber: #f59e0b;
--sw-amber-light: #fbbf24;
--sw-amber-dim: rgba(245, 158, 11, 0.15);
--sw-text: #f5f5f5;
--sw-text-muted: #a3a3a3;
--sw-border: rgba(255, 255, 255, 0.06);
}
.dark {
--background: 240 10% 3.9%;
--foreground: 0 0% 98%;
--background: 0 0% 3.1%;
--foreground: 0 0% 96%;
--muted: 240 3.7% 15.9%;
--muted-foreground: 240 5% 64.9%;
--muted: 0 0% 10%;
--muted-foreground: 0 0% 55%;
--popover: 240 10% 3.9%;
--popover-foreground: 0 0% 98%;
--popover: 0 0% 5%;
--popover-foreground: 0 0% 96%;
--card: 240 10% 3.9%;
--card-foreground: 0 0% 98%;
--card: 0 0% 5%;
--card-foreground: 0 0% 96%;
--border: 240 3.7% 15.9%;
--input: 240 3.7% 15.9%;
--border: 0 0% 12%;
--input: 0 0% 12%;
--primary: 0 0% 98%;
--primary-foreground: 240 5.9% 10%;
--primary: 38 92% 50%;
--primary-foreground: 0 0% 4%;
--secondary: 240 3.7% 15.9%;
--secondary-foreground: 0 0% 98%;
--secondary: 0 0% 10%;
--secondary-foreground: 0 0% 96%;
--accent: 240 3.7% 15.9%;
--accent-foreground: 0 0% 98%;
--accent: 38 92% 50%;
--accent-foreground: 0 0% 4%;
--destructive: 0 62.8% 30.6%;
--destructive-foreground: 0 85.7% 97.3%;
--ring: 240 3.7% 15.9%;
--ring: 38 92% 50%;
}
}
@@ -93,6 +103,13 @@
}
body {
@apply bg-background text-foreground;
background-color: var(--sw-bg);
color: var(--sw-text);
}
::selection {
background: rgba(245, 158, 11, 0.3);
color: #fff;
}
article {
@@ -101,15 +118,26 @@
}
code {
@apply dark:text-neutral-400 text-neutral-800;
color: var(--sw-amber-light);
background: rgba(245, 158, 11, 0.08);
padding: 0.15em 0.4em;
}
pre.astro-code {
@apply w-fit p-4 rounded-md border-2 border-gray-600 my-4;
@apply w-fit p-4 my-4;
border: 1px solid var(--sw-border);
background: var(--sw-bg) !important;
}
a {
@apply text-neutral-800 dark:text-neutral-400 hover:underline;
color: var(--sw-amber);
text-decoration: none;
border-bottom: 1px solid transparent;
transition: border-color 0.2s ease;
}
a:hover {
border-bottom-color: var(--sw-amber);
}
}
}