initial commit

2026-06-30 22:51:26 +02:00
commit 3486145b9f
22 changed files with 9108 additions and 0 deletions
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -0,0 +1,81 @@
+---
+interface Props {
+	title: string;
+	description?: string;
+}
+
+const { title, description = "Zukunftssichere IT-Dienstleistungen für Ihr Unternehmen. N&D i-t SOLUTIONS bietet Leistungsübersicht, Cloud-Architekturen, IT-Sicherheit und Softwareentwicklung." } = Astro.props;
+---
+
+<!doctype html>
+<html lang="de" class="scroll-smooth">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="description" content={description} />
+		<meta name="viewport" content="width=device-width" />
+		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+		<meta name="generator" content={Astro.generator} />
+		<title>{title}</title>
+		
+		<!-- Google Fonts -->
+		<link rel="preconnect" href="https://fonts.googleapis.com">
+		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+		<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
+		
+		<!-- Inline script to set dark/light mode before page renders -->
+		<script is:inline>
+			(function() {
+				const theme = localStorage.getItem('theme');
+				if (theme === 'dark' || (!theme && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
+					document.documentElement.classList.add('dark');
+				} else {
+					document.documentElement.classList.remove('dark');
+				}
+			})();
+		</script>
+	</head>
+	<body class="bg-brand-lightBg text-brand-primary dark:bg-brand-darkBg dark:text-gray-100 font-sans transition-colors duration-300 antialiased selection:bg-brand-cyan selection:text-brand-primary">
+		<slot />
+	</body>
+</html>
+
+<style is:global>
+	:root {
+		--font-sans: 'Inter', sans-serif;
+		--font-display: 'Space Grotesk', sans-serif;
+	}
+
+	html {
+		font-family: var(--font-sans);
+	}
+
+	h1, h2, h3, h4, h5, h6 {
+		font-family: var(--font-display);
+	}
+
+	/* Parallax background custom scroll */
+	.parallax-bg {
+		background-attachment: fixed;
+	}
+	@media (max-width: 768px) {
+		.parallax-bg {
+			background-attachment: scroll;
+		}
+	}
+
+	/* Custom scrollbar */
+	::-webkit-scrollbar {
+		width: 10px;
+	}
+	::-webkit-scrollbar-track {
+		background: #0a0a0a;
+	}
+	::-webkit-scrollbar-thumb {
+		background: #222;
+		border-radius: 5px;
+		border: 2px solid #0a0a0a;
+	}
+	::-webkit-scrollbar-thumb:hover {
+		background: #333;
+	}
+</style>