diff --git a/src/routes/login/+page.server.ts b/src/routes/login/+page.server.ts
new file mode 100644
index 0000000..d1f78ac
--- /dev/null
+++ b/src/routes/login/+page.server.ts
@@ -0,0 +1,14 @@
+import { redirect } from '@sveltejs/kit';
+import type { PageServerLoad } from './$types';
+
+export const load: PageServerLoad = async ({ locals }) => {
+	const session = await locals.auth();
+
+	if (session?.user) {
+		redirect(308, '/dashboard');
+	}
+
+	return {
+		session: null
+	};
+};
diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte
index 0ae920c..3364a6f 100644
--- a/src/routes/login/+page.svelte
+++ b/src/routes/login/+page.svelte
@@ -2,42 +2,55 @@
 	import { signIn } from '@auth/sveltekit/client';
 	import { SignIn } from '@auth/sveltekit/components';
 	import { page } from '$app/state';
-	import { goto } from '$app/navigation';
 	import { DotLottieSvelte } from '@lottiefiles/dotlottie-svelte';
-
-	console.log(page.data.session);
-
-	if (page.data.session) {
-		goto('/dashboard');
-	}
 </script>
 
 <div
-	class="flex min-h-screen items-center justify-center bg-gradient-to-b from-surface-100 to-tertiary-100 dark:from-surface-700 dark:to-surface-900 px-4 py-6 sm:px-6 sm:py-8"
+	class="flex min-h-screen items-center justify-center bg-gradient-to-b from-surface-100 to-tertiary-100 px-4 py-6 sm:px-6 sm:py-8 dark:from-surface-700 dark:to-surface-900"
 >
-	<div class="card w-full max-w-xs sm:max-w-sm md:max-w-md lg:max-w-lg p-4 sm:p-6 md:p-8 lg:p-10 shadow-lg">
+	<div
+		class="card w-full max-w-xs p-4 shadow-lg sm:max-w-sm sm:p-6 md:max-w-md md:p-8 lg:max-w-lg lg:p-10"
+	>
 		<!-- Welcome and Animation -->
-		<header class="card-header mb-4 sm:mb-6 text-center">
-			<h1 class="text-xl sm:text-2xl font-bold">Welcome to Hungry Stack</h1>
-			<div class="w-full max-w-64 mx-auto">
+		<header class="card-header mb-4 text-center sm:mb-6">
+			<h1 class="text-xl font-bold sm:text-2xl">Welcome to Hungry Stack</h1>
+			<div class="mx-auto w-full max-w-64">
 				<DotLottieSvelte src="/animations/pancakes.lottie" loop={true} autoplay={true} />
 			</div>
 			<p class="text-sm sm:text-base">Sign in or sign up to continue learning!</p>
 		</header>
 
-		<section class="space-y-3 sm:space-y-4 text-center">
+		<section class="space-y-3 text-center sm:space-y-4">
 			<!-- Google Authentication - Using the SignIn component -->
 			<SignIn provider="google" callbackUrl="/dashboard">
-				<div slot="submitButton" class="btn flex justify-center items-center w-full bg-red-500 py-2 sm:py-3 text-white text-sm sm:text-base">
-					<span><img src="/images/google.svg" alt="Google" class="mr-2 sm:mr-3 h-5 w-5 sm:h-6 sm:w-6" /></span>
+				<div
+					slot="submitButton"
+					class="btn flex w-full items-center justify-center bg-red-500 py-2 text-sm text-white sm:py-3 sm:text-base"
+				>
+					<span
+						><img
+							src="/images/google.svg"
+							alt="Google"
+							class="mr-2 h-5 w-5 sm:mr-3 sm:h-6 sm:w-6"
+						/></span
+					>
 					<span>Continue with Google</span>
 				</div>
 			</SignIn>
 
 			<!-- GitHub Authentication - Using the SignIn component -->
 			<SignIn provider="github" callbackUrl="/dashboard">
-				<div slot="submitButton" class="btn flex justify-center items-center w-full bg-gray-800 py-2 sm:py-3 text-white text-sm sm:text-base">
-					<span><img src="/images/github.svg" alt="GitHub" class="mr-2 sm:mr-3 h-5 w-5 sm:h-6 sm:w-6" /></span>
+				<div
+					slot="submitButton"
+					class="btn flex w-full items-center justify-center bg-gray-800 py-2 text-sm text-white sm:py-3 sm:text-base"
+				>
+					<span
+						><img
+							src="/images/github.svg"
+							alt="GitHub"
+							class="mr-2 h-5 w-5 sm:mr-3 sm:h-6 sm:w-6"
+						/></span
+					>
 					<span>Continue with GitHub</span>
 				</div>
 			</SignIn>
@@ -50,4 +63,4 @@
 		width: 100% !important;
 		height: auto !important;
 	}
-</style>
\ No newline at end of file
+</style>