Untitled

import React, { useState } from 'react'
import '../../assets/styles/forgetPassword.css'
import '../../assets/styles/main.css'
import logoMobile from '../../assets/images/logoMobile.png';
import logo from '../../assets/images/logo.png';
import InputField from '../../common/components/inputs/InputField'
import Button from '../../common/components/buttons/Button';
import { MdOutlineMail } from "react-icons/md";
import LinkButton from '../../common/components/links/Link';

function ForgetPassword() {

  const [emailToChangePass, setEmailToChangePass] = useState('')

  const handleForgetPassword = (e) => {
    e.preventDefault()

  }

  return (
    <div className='content w-full h-screen flex justify-center items-center flex-col'>
      <div className='forgetPassword-shadow'></div>
      <div className='resetPassword flex justify-center items-center flex-col'>
        <img src={logo} alt="logo" className=' logoForgetPassword mb-5' />
        <img src={logoMobile} alt="logo" className=' logoMobile  mb-8' />
        <div className=' cardForgetPassword mb-10'>
          <h1>Welcom to reset password 👋</h1>
          <p>Enter your email here</p>
        </div>
        <div className='ml-11 mr-11'>
          <form>
            <div className='relative mb-5'>
              <label htmlFor="inputs" className='input-field-label email '><span><MdOutlineMail className='iconForm' />Email</span></label>
              <InputField type='email' className='input-field-input-full mb-5 ' name='emailToChangePass' onChange={(e) => emailToChangePass(e.target.value)} />
            </div>
            <Button type='submit' className='btn mb-5' onClick={handleForgetPassword}>Send</Button>
            <div className='links flex items-center justify-between text-xs'>
              <LinkButton to='/signup'>Dont have an account ?</LinkButton>
            </div>
          </form>
        </div>
      </div>
    </div>
  )
}

export default ForgetPassword;