Final_first_changes

This commit is contained in:
Hemant2335
2023-11-25 19:49:53 +05:30
parent 7c297f4764
commit e67d13e4a7
5 changed files with 165 additions and 16 deletions

View File

@@ -12,7 +12,9 @@ export default function ForgotPass() {
return (
<div className="z-30 flex h-full min-h-screen w-full items-center justify-center bg-[#1D1D1D]">
<div className=" flex flex-col items-center px-[5vw] md:w-fit md:p-0">
<img src={DocsGPT3} alt="Logo" className="h-[10vh]" />
<div className=" cursor-pointer" onClick={() => navigate('/')}>
<img src={DocsGPT3} alt="Logo" className="h-[10vh]" />
</div>
<div className="font-bold md:flex md:gap-2 ">
<h1 className="text-white">Log in to </h1>
<h1 className="bg-gradient-to-r from-[#56B3CB] via-[#CD2AA0] to-[#EA635C] bg-clip-text text-transparent">
@@ -38,7 +40,12 @@ export default function ForgotPass() {
// onChange={onchange}
/>
<button className="h-[7vh] rounded-lg bg-[#7D54D1] text-sm font-medium text-white">
<button
className="h-[7vh] rounded-lg bg-[#7D54D1] text-sm font-medium text-white hover:bg-[#8A62DC]"
onClick={() => {
navigate('/ResetPassword');
}}
>
Request password reset
</button>
</form>
@@ -46,7 +53,7 @@ export default function ForgotPass() {
<h2 className="gap-1 text-right text-[#5F5F5F] md:flex">
Don&apos;t have an account ?
<h2
className="text-center font-medium text-white hover:cursor-pointer"
className="text-center font-medium text-white hover:cursor-pointer hover:underline"
onClick={() => navigate('/register')}
>
Sign up

View File

@@ -1,10 +1,60 @@
import React from 'react';
import React, { useState } from 'react';
import DocsGPT3 from '../assets/cute_docsgpt3.svg';
import { useNavigate } from 'react-router-dom';
export default function Login() {
const [showalert, setshowalert] = useState<string>('');
const [email, setemail] = useState('');
const [password, setpassword] = useState('');
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
console.log('login');
//email validation
if (email.length === 0 || password.length === 0) {
if (password.length === 0) {
setshowalert('Password is required');
return;
} else {
setshowalert('Email is required');
}
return;
} else {
setshowalert('');
}
if (password.length === 0) {
setshowalert('Password is required');
return;
}
// const response = await fetch(`http://localhost:5000/api/auth/login`, {
// method: "POST",
// headers: {
// "Content-Type": "application/json",
// },
// body: JSON.stringify({
// Email: user.Email,
// Password: user.Password,
// }),
// });
// const json = await response.json();
// console.log(json);
// if (json.Check) {
// localStorage.setItem("token", json.authtoken);
// if (json?.status)
// {
// localStorage.setItem("isadmin" , true);
// }
// navigate("/");
// }
// else if (!json.Check)
// {
// alert("Invalid Login Credentials")
// console.log("Invalid Login Cred")
// }
alert('Login Successful ');
navigate('/');
};
const navigate = useNavigate();
@@ -12,7 +62,9 @@ export default function Login() {
return (
<div className="z-30 flex h-full min-h-screen w-full items-center justify-center bg-[#1D1D1D]">
<div className=" flex flex-col items-center md:w-fit">
<img src={DocsGPT3} alt="Logo" className="h-[10vh]" />
<div className=" cursor-pointer" onClick={() => navigate('/')}>
<img src={DocsGPT3} alt="Logo" className="h-[10vh]" />
</div>
<div className="font-bold md:flex md:gap-2">
<h1 className="text-white">Log in to </h1>
<h1 className="bg-gradient-to-r from-[#56B3CB] via-[#CD2AA0] to-[#EA635C] bg-clip-text text-transparent">
@@ -27,6 +79,9 @@ export default function Login() {
type="email"
name="Name"
placeholder="Email"
onChange={(e) => {
setemail(e.target.value);
}}
className="w-full rounded-lg border-none bg-[#2B2B2B] p-4 text-sm font-medium text-white focus:outline-none md:min-w-[25vw]"
// onChange={onchange}
/>
@@ -34,23 +89,29 @@ export default function Login() {
type="password"
name="Name"
placeholder="Password"
onChange={(e) => {
setpassword(e.target.value);
}}
className="w-full rounded-lg border-none bg-[#2B2B2B] p-4 text-sm font-medium text-white focus:outline-none md:min-w-[25vw]"
// onChange={onchange}
/>
<h2
className="text-right text-sm text-[#5F5F5F] hover:cursor-pointer"
className="text-right text-sm text-[#5F5F5F] hover:cursor-pointer hover:text-white"
onClick={() => navigate('/Forgot')}
>
Forgot your password?
</h2>
<button className="h-[7vh] rounded-lg bg-[#7D54D1] font-medium text-white">
<button className="h-[7vh] rounded-lg bg-[#7D54D1] font-medium text-white hover:bg-[#8A62DC]">
Log in
</button>
{showalert.length > 0 && (
<div className="text-red-500">{showalert}</div>
)}
<div className="flex w-full justify-center text-sm">
<h2 className="flex gap-1 text-right text-[#5F5F5F]">
Don&apos;t have an account ?
<h2
className="text-center font-medium text-white hover:cursor-pointer"
className="text-center font-medium text-white hover:cursor-pointer hover:underline"
onClick={() => navigate('/register')}
>
Sign up

View File

@@ -1,5 +1,63 @@
import React from 'react';
import DocsGPT3 from '../assets/cute_docsgpt3.svg';
import { useNavigate } from 'react-router-dom';
export default function ResetCode() {
return <div>ResetCode</div>;
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
console.log('login');
};
const navigate = useNavigate();
return (
<div className="z-30 flex h-full min-h-screen w-full items-center justify-center bg-[#1D1D1D]">
<div className=" flex flex-col items-center px-[5vw] md:w-fit md:p-0">
<div className=" cursor-pointer" onClick={() => navigate('/')}>
<img src={DocsGPT3} alt="Logo" className="h-[10vh]" />
</div>
<div className="font-bold md:flex md:gap-2 ">
<h1 className="text-white">Log in to </h1>
<h1 className="bg-gradient-to-r from-[#56B3CB] via-[#CD2AA0] to-[#EA635C] bg-clip-text text-transparent">
DocsGPT
</h1>
</div>
<form
onSubmit={handleSubmit}
className="flex w-full flex-col gap-[3vh] rounded-2xl border-2 border-[#383838] bg-[#222222] py-[2vh] px-[5vh] text-white md:w-fit"
>
<div>
<h1 className=" text-xl font-semibold md:max-w-[25vw]">
We&apos;ve sent you instructions to reset your password. Please
check your inbox.
</h1>
<p className="text-md text-[#888888] md:max-w-[25vw]">
If you haven&apos;t received an email in 5 minutes, check your
spam, resend, or try a different email.
</p>
</div>
<input
type="email"
name="Name"
placeholder="Email"
className="w-full rounded-lg border-none bg-[#2B2B2B] p-4 text-sm font-medium text-white focus:outline-none "
// onChange={onchange}
/>
<button className="h-[7vh] rounded-lg bg-[#7D54D1] text-sm font-medium text-white hover:bg-[#8A62DC]">
Request password reset
</button>
</form>
<div className="mt-[2vh] flex w-full justify-center text-sm">
<h2 className="gap-1 text-right text-[#5F5F5F] md:flex">
Don&apos;t have an account ?
<h2
className="text-center font-medium text-white hover:cursor-pointer hover:underline"
onClick={() => navigate('/register')}
>
Sign up
</h2>
</h2>
</div>
</div>
</div>
);
}

View File

@@ -5,7 +5,10 @@ import { useNavigate } from 'react-router-dom';
export default function Signup() {
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
console.log('login');
alert('Signup Successful ');
navigate('/login');
};
const navigate = useNavigate();
@@ -13,7 +16,9 @@ export default function Signup() {
return (
<div className="z-30 flex h-full min-h-screen w-full items-center justify-center bg-[#1D1D1D]">
<div className=" flex flex-col items-center md:w-fit">
<img src={DocsGPT3} alt="Logo" className="h-[10vh]" />
<div className=" cursor-pointer" onClick={() => navigate('/')}>
<img src={DocsGPT3} alt="Logo" className="h-[10vh]" />
</div>
<div className="font-bold md:flex md:gap-2">
<h1 className="text-white">Create</h1>
<h1 className="bg-gradient-to-r from-[#56B3CB] via-[#CD2AA0] to-[#EA635C] bg-clip-text text-transparent">
@@ -39,17 +44,17 @@ export default function Signup() {
className="w-full rounded-lg border-none bg-[#2B2B2B] p-4 text-sm font-medium text-white focus:outline-none md:min-w-[25vw]"
// onChange={onchange}
/>
<button className="h-[7vh] rounded-lg bg-[#7D54D1] font-medium text-white">
<button className="h-[7vh] rounded-lg bg-[#7D54D1] font-medium text-white hover:bg-[#8A62DC]">
Create Account
</button>
<div className="flex w-full justify-center text-sm">
<h2 className="flex gap-1 text-right text-[#5F5F5F]">
Already have an account ?
<h2
className="text-center font-medium text-white hover:cursor-pointer"
className="text-center font-medium text-white hover:cursor-pointer hover:underline"
onClick={() => navigate('/login')}
>
log in
Log in
</h2>
</h2>
</div>

View File

@@ -1,6 +1,7 @@
import { Fragment, useEffect, useRef, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import Hero from '../Hero';
import { useNavigate } from 'react-router-dom';
import { AppDispatch } from '../store';
import ConversationBubble from './ConversationBubble';
import {
@@ -115,6 +116,8 @@ export default function Conversation() {
document.execCommand('insertText', false, text);
};
const navigate = useNavigate();
return (
<div className="flex flex-col justify-center p-4 md:flex-row">
{queries.length > 0 && !hasScrolledToLast && (
@@ -152,8 +155,23 @@ export default function Conversation() {
{queries.length === 0 && (
<Hero className="mt-24 h-[100vh] md:mt-52"></Hero>
)}
<div className="relative bottom-0 flex w-10/12 flex-col items-end self-center bg-white pt-3 md:fixed md:w-[65%]">
<div className="flex h-full w-full">
<div className="mt-[1vh] flex w-full items-center justify-center gap-[1vh]">
<button
className="mr-4 flex items-center justify-center rounded-full bg-blue-1000 py-2 px-4 text-white hover:bg-blue-3000"
onClick={() => navigate('/register')}
>
Sign Up
</button>
<button
className="mr-4 flex items-center justify-center rounded-full bg-blue-1000 py-2 px-4 text-white hover:bg-blue-3000"
onClick={() => navigate('/login')}
>
Sign in
</button>
</div>
<div
id="inputbox"
ref={inputRef}