add faq

src/lib/extra-icons/globe.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M352 256c0 22.2-1.2 43.6-3.3 64l-185.3 0c-2.2-20.4-3.3-41.8-3.3-64s1.2-43.6 3.3-64l185.3 0c2.2 20.4 3.3 41.8 3.3 64zm28.8-64l123.1 0c5.3 20.5 8.1 41.9 8.1 64s-2.8 43.5-8.1 64l-123.1 0c2.1-20.6 3.2-42 3.2-64s-1.1-43.4-3.2-64zm112.6-32l-116.7 0c-10-63.9-29.8-117.4-55.3-151.6c78.3 20.7 142 77.5 171.9 151.6zm-149.1 0l-176.6 0c6.1-36.4 15.5-68.6 27-94.7c10.5-23.6 22.2-40.7 33.5-51.5C239.4 3.2 248.7 0 256 0s16.6 3.2 27.8 13.8c11.3 10.8 23 27.9 33.5 51.5c11.6 26 20.9 58.2 27 94.7zm-209 0L18.6 160C48.6 85.9 112.2 29.1 190.6 8.4C165.1 42.6 145.3 96.1 135.3 160zM8.1 192l123.1 0c-2.1 20.6-3.2 42-3.2 64s1.1 43.4 3.2 64L8.1 320C2.8 299.5 0 278.1 0 256s2.8-43.5 8.1-64zM194.7 446.6c-11.6-26-20.9-58.2-27-94.6l176.6 0c-6.1 36.4-15.5 68.6-27 94.6c-10.5 23.6-22.2 40.7-33.5 51.5C272.6 508.8 263.3 512 256 512s-16.6-3.2-27.8-13.8c-11.3-10.8-23-27.9-33.5-51.5zM135.3 352c10 63.9 29.8 117.4 55.3 151.6C112.2 482.9 48.6 426.1 18.6 352l116.7 0zm358.1 0c-30 74.1-93.6 130.9-171.9 151.6c25.5-34.2 45.2-87.7 55.3-151.6l116.7 0z"/></svg>

src/routes/+layout.svelte

@@ -22,6 +22,12 @@
 			sprite: `${env.PUBLIC_BASE_PATH}/img/menu-rules.png`,
 			href: `${env.PUBLIC_BASE_PATH}/rules`,
 			active: false
+		},
+		{
+			name: 'FAQ',
+			sprite: `${env.PUBLIC_BASE_PATH}/img/menu-faq.png`,
+			href: `${env.PUBLIC_BASE_PATH}/faq`,
+			active: false
 		}
 	];
 
@@ -73,7 +79,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',
@@ -103,7 +103,7 @@
 					</div>
 					<div class="stat-title">Abgebaute Blöcke</div>
 					<div class="stat-value">35M</div>
-					<!--div class="stat-desc"><span class="underline">2.3M</span> davon Netherrack</div-->
+					<div class="stat-desc"><span class="underline">9.6M</span> davon Stein</div>
 				</div>
 				<div class="stat">
 					<div class="stat-figure">

src/routes/admin/settings/+page.server.ts

@@ -22,6 +22,9 @@ export const load: PageServerLoad = async ({ parent, cookies }) => {
 
 	return {
 		settings: {
+			global: {
+				paypal_link: settings['global.paypal_link'] ?? ''
+			},
 			register: {
 				enabled: settings['register.enabled'] ?? true,
 				disabled_title: settings['register.disabled_title'] ?? 'Anmeldung geschlossen',

src/routes/admin/settings/+page.svelte

@@ -8,6 +8,9 @@
 		await fetch(`${env.PUBLIC_BASE_PATH}/admin/settings`, {
 			method: 'POST',
 			body: JSON.stringify({
+				global: {
+					paypal_link: returnIfNoDup(settings.global.paypal_link, data.settings.global.paypal_link)
+				},
 				register: {
 					enabled: returnIfNoDup(settings.register.enabled, data.settings.register.enabled),
 					disabled_title: returnIfNoDup(
@@ -32,6 +35,13 @@
 
 <div class="h-full flex flex-col items-center justify-between">
 	<div class="grid grid-cols-3 w-full [&>*]:mx-8">
+		<div>
+			<div class="divider">Global</div>
+			<label class="label">
+				<span class="label-text">PayPal-Spendenlink</span>
+				<input type="text" class="input input-bordered" bind:value={settings.global.paypal_link} />
+			</label>
+		</div>
 		<div>
 			<div class="divider">Anmeldung</div>
 			<label class="label cursor-pointer">

src/routes/admin/settings/+server.ts

@@ -13,16 +13,18 @@ export const POST = (async ({ request, cookies }) => {
 
 	const settings: PageData['settings'] = await request.json();
 
-	for (const [key, value] of Object.entries(settings.register)) {
-		const setting = await Settings.findOne({ where: { key: `register.${key}` } });
-		if (setting) {
-			setting.value = JSON.stringify(value);
-			await setting.save();
-		} else {
-			await Settings.create({
-				key: `register.${key}`,
-				value: JSON.stringify(value)
-			});
+	for (const [group, entries] of Object.entries(settings)) {
+		for (const [key, value] of Object.entries(entries)) {
+			const setting = await Settings.findOne({ where: { key: `${group}.${key}` } });
+			if (setting) {
+				setting.value = JSON.stringify(value);
+				await setting.save();
+			} else {
+				await Settings.create({
+					key: `${group}.${key}`,
+					value: JSON.stringify(value)
+				});
+			}
 		}
 	}
 

src/routes/faq/+layout.svelte

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

src/routes/faq/+page.server.ts

@@ -0,0 +1,8 @@
+import type { PageServerLoad } from './$types';
+import { Settings } from '$lib/server/database';
+
+export const load: PageServerLoad = async () => {
+	return {
+		paypal_link: (await Settings.findOne({ where: { key: 'global.paypal_link' } }))?.value ?? ''
+	};
+};

src/routes/faq/+page.svelte

@@ -0,0 +1,202 @@
+<script lang="ts">
+	import type { PageData } from './$types';
+
+	export let data: PageData;
+
+	let faq = [
+		{
+			section: 'Anmeldung',
+			questions: [
+				{
+					title: 'Wann startet CraftAttack 7?',
+					content: `<p>Der Start von CraftAttack 7 findet gemeinsam am 27.12.2024 um 14:00 Uhr statt. Am besten
+bist du schon einige Minuten vorher auf dem Server. Natürlich kannst du aber auch danach
+jederzeit dazustoßen.</p>`
+				},
+				{
+					title: 'Wer kann alles mitspielen?',
+					content: `<p>Jeder, der entweder Minecraft Java oder Bedrock (Handy und Konsole) besitzt und
+mindestens 6 Jahre alt ist, kann mitspielen.</p>`
+				},
+				{
+					title: 'Wie kann ich mitspielen?',
+					content: `<p>Um mitzuspielen, musst du dich einfach hier auf der Website anmelden und der WhatsApp-
+Gruppe beitreten.</p>`
+				},
+				{
+					title: 'Auf welcher Version läuft der Server?',
+					content: `<p>Gespielt wird immer auf der neuesten Version, also laut aktuellem Stand Version 1.21.3.</p>`
+				},
+				{
+					title: 'Kann ich auch als Bedrock-Spieler (Handy oder Konsole) mitspielen?',
+					content: `<p>Ja, auch als Bedrock-Spieler kannst du mitspielen, sofern du anderen Servern beitreten kannst.</p>`
+				},
+				{
+					title: 'Ich kann mich nicht anmelden, was kann ich tun?',
+					content: `<p>Wenn du dich nicht anmelden kannst, solltest du Folgendes überprüfen:</p>
+<ol class="list-decimal pl-8 py-3">
+<li>Ist dein Spielername korrekt geschrieben?</li>
+<li>Hast du dich bereits angemeldet? Es ist nur ein Account pro Spieler erlaubt.</li>
+<li>Hast du die richtige Spieledition ausgewählt?</li>
+</ol>
+<p>Falls du dich aus unerklärlichen Gründen trotzdem nicht anmelden kannst, kannst du
+dich jederzeit beim Admin-Team melden.</p>`
+				},
+				{
+					title: 'Ich komme nicht auf den Server, was kann ich tun?',
+					content: `<p>Wenn du dem Server nicht beitreten kannst, überprüfe Folgendes:</p>
+<ol class="list-decimal pl-8 py-3">
+<li>Hast du die korrekte IP verwendet? Sie lautet craftattack.mhsl.eu.</li>
+<li>Hast du Leerzeichen verwendet, insbesondere vor oder hinter der IP, oder dich vertippt?</li>
+<li>Kommst du auf andere Server, oder ist es nur ein Problem beim CraftAttack-Server?</li>
+<li>Hast du dich korrekt auf der Webseite angemeldet?</li>
+</ol>
+<p>Falls du trotzdem nicht beitreten kannst, melde dich beim Admin-Team und halte die
+Fehlermeldung bereit.</p>`
+				},
+				{
+					title: 'Was ist die Server-IP?',
+					content: `<p>Die Serveradresse lautet: <span class="underline italic">craftattack.mhsl.eu</span></p>`
+				},
+				{
+					title: 'Ist es kostenlos mitzuspielen?',
+					content: `<p>Ja, die Teilnahme ist selbstverständlich kostenlos. Wir freuen uns aber, wenn du das Projekt
+mit einer Spende nach der Anmeldung unterstützen würdest.<\br>
+Hier kannst du für das Projekt spenden: <a class="link" href=${data.paypal_link}>${data.paypal_link}</a></p>`
+				},
+				{
+					title:
+						'Die Anmeldefrist ist vorbei, aber ich möchte mich trotzdem noch anmelden. Was kann ich tun?',
+					content: `Generell solltest du dich immer während des Anmeldezeitraums anmelden. Falls die
+Anmeldung allerdings bereits geschlossen ist, kannst du einen Admin kontaktieren, der dich
+im Fall der Fälle noch nachträglich anmelden kann.`
+				},
+				{
+					title: 'Ist ein 2. Account erlaubt?',
+					content: `<p>Nein, pro Teilnehmer ist nur ein Account zugelassen.</p>`
+				}
+			]
+		},
+		{
+			section: 'Anderes',
+			questions: [
+				{
+					title: 'Wie kann ich einen Admin kontaktieren?',
+					content: `<p>Einen Admin kannst du im Chat, über WhatsApp, per Teamspeak (<span class="underline italic">mhsl.eu</span>) oder Discord kontaktieren.</p>`
+				},
+				{
+					title: 'Wer ist eigentlich Organisator und warum?',
+					content: `<p>Wir sind ein kleines Team von Minecraft-Enthusiasten, das bereits im siebten Jahr in Folge
+Minecraft CraftAttack organisiert. Jedes Jahr arbeiten wir daran, das Spielerlebnis zu
+verbessern und die Teilnehmerzahl zu steigern. Weitere Infos findest du auf der Teamseite.</p>`
+				},
+				{
+					title: 'Wie lange bleibt der Server online?',
+					content: `<p>Der Server wird traditionell so lange online bleiben, wie noch aktiv darauf gespielt wird.</p>`
+				},
+				{
+					title: 'Warum benötigt ihr meine Daten bei der Anmeldung?',
+					content: `<p>Deine Daten werden nur intern gespeichert und dienen den Admins rein zur Organisation
+des Projekts.</p>`
+				},
+				{
+					title: 'Gibt es einen Teamspeak-Server?',
+					content: `<p>Ja, den offiziellen Teamspeak-Server erreichst du unter der IP <span class="underline italic">mhsl.eu</span>.</p>`
+				},
+				{
+					title: 'Wozu dient die CraftAttack-WhatsApp-Gruppe?',
+					content: `<p>In der WhatsApp-Gruppe erhältst du alle wichtigen Infos bezüglich CraftAttack.</p>`
+				}
+			]
+		},
+		{
+			section: 'Ingame',
+			questions: [
+				{
+					title: 'Wo kann ich meinen Shop errichten?',
+					content: `<p>Generell darfst du Shops überall errichten, aber es bietet sich an, alle Shops in einem
+Shopping-District nahe des Spawns anzusiedeln.</p>`
+				},
+				{
+					title: 'Sind Farmen erlaubt?',
+					content: `<p>Ja, Farmen sind generell erlaubt. Allerdings sind lag-erzeugende Maschinen, Farmen (Zero-
+Tick-Farmen etc.) oder andere Bauten, die den Spielfluss stören könnten, verboten.</p>`
+				},
+				{
+					title: 'Was und wann sind Events?',
+					content: `<p>Abends, meist gegen 18 Uhr, finden gelegentlich Events statt, bei denen du Items gewinnen
+kannst und in kleinen Minispielen gegen deine Mitspieler antrittst. Die genauen Abläufe
+siehst du, wenn du abends auf dem Server bist.</p>`
+				},
+				{
+					title: 'Wo und wie kann ich einen Regelverstoß melden?',
+					content: `<p>Wenn du einen Regelverstoß melden willst, kannst du ingame den Befehl /report nutzen, um
+einen Admin zu kontaktieren.</p>`
+				},
+				{
+					title: 'Was hat es mit dem Blutmond auf sich?',
+					content: `<p>Alle dreißig ingame-Tage solltest du nachts auf der Hut sein, denn die Monster sind in dieser
+Nacht deutlich stärker als üblich, droppen aber auch besseren Loot.</p>`
+				},
+				{
+					title: 'Was hat es mit dem Vogelfrei-Modus auf sich?',
+					content: `CraftAttack ist grundsätzlich ein friedliches Projekt. Falls du jedoch kein Problem damit hast,
+angegriffen zu werden, kannst du dich mit /vogelfrei in den Vogelfrei-Modus setzen.
+Dadurch sehen andere Spieler, dass du für einen Kampf offen bist. Der Vogelfrei-Modus kann
+allerdings erst nach einigen Stunden wieder beendet werden.`
+				},
+				{
+					title: 'Was hat es mit dem Rang „Langzeitspieler“ auf sich?',
+					content: `Spieler, die seit über drei Jahren am Projekt teilnehmen, erhalten den Langzeitrang. Dieser
+wirkt sich allerdings nicht auf das Spielgeschehen aus.`
+				},
+				{
+					title: 'Was gibt es für neue coole Features?',
+					content: `<ul class="list-disc pl-8">
+<li>Miniböcke, die du selbst gestalten kannst</li>
+<li>Neue Event-Spiele</li>
+<li>Einige Quality-of-Life-Features, die du mit <code>/settings</code> erreichst</li>
+<li>Langzeitrang</li>
+</ul>`
+				},
+				{
+					title: 'Wann wird das End geöffnet?',
+					content: `<p>Das End wird gemeinsam am <span class="underline">03.01.2025</span> um <span class="underline">19:00 Uhr</span> geöffnet, und wir besiegen
+gemeinsam den Enderdrachen.</p>`
+				},
+				{
+					title: 'Darf ich andere Spieler töten?',
+					content: `<p>Andere Spieler zu töten ist generell verboten. Wenn es jedoch nur zum Spaß und mit dem
+anderen Spieler abgesprochen ist, haben wir nichts dagegen einzuwenden. Außerdem ist es
+erlaubt, vogelfreie Spieler zu töten.</p>`
+				},
+				{
+					title: 'Welche Minecraft-Clients sind erlaubt?',
+					content: `<p>Jegliche Clientmodifikationen, die deutliche Vorteile gegenüber anderen Spielern bringen,
+sind nicht gestattet.</p>`
+				}
+			]
+		}
+	];
+</script>
+
+<h1 class="text-3xl lg:text-5xl mb-16 text-center">FAQ</h1>
+<div class="flex flex-row gap-10">
+	{#each faq as questions}
+		<div>
+			<h2 class="text-4xl text-center mb-3">{questions.section}</h2>
+			<div>
+				{#each questions.questions as question}
+					<div class="collapse collapse-arrow">
+						<input type="checkbox" autocomplete="off" />
+						<div class="collapse-title">{question.title}</div>
+						<div class="collapse-content">
+							<div class="ml-2">{@html question.content}</div>
+						</div>
+					</div>
+					<span class="block w-full h-[1px] mx-auto mb-1 bg-gray-600" />
+				{/each}
+			</div>
+		</div>
+	{/each}
+</div>

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,78 @@
+<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>

svelte.config.js

@@ -1,16 +1,11 @@
 import adapter from '@sveltejs/adapter-node';
-import preprocess from 'svelte-preprocess';
+import { sveltePreprocess } from 'svelte-preprocess';
 
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
-	// Consult https://kit.svelte.dev/docs/integrations#preprocessors
-	// for more information about preprocessors
-	preprocess: preprocess(),
+	preprocess: sveltePreprocess(),
 
 	kit: {
-		// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
-		// If your environment is not supported or you settled on a specific environment, switch out the adapter.
-		// See https://kit.svelte.dev/docs/adapters for more information about adapters.
 		adapter: adapter(),
 		csrf: {
 			checkOrigin: false

tailwind.config.js

@@ -1,3 +1,5 @@
+import daisyui from 'daisyui';
+
 /** @type {import('tailwindcss').Config} */
 export default {
 	content: ['./src/**/*.{html,js,svelte,ts}'],
@@ -9,7 +11,7 @@ export default {
 			roboto: ['Roboto']
 		}
 	},
-	plugins: [require('daisyui')],
+	plugins: [daisyui],
 
 	daisyui: {
 		logs: false