feat: Implement initial website structure with core pages, layout, and reusable UI components, alongside ESLint configuration and SEO setup.

This commit is contained in:
1elle1
2026-01-30 14:45:52 +01:00
parent f0e917ef5d
commit f1cb4ef2cc
20 changed files with 6800 additions and 19 deletions

View File

@@ -6,6 +6,50 @@
@import "tailwindcss";
/* ── Tailwind v4 Theme ───────────────────────────────── */
@theme {
/* Colors */
--color-primary: #000000;
--color-secondary: #FFFFFF;
--color-accent: #d6d6d6;
--color-neutral: #F5F5F5;
--color-background: #FFFFFF;
--color-foreground: #000000;
--color-muted: #B0B0B0;
--color-muted-foreground: #ffffff;
--color-border: #E0E0E0;
--color-success: #4CAF50;
--color-warning: #FF9800;
--color-error: #F44336;
/* Fonts */
--font-heading: 'Inter', sans-serif;
--font-body: 'Inter', sans-serif;
/* Typography Scale override Tailwind defaults to match design tokens */
--text-xl: 1.5rem;
--text-xl--line-height: 2rem;
--text-2xl: 1.75rem;
--text-2xl--line-height: 2.25rem;
--text-3xl: 2rem;
--text-3xl--line-height: 2.5rem;
--text-4xl: 2.5rem;
--text-4xl--line-height: 2.75rem;
--text-5xl: 3rem;
--text-5xl--line-height: 1.1;
--text-6xl: 3.75rem;
--text-6xl--line-height: 1.1;
}
/* ── Font Override (connect next/font to CSS vars) ──── */
/* --font-inter is injected by next/font/google on <html> */
html {
--font-heading: var(--font-inter, 'Inter', sans-serif);
--font-body: var(--font-inter, 'Inter', sans-serif);
}
/* ── Base Resets ───────────────────────────────────── */
*, *::before, *::after {
@@ -39,14 +83,10 @@ h1, h2, h3, h4, h5, h6 {
/* ── Links ───────────────────────────────────────── */
a {
color: var(--color-primary);
color: inherit;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
/* ── Images ──────────────────────────────────────── */
img, video, svg {
@@ -68,3 +108,15 @@ img, video, svg {
background-color: var(--color-primary);
color: var(--color-background);
}
/* ── Reduced Motion ─────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
}