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

Modifying signup page.

Browse Source
This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2023-11-19 20:06:04 +07:00
parent 5d86550382
commit 61a11d51d5
1 changed files with 28 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,16 +1,11 @@
import React, { useState } from "react"; import React, { 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 Avatar from "@mui/material/Avatar";
import Button from "@mui/material/Button"; import Button from "@mui/material/Button";
import CssBaseline from "@mui/material/CssBaseline";
import TextField from "@mui/material/TextField"; import TextField from "@mui/material/TextField";
import FormControlLabel from "@mui/material/FormControlLabel"; import FormControlLabel from "@mui/material/FormControlLabel";
import Checkbox from "@mui/material/Checkbox"; import Checkbox from "@mui/material/Checkbox";
import Link from "@mui/material/Link"; import Link from "@mui/material/Link";
import Grid from "@mui/material/Grid";
import Box from "@mui/material/Box";
import LockOutlinedIcon from "@mui/icons-material/LockOutlined";
import Typography from "@mui/material/Typography"; import Typography from "@mui/material/Typography";
import { useCallback } from "react"; import { useCallback } from "react";
import Particles from "react-tsparticles"; import Particles from "react-tsparticles";
@ -18,18 +13,20 @@ import { loadFull } from "tsparticles";
function Copyright(props) { function Copyright(props) {
return ( return (
<Typography variant="body2" color="text.secondary" align="center" {...props}> <div className="text-center text-sm text-gray-500" {...props}>
{"Copyright © "} {"Copyright © "}
<Link color="inherit" href="https://github.com/TurTaskProject/TurTaskWeb"> <a
href="https://github.com/TurTaskProject/TurTaskWeb"
className="text-blue-500 hover:underline"
>
TurTask TurTask
</Link>{" "} </a>{" "}
{new Date().getFullYear()} {new Date().getFullYear()}
{"."} {"."}
</Typography> </div>
); );
} }
export default function SignUp() { export default function SignUp() {
const Navigate = useNavigate(); const Navigate = useNavigate();
@ -41,7 +38,7 @@ export default function SignUp() {
const [error, setError] = useState(null); const [error, setError] = useState(null);
const [isSubmitting, setIsSubmitting] = useState(false); const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = async e => { const handleSubmit = async (e) => {
e.preventDefault(); e.preventDefault();
setIsSubmitting(true); setIsSubmitting(true);
setError(null); setError(null);
@ -57,7 +54,7 @@ export default function SignUp() {
Navigate("/login"); Navigate("/login");
}; };
const handleChange = e => { const handleChange = (e) => {
const { name, value } = e.target; const { name, value } = e.target;
setFormData({ ...formData, [name]: value }); setFormData({ ...formData, [name]: value });
}; };
@ -73,9 +70,11 @@ export default function SignUp() {
console.log(container); console.log(container);
}, []); }, []);
return ( return (
<div data-theme="night" className="h-screen flex items-center justify-center"> <div
data-theme="night"
className="h-screen flex items-center justify-center"
>
{/* Particles Container */} {/* Particles Container */}
<div style={{ width: "0%", height: "100vh" }}> <div style={{ width: "0%", height: "100vh" }}>
<Particles <Particles
@ -149,12 +148,10 @@ export default function SignUp() {
}} }}
/> />
</div> </div>
<div className="w-1/4 flex items-center justify-center"> <div className="w-1/4 h-1 flex items-center justify-center">
<div className="w-96 bg-neutral rounded-lg p-8 shadow-md space-y-4 z-10"> <div className="w-96 bg-neutral rounded-lg p-8 shadow-md space-y-4 z-10">
{/* Register Form */} {/* Register Form */}
<Typography component="h1" variant="h5"> <h2 className="text-3xl font-bold text-center">Signup</h2>
Sign up
</Typography>
<form noValidate onSubmit={handleSubmit}> <form noValidate onSubmit={handleSubmit}>
<TextField <TextField
required required
@ -189,19 +186,24 @@ export default function SignUp() {
control={<Checkbox value="allowExtraEmails" color="primary" />} control={<Checkbox value="allowExtraEmails" color="primary" />}
label="I want to receive inspiration, marketing promotions and updates via email." label="I want to receive inspiration, marketing promotions and updates via email."
/> />
<Button type="submit" fullWidth variant="contained" sx={{ mt: 3, mb: 2 }}> <Button
type="submit"
fullWidth
variant="contained"
sx={{ mt: 3, mb: 2 }}
>
Sign Up Sign Up
</Button> </Button>
{/* Already have an account? */} {/* Already have an account? */}
<div className="justify-left"> <div className="text-blue-500 text-sm">
<a href="#" className="text-blue-500 text-sm text-left"> <a href="login" className="text-left">
Already have an account? Already have an account?
</a> </a>
</div> </div>
</form> </form>
<Copyright />
</div> </div>
</div> </div>
</div> </div>
); );
} }