danak/shop-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

verify step

Browse Source
This commit is contained in:
hamid zarghami
2025-08-25 09:29:53 +03:30
parent 6e1ebdf023
commit 27aca422e9
1 changed files with 47 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/auth/page.tsx
+47 -19
View File
@@ -2,43 +2,71 @@
import { NextPage } from 'next' import { NextPage } from 'next'
import Image from 'next/image'; import Image from 'next/image';
import LoginStep1 from './components/LoginStep1'; import LoginStep1 from './components/LoginStep1';
import { useAuthStore } from './store/AuthStore';
import { Messages1 } from 'iconsax-react';
import { clx } from '@/helpers/utils';
const LoginPage: NextPage = () => { const LoginPage: NextPage = () => {
const { step, phone } = useAuthStore()
return ( return (
<div className='flex justify-center items-center h-screen'> <div className='flex justify-center items-center h-screen'>
<div className='h-[450px] w-[1000px] border border-border rounded-xl flex p-10 gap-32'> <div className='h-[450px] w-[1000px] border border-border rounded-xl flex p-10 gap-32'>
<div className='flex-1'> <div className='flex-1'>
<div className='text-primary'> <div className='text-primary'>
1/2 {step}/2
</div> </div>
<div className='w-full h-0.5 mt-4 flex items-center'> <div className='w-full h-0.5 mt-4 flex items-center'>
<div className='size-2 rounded-full bg-primary'></div> <div className='size-2 rounded-full bg-primary'></div>
<div className='w-1/2 h-full bg-primary'></div> <div className='w-1/2 h-full bg-primary'></div>
<div className='size-2 rounded-full bg-primary'></div> <div className='size-2 rounded-full bg-primary'></div>
<div className='w-1/2 h-full bg-primary/40'></div> <div className={clx(
<div className='size-2 rounded-full bg-primary/40'></div> 'w-1/2 h-full bg-primary/40',
step === 2 && 'bg-primary'
)}></div>
<div className={clx(
'size-2 rounded-full bg-primary/40',
step === 2 && 'bg-primary'
)}></div>
</div> </div>
<div className='mt-20 flex gap-6'> {
<Image step === 1 ?
src='/images/mobile.svg' <div className='mt-20 flex gap-6'>
width={80} <Image
height={131} src='/images/mobile.svg'
alt='phone' width={80}
/> height={131}
alt='phone'
/>
<div> <div>
<div className='text-[#8B8B8B] text-xl'>Wellcome</div> <div className='text-[#8B8B8B] text-xl'>Wellcome</div>
<div className='mt-2 font-black text-4xl text-[#4F4F4F]'> <div className='mt-2 font-black text-4xl text-[#4F4F4F]'>
خوش آمدید خوش آمدید
</div>
<p className='mt-4 text-[#8B8B8B] text-sm'>
برای دریافت کد فعالسازی شماره همراه یا ایمیل خود را وارد نمایید
</p>
</div>
</div> </div>
<p className='mt-4 text-[#8B8B8B] text-sm'> :
برای دریافت کد فعالسازی شماره همراه یا ایمیل خود را وارد نمایید <div className='mt-20 flex gap-6'>
</p> <Messages1 size={90} color='#CCCCCC' />
</div>
</div> <div>
<div className='text-[#8B8B8B] text-xl'>activation code</div>
<div className='mt-2 font-black text-4xl text-[#4F4F4F]'>
كد فعالسازی
</div>
<p className='mt-4 text-[#8B8B8B] text-sm'>
کد فعالسازی به شماره همراه {phone} ارسال شد
</p>
</div>
</div>
}
</div> </div>
<LoginStep1 /> <LoginStep1 />