72 lines
2.5 KiB
TypeScript
72 lines
2.5 KiB
TypeScript
import { useRouter } from "next/router";
|
|
import { useEffect } from "react";
|
|
import { FaArrowLeft } from "react-icons/fa";
|
|
import { FcGoogle } from "react-icons/fc";
|
|
import MainLogo from "../../components/MainLogo";
|
|
import { useAuth } from "../../contexts/authContext";
|
|
|
|
export default function Login() {
|
|
const { currUser, signInGoogle } = useAuth();
|
|
const router = useRouter();
|
|
|
|
useEffect(() => {
|
|
// if auth, go to dashboard
|
|
if (currUser) {
|
|
console.log("already logged in, redirecting to router");
|
|
router.push("/teams");
|
|
}
|
|
}, [currUser]);
|
|
|
|
return (
|
|
<>
|
|
<div className="h-screen w-screen flex flex-row">
|
|
{/* signin modal */}
|
|
<div className="flex-1 bg-white bg-opacity-80 p-10 rounded-lg shadow-lg flex flex-col items-start justify-start">
|
|
{/* header */}
|
|
<div className="text-lg flex flex-row items-center space-x-2">
|
|
<FaArrowLeft
|
|
className="hover:cursor-pointer"
|
|
onClick={() => window.open("/", "_self")}
|
|
/>{" "}
|
|
</div>
|
|
|
|
<div className="mx-auto my-auto flex flex-col items-center">
|
|
<button
|
|
onClick={signInGoogle}
|
|
className=" text-md text-sky-500 py-2 px-5 border border-gray-200 transition-all hover:bg-gray-200 rounded flex flex-row items-center space-x-2"
|
|
>
|
|
<FcGoogle className="text-lg" />
|
|
<span>Continue with Google</span>
|
|
</button>
|
|
<span className="text-xs text-center mt-2 text-gray-300">
|
|
By continuing, you are agreeing <br></br>
|
|
to the{" "}
|
|
<a href="https://docs.google.com/document/d/1NRWN-6kDyOcADaUAQ-YWVHnz6i9ccGJ3/edit?usp=sharing&ouid=113470786690353109086&rtpof=true&sd=true">
|
|
terms and conditions
|
|
</a>{" "}
|
|
and{" "}
|
|
<a href="https://docs.google.com/document/d/1S3JsGqXgkriAsBOybXpVR0JJ4hiRkaNt/edit?usp=sharing&ouid=113470786690353109086&rtpof=true&sd=true">
|
|
privacy policy.
|
|
</a>
|
|
</span>
|
|
</div>
|
|
|
|
<span className="mx-auto flex items-center space-x-1">
|
|
<span>©</span>
|
|
<MainLogo className=" text-2xl" />
|
|
</span>
|
|
</div>
|
|
{/* nice image on right side */}
|
|
<div
|
|
className="hidden md:block landing-page-bg bg-cover bg-no-repeat bg-center flex-1"
|
|
style={
|
|
{
|
|
// background: "url('/wallpapers/superhuman.jpg')",
|
|
}
|
|
}
|
|
></div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|