add team page

src/routes/+layout.svelte

@@ -73,7 +73,7 @@
 />
 
 <main>
-	<div class="min-h-screen h-full w-full">
+	<div class="min-h-[calc(100vh-3.5rem)] h-full w-full" class:min-h-screen={onAdminPage}>
 		<slot />
 	</div>
 </main>

src/routes/+page.svelte

@@ -73,12 +73,12 @@
 		<div>
 			<h2 class="text-3xl text-black dark:text-white mb-8">Über uns</h2>
 			<p>
-				Wir sind ein kleines Team von Minecraft-Enthusiasten, das bereits im 6. Jahr in Folge
-				Minecraft CraftAttack organisiert. Jahr für Jahr arbeiten wir daran, das Spielerlebnis zu
-				verbessern und steigeren die Teilnehmerzahl.
+				Wir sind ein kleines <a class="link" href={`${env.PUBLIC_BASE_PATH}/team`}>Team</a> von Minecraft-Enthusiasten,
+				das bereits im 6. Jahr in Folge Minecraft CraftAttack organisiert. Jahr für Jahr arbeiten wir
+				daran, das Spielerlebnis zu verbessern und steigeren die Teilnehmerzahl.
 			</p>
 			<p>
-				Unser Ziel bei diesem ab dem <span class="underline"
+				Unser Ziel bei diesem ab dem <span class="italic"
 					>{new Date(env.PUBLIC_START_DATE).toLocaleString('de-DE', {
 						day: '2-digit',
 						month: 'numeric',

src/routes/faq/+layout.svelte

@@ -0,0 +1,3 @@
+<div class="mx-4 my-6 sm:mx-3 sm:my-12">
+	<slot />
+</div>

src/routes/faq/+page.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+	let questions = [
+		{
+			title: '',
+			content: ''
+		}
+	];
+</script>
+
+{#each questions as question}
+	<div class="collapse collapse-plus bg-base-200">
+		<input type="radio" />
+		<div class="collapse-title text-xl font-medium">{question.title}</div>
+		<div class="collapse-content">{@html question.content}</div>
+	</div>
+{/each}

src/routes/team/+layout.svelte

@@ -0,0 +1,3 @@
+<div class="m-auto flex flex-col justify-center items-center px-4 py-6 sm:px-48 sm:py-12">
+	<slot />
+</div>

src/routes/team/+page.svelte

@@ -0,0 +1,81 @@
+<script lang="ts">
+	import globe_icon from '$lib/extra-icons/globe.svg';
+
+	let team = [
+		{
+			name: 'Elias',
+			nickname: 'MineTec',
+			roles: ['Gründer', 'Support', 'Organisation', 'Softwareentwicklung', 'Systemadministrator'],
+			links: [{ name: 'Website', href: 'https://mhsl.eu/aboutme/', icon: globe_icon }]
+		},
+		{
+			name: 'Jannik',
+			nickname: 'Goldi187',
+			roles: ['Support', 'Organisation']
+		},
+		{
+			name: 'Martin',
+			nickname: 'olischma',
+			roles: ['Support', 'Systemadministrator', 'Softwareentwicklung']
+		},
+		{
+			name: 'Adrian',
+			nickname: 'h0nny27',
+			roles: ['Support']
+		},
+		{
+			name: 'Ruben',
+			nickname: 'bytedream',
+			roles: ['Softwareentwicklung'],
+			links: [{ name: 'Website', href: 'https://bytedream.dev', icon: globe_icon }]
+		},
+		{
+			name: 'Lars',
+			nickname: '28Pupsi28',
+			roles: ['Softwareentwicklung']
+		}
+	];
+</script>
+
+<svelte:head>
+	<title>Team</title>
+</svelte:head>
+
+<h1 class="text-3xl lg:text-5xl mb-4">Das Team</h1>
+<div class="grid grid-cols-3 gap-4 my-4 justify-center">
+	{#each team as member}
+		<div class="card w-96 bg-base-200">
+			<div class="card-body px-4 py-6">
+				<div class="flex flex-col items-center">
+					<div class="avatar placeholder mb-2">
+						<div class="bg-neutral text-neutral-content w-24 rounded-xl">
+							<span class="text-3xl">{member.name.at(0).toUpperCase()}</span>
+						</div>
+					</div>
+					<p class="text-center text-lg mb-1">{member.name} · {member.nickname}</p>
+					<p class="text-center text-sm font-light">{member.roles.join(' · ')}</p>
+					{#if member.links}
+						<div class="w-full flex items-center flex-col">
+							<div class="w-1/2 h-[1px] my-3 rounded bg-base-content" />
+							<div class="flex gap-3">
+								{#each member.links as link}
+									<a
+										class="block w-9 h-9 p-2 border rounded-full border-base-content"
+										href={link.href}
+										target="_blank"
+										title={link.name}
+									>
+										<img class="w-full h-full invert" src={link.icon} alt={link.name} />
+									</a>
+								{/each}
+							</div>
+						</div>
+					{/if}
+				</div>
+			</div>
+		</div>
+	{/each}
+</div>
+
+<style>
+</style>