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 { CiLock } from "react-icons/ci";
import LinkButton from '../../common/components/links/Link';

function ResetPassword() {

  const [resetPassword, setResetPassword] = useState('')
  const [resetConfirmPassword, setResetConfirmPassword] = useState('')

  const handleResetPassword = (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 new password</p>
        </div>
        <div className='ml-11 mr-11'>
          <form>
            <div className='relative flex justify-between mb-5 flex-col'>
              <label htmlFor="inputs" className='input-field-label password'><span><CiLock className='iconForm' />Password</span></label>
              <InputField type='password' className='input-field-input-full' name='resetPassword' onChange={(e) => resetPassword(e.target.value)} />
            </div>
            <div className='relative flex justify-between mb-5 flex-col'>
              <label htmlFor="inputs" className='input-field-label password'><span><CiLock className='iconForm' />Confirm password</span></label>
              <InputField type='password' className='input-field-input-full' name='resetConfirmPassword' onChange={(e) => resetConfirmPassword(e.target.value)} />
            </div>
            <Button type='submit' className='btn mb-5' onClick={handleResetPassword}>Reset</Button>
            <div className='links flex items-center justify-between text-xs'>
              <LinkButton to='/login'>Back</LinkButton>
            </div>
          </form>
        </div>
      </div>
    </div>
  )
}

export default ResetPassword;