login and register
This commit is contained in:
hamid zarghami
+1
-1
@@ -39,7 +39,7 @@ textarea::placeholder {
|
||||
min-height: 40px;
|
||||
border-radius: 12px !important;
|
||||
border: 1px solid #d0d0d0 !important;
|
||||
font-size: 14px !important;
|
||||
font-size: 12px !important;
|
||||
width: 100% !important;
|
||||
margin: 0px;
|
||||
padding-right: 16px !important;
|
||||
|
||||
+6
-1
@@ -19,6 +19,11 @@
|
||||
"enter_password": "رمز عبور انتخابی خود را وارد کنید",
|
||||
"next": "ادامه",
|
||||
"before_registered": "آیا قبلا ثبت نام کردید؟",
|
||||
"login": "ورود"
|
||||
"login": "ورود",
|
||||
"enter_info_login": "لطفا اطلاعات خود را وارد کنید.",
|
||||
"mobile_or_email": " شماره موبایل یا ایمیل",
|
||||
"enter_mobile_or_email": " شماره موبایل یا ایمیل خود را وارد کنید",
|
||||
"have_account": "آیا حساب کاربری ندارید؟",
|
||||
"register": "ثبت نام"
|
||||
}
|
||||
}
|
||||
|
||||
+35
-62
@@ -3,8 +3,9 @@ import LogoImage from '../../assets/images/logo.svg'
|
||||
import LogoSmallImage from '../../assets/images/logo-small.svg'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import Input from '../../components/Input'
|
||||
import DatePickerComponent from '../../components/DatePicker'
|
||||
import Button from '../../components/Button'
|
||||
import { Link } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
|
||||
const Login: FC = () => {
|
||||
|
||||
@@ -13,74 +14,46 @@ const Login: FC = () => {
|
||||
return (
|
||||
<div className='w-full h-full flex justify-center py-[75px] items-center px-10'>
|
||||
<div className='flex w-full max-h-[812px] max-w-[1200px] bg-secondary h-full rounded-3xl overflow-hidden'>
|
||||
<div className='flex-1 min-w-[50%] overflow-y-auto bg-white p-9'>
|
||||
<div className=''>
|
||||
<div className='flex-1 min-w-[50%] overflow-y-auto bg-white px-9 py-7'>
|
||||
<div className='flex-1 h-full flex flex-col'>
|
||||
<img src={LogoSmallImage} className='w-8' />
|
||||
<div className='mt-5'>
|
||||
<h2 className='text-2xl font-bold'>
|
||||
{t('auth.welcome')}
|
||||
</h2>
|
||||
<p className='text-description text-sm mt-2'>
|
||||
{t('auth.enter_information')}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* <div className='mt-5 text-sm'>
|
||||
{t('auth.user_info')}
|
||||
</div> */}
|
||||
<div className='flex flex-1 flex-col h-full justify-center'>
|
||||
<div className='mt-5'>
|
||||
<h2 className='text-2xl font-bold'>
|
||||
{t('auth.welcome')}
|
||||
</h2>
|
||||
<p className='text-description text-sm mt-2'>
|
||||
{t('auth.enter_info_login')}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className='mt-5 rowTwoInput'>
|
||||
<Input
|
||||
label={t('auth.name')}
|
||||
placeholder={t('auth.enter_name')}
|
||||
/>
|
||||
|
||||
<Input
|
||||
label={t('auth.family')}
|
||||
placeholder={t('auth.enter_family')}
|
||||
/>
|
||||
|
||||
</div>
|
||||
<div className='mt-4 min-w-full rowTwoInput'>
|
||||
<DatePickerComponent label={t('auth.dateofbirth')} onChange={(date: string) => console.log(date)} placeholder={t('auth.select_date')} />
|
||||
|
||||
<Input
|
||||
label={t('auth.national_code')}
|
||||
placeholder={t('auth.national_code_enter')}
|
||||
<div className='mt-16 rowTwoInput'>
|
||||
<Input
|
||||
label={t('auth.mobile_or_email')}
|
||||
placeholder={t('auth.enter_mobile_or_email')}
|
||||
type='tel'
|
||||
className='text-right'
|
||||
/>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<Button
|
||||
label={t('auth.next')}
|
||||
className='mt-8'
|
||||
/>
|
||||
|
||||
<div className='mt-6 flex justify-center gap-2 items-center text-sm'>
|
||||
<p className='text-description'>
|
||||
{t('auth.have_account')}
|
||||
</p>
|
||||
<Link to={Pages.auth.register}>
|
||||
<div>{t('auth.register')}</div>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-4 rowTwoInput'>
|
||||
<Input
|
||||
label={t('auth.email')}
|
||||
placeholder={t('auth.enter_email')}
|
||||
/>
|
||||
<Input
|
||||
label={t('auth.phonen_number')}
|
||||
placeholder={t('auth.enter_phone_number')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-4 rowTwoInput'>
|
||||
<Input
|
||||
label={t('auth.password')}
|
||||
placeholder={t('auth.enter_password')}
|
||||
type='password'
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Button
|
||||
label={t('auth.next')}
|
||||
className='mt-8'
|
||||
/>
|
||||
|
||||
<div className='mt-6 flex justify-center gap-2 items-center text-sm'>
|
||||
<p className='text-description'>
|
||||
{t('auth.before_registered')}
|
||||
</p>
|
||||
<div>{t('auth.login')}</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,8 +1,99 @@
|
||||
import { FC } from 'react'
|
||||
import LogoImage from '../../assets/images/logo.svg'
|
||||
import LogoSmallImage from '../../assets/images/logo-small.svg'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import Input from '../../components/Input'
|
||||
import DatePickerComponent from '../../components/DatePicker'
|
||||
import Button from '../../components/Button'
|
||||
import { Link } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
|
||||
const Register: FC = () => {
|
||||
|
||||
const { t } = useTranslation('global')
|
||||
|
||||
return (
|
||||
<div>Register</div>
|
||||
<div className='w-full h-full flex justify-center py-[75px] items-center px-10'>
|
||||
<div className='flex w-full max-h-[812px] max-w-[1200px] bg-secondary h-full rounded-3xl overflow-hidden'>
|
||||
<div className='flex-1 min-w-[50%] overflow-y-auto bg-white px-9 py-7'>
|
||||
<div className=''>
|
||||
<img src={LogoSmallImage} className='w-8' />
|
||||
<div className='mt-5'>
|
||||
<h2 className='text-2xl font-bold'>
|
||||
{t('auth.welcome')}
|
||||
</h2>
|
||||
<p className='text-description text-sm mt-2'>
|
||||
{t('auth.enter_information')}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* <div className='mt-5 text-sm'>
|
||||
{t('auth.user_info')}
|
||||
</div> */}
|
||||
|
||||
<div className='mt-5 rowTwoInput'>
|
||||
<Input
|
||||
label={t('auth.name')}
|
||||
placeholder={t('auth.enter_name')}
|
||||
/>
|
||||
|
||||
<Input
|
||||
label={t('auth.family')}
|
||||
placeholder={t('auth.enter_family')}
|
||||
/>
|
||||
|
||||
</div>
|
||||
<div className='mt-4 min-w-full rowTwoInput'>
|
||||
<DatePickerComponent label={t('auth.dateofbirth')} onChange={(date: string) => console.log(date)} placeholder={t('auth.select_date')} />
|
||||
|
||||
<Input
|
||||
label={t('auth.national_code')}
|
||||
placeholder={t('auth.national_code_enter')}
|
||||
/>
|
||||
|
||||
</div>
|
||||
|
||||
<div className='mt-4 rowTwoInput'>
|
||||
<Input
|
||||
label={t('auth.email')}
|
||||
placeholder={t('auth.enter_email')}
|
||||
/>
|
||||
<Input
|
||||
label={t('auth.phonen_number')}
|
||||
placeholder={t('auth.enter_phone_number')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-4 rowTwoInput'>
|
||||
<Input
|
||||
label={t('auth.password')}
|
||||
placeholder={t('auth.enter_password')}
|
||||
type='password'
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Button
|
||||
label={t('auth.next')}
|
||||
className='mt-8'
|
||||
/>
|
||||
|
||||
<div className='mt-6 flex justify-center gap-2 items-center text-sm'>
|
||||
<p className='text-description'>
|
||||
{t('auth.before_registered')}
|
||||
</p>
|
||||
<Link to={Pages.auth.login}>
|
||||
<div>{t('auth.login')}</div>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex-1 min-w-[50%] flex justify-center items-center'>
|
||||
<img src={LogoImage} className='h-20' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user