TurTaskProject/TurTaskWeb
1
0
Fork 0
mirror of https://github.com/TurTaskProject/TurTaskWeb.git synced 2025-12-20 06:24:07 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add nav to signup

Browse Source
This commit is contained in:
sosokker 2023-11-23 05:01:41 +07:00
parent 91aac3dec6
commit 5c19933c44
1 changed files with 67 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
frontend/src/components/authentication/SignUpPage.jsx
View File

@ -1,24 +1,9 @@
import React, { useState } from "react"; import { useState } from "react";
import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
import axiosapi from "../../api/AuthenticationApi"; import axiosapi from "../../api/AuthenticationApi";
import { FcGoogle } from "react-icons/fc"; import { FcGoogle } from "react-icons/fc";
import { useGoogleLogin } from "@react-oauth/google"; import { useGoogleLogin } from "@react-oauth/google";
import { NavPreLogin } from "../navigations/NavPreLogin";
function Copyright(props) {
return (
<div className="text-center text-sm text-gray-500" {...props}>
{"Copyright © "}
<a
href="https://github.com/TurTaskProject/TurTaskWeb"
className="text-blue-500 hover:underline"
>
TurTask
</a>{" "}
{new Date().getFullYear()}
{"."}
</div>
);
}
export default function SignUp() { export default function SignUp() {
const Navigate = useNavigate(); const Navigate = useNavigate();
@ -50,10 +35,7 @@ export default function SignUp() {
const handleChange = (e) => { const handleChange = (e) => {
const { name, value } = e.target; const { name, value } = e.target;
setFormData({ ...formData, [name]: value }); setFormData({ ...formData, [name]: value });
console.log(formData);
}; };
{
}
const googleLoginImplicit = useGoogleLogin({ const googleLoginImplicit = useGoogleLogin({
flow: "auth-code", flow: "auth-code",
@ -78,11 +60,10 @@ export default function SignUp() {
}); });
return ( return (
<div>
<NavPreLogin text="Already have account?" btn_text="Log In" link="/login" />
<div className="h-screen flex items-center justify-center bg-gradient-to-r from-zinc-100 via-gray-200 to-zinc-100"> <div className="h-screen flex items-center justify-center bg-gradient-to-r from-zinc-100 via-gray-200 to-zinc-100">
<div <div aria-hidden="true" className="absolute inset-0 grid grid-cols-2 -space-x-52 opacity-40">
aria-hidden="true"
className="absolute inset-0 grid grid-cols-2 -space-x-52 opacity-40"
>
<div className="blur-[106px] h-56 bg-gradient-to-br from-primary to-purple-400"></div> <div className="blur-[106px] h-56 bg-gradient-to-br from-primary to-purple-400"></div>
<div className="blur-[106px] h-32 bg-gradient-to-r from-cyan-400 to-sky-300"></div> <div className="blur-[106px] h-32 bg-gradient-to-r from-cyan-400 to-sky-300"></div>
</div> </div>
@ -97,13 +78,7 @@ export default function SignUp() {
Email<span className="text-red-500 text-bold">*</span> Email<span className="text-red-500 text-bold">*</span>
</p> </p>
</label> </label>
<input <input className="input" type="email" id="email" placeholder="Enter your email" onChange={handleChange} />
className="input"
type="email"
id="email"
placeholder="Enter your email"
onChange={handleChange}
/>
</div> </div>
{/* Username Input */} {/* Username Input */}
<div className="form-control"> <div className="form-control">
@ -143,10 +118,7 @@ export default function SignUp() {
</button> </button>
<div className="divider">OR</div> <div className="divider">OR</div>
{/* Login with Google Button */} {/* Login with Google Button */}
<button <button className="btn btn-outline btn-secondary w-full " onClick={() => googleLoginImplicit()}>
className="btn btn-outline btn-secondary w-full "
onClick={() => googleLoginImplicit()}
>
<FcGoogle className="rounded-full bg-white" /> <FcGoogle className="rounded-full bg-white" />
Login with Google Login with Google
</button> </button>
@ -154,7 +126,7 @@ export default function SignUp() {
<div className="text-blue-500 flex justify-center text-sm"> <div className="text-blue-500 flex justify-center text-sm">
<a href="login">Already have an account?</a> <a href="login">Already have an account?</a>
</div> </div>
<Copyright /> </div>
</div> </div>
</div> </div>
</div> </div>