initial commit

torpedo/app/auth/login/page.tsx

@@ -0,0 +1,62 @@
+"use client";
+
+import Image from "next/image";
+import React from "react";
+import { Inter } from "next/font/google";
+const inter = Inter({ subsets: ["latin"] });
+import { signIn } from "next-auth/react"; // Import signIn function
+
+import { Button } from "@/components/ui/button";
+import Link from "next/link";
+
+const page = () => {
+  return (
+    <main className="flex bg-[#151515] h-screen">
+      <section className="w-1/2 flex items-end overflow-hidden">
+        <Image
+          src="/image/splash.png"
+          alt="login splash"
+          width={1000}
+          height={1000}
+        />
+      </section>
+      <section className="w-1/2 text-white flex items-center justify-center">
+        <div className="h-[700px] w-[500px] flex flex-col justify-between">
+          <section>
+            <Link href="/">
+              <Image
+                src="/logo/logo-full.svg"
+                alt="logo"
+                width={200}
+                height={1000}
+              />
+            </Link>
+          </section>
+          <section className="flex flex-col justify-between h-1/3">
+            <div className="flex flex-col gap-2">
+              <h1
+                className={`text-white text-5xl ${inter.className} font-bold tracking-tighter`}
+              >
+                Hi There 👋
+              </h1>
+              <p className="text-xl tracking-tighter">
+                Login to your Google account.
+              </p>
+            </div>
+            <Button
+              className="bg-[#4285F4] h-[65px] text-lg tracking-tight"
+              onClick={() => signIn("google", { callbackUrl: "/dashboard" })}
+            >
+              Login with Google
+            </Button>
+          </section>
+          <section className="text-[#efefef]/50 tracking-tighter">
+            <p>&copy; 2024 Torpedo</p>
+          </section>
+        </div>
+      </section>
+    </main>
+  );
+};
+
+export default page;