Login Page Style + Toast Notifications

apps/hub/app/(auth)/login/page.tsx

@@ -1,12 +1,24 @@
-import { Provider } from 'next-auth/providers/index';
-import { getProviders } from 'next-auth/react';
 import { Login } from './_components/Login';
 
 export default async () => {
   return (
-    <div className="mx-auto max-w-sm ">
-      <h1 className="text-5xl">Login</h1>
-      <Login />
-    </div>
-  );
+      <>
+        <div
+          className="hero min-h-screen"
+          style={{
+            backgroundImage:
+              'url(https://img.daisyui.com/images/stock/photo-1507358522600-9f71e620c44e.webp)',
+          }}
+        >
+          <div className="hero-overlay bg-opacity-60"></div>
+          <div className="hero-content text-neutral-content text-center ">
+            <div className="max-w-lg">
+              <div className="card bg-base-100 w-full min-w-[500px] shadow-2xl max-md:min-w-[400px]">
+                <Login />
+              </div>
+            </div>
+          </div>
+        </div>
+      </>
+    );
 };