show rules modal when clicking on rules link on register page

src/lib/components/Countdown/Countdown.svelte

@@ -26,7 +26,7 @@
 	onDestroy(() => clearInterval(intervalId));
 </script>
 
-<div class="grid grid-flow-col gap-5 text-center auto-cols-max text-white">
+<div class="grid grid-flow-col gap-5 text-center auto-cols-max text-black dark:text-white">
 	<div class="flex flex-col p-2 bg-gray-200 rounded-box bg-opacity-5 backdrop-blur-sm">
 		<span class="countdown font-mono text-3xl sm:text-6xl">
 			<span class="m-auto" style="--value:{days};" />

src/routes/+layout.svelte

@@ -74,7 +74,7 @@
 />
 
 <main>
-	<div class="h-screen w-full">
+	<div class="min-h-screen w-full">
 		<slot />
 	</div>
 </main>

src/routes/+page.svelte

@@ -28,17 +28,17 @@
 	<title>Craftattack</title>
 </svelte:head>
 
-<div class="flex flex-col min-h-screen h-screen relative">
+<div class="flex flex-col min-h-screen relative">
-	<div class="sm:absolute top-0 left-0 flex items-center xl:w-1/2 px-6 sm:px-10 h-full">
+	<div class="flex items-center xl:w-1/2 px-6 sm:px-10 min-h-screen h-full">
-		<div class="flex flex-col items-center xl:items-start w-full xl:h-3/4">
+		<div class="flex flex-col items-center xl:items-start w-full xl:h-3/4 my-10">
 			<img src="{env.PUBLIC_BASE_PATH}/img/craftattack.webp" alt="Craftattack 6" />
-			<div class="flex flex-col justify-around w-full lg:w-10/12 h-full">
+			<div class="flex flex-col gap-5 lg:gap-14 w-full mt-2 lg:mt-5 lg:w-10/12 h-full">
 				<div>
 					<div class="divider" />
 					<div class="flex flex-col md:flex-row xl:flex-col gap-5">
 						{#each information as info}
 							<div>
-								<h4 class="text-white mb-1">{info.title}</h4>
+								<h4 class="text-black dark:text-white mb-1">{info.title}</h4>
 								<p>{info.description}</p>
 							</div>
 						{/each}
@@ -67,7 +67,7 @@
 <div class="flex justify-center py-20 bg-base-200">
 	<div class="card bg-base-100 shadow-lg w-11/12 xl:w-5/12 p-10">
 		<div>
-			<h2 class="text-3xl text-white mb-8">Über uns</h2>
+			<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

src/routes/register/Register.svelte

@@ -170,8 +170,12 @@
 				bind:inputElement={rulesInput}
 			/>
 			<label for="rules">
-				Ich bin mit den <a target="_blank" class="link" href="{env.PUBLIC_BASE_PATH}/rules"
+				Ich bin mit den <button
-					>Regeln</a
+					class="link"
+					on:click|preventDefault={() => {
+						rulesModal.show();
+						rulesModalTimer = setInterval(() => rulesModalSecondsOpened++, 1000);
+					}}>Regeln</button
 				>
 				einverstanden und achte sie
 				<span class="text-red-700">*</span>