hamid zarghami
84 lines
3.6 KiB
TypeScript
84 lines
3.6 KiB
TypeScript
import { type FC } from 'react'
|
|
import Stats from './components/Stats'
|
|
import Services from './components/Services'
|
|
import Orders from './components/Orders'
|
|
import NewOrderImage from '@/assets/images/new_order.png'
|
|
import { t } from '@/locale'
|
|
import Button from '@/components/Button'
|
|
import { AddSquare, MessageQuestion } from 'iconsax-react'
|
|
import { COLORS } from '@/constants/colors'
|
|
import SupportImage from '@/assets/images/support1.png'
|
|
import { Paths } from '@/config/Paths'
|
|
import { Link } from 'react-router-dom'
|
|
|
|
const Home: FC = () => {
|
|
return (
|
|
<div className='flex gap-6'>
|
|
<div className='flex-1'>
|
|
<Stats />
|
|
<Services />
|
|
<Orders />
|
|
</div>
|
|
<div className='min-w-[267px] mt-5'>
|
|
<div className='bg-white rounded-3xl p-6'>
|
|
<img src={NewOrderImage} className='w-[98px] mx-auto' />
|
|
<h4 className='mt-4 text-center font-medium'>
|
|
{t('home.submitNewOrder')}
|
|
</h4>
|
|
<Link to={Paths.newOrder}>
|
|
<Button
|
|
className='mt-2.5'>
|
|
<div className='flex gap-1'>
|
|
<AddSquare size={20} color='#292D32' />
|
|
<div className=''>{t('home.submitNewOrderButton')}</div>
|
|
</div>
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
|
|
<div className='mt-7 bg-white rounded-3xl p-6 relative'>
|
|
<h4>
|
|
{t('home.specialSolution')}
|
|
</h4>
|
|
<p className='mt-2 text-[#7B7E8B] text-xs'>
|
|
{t('home.specialSolutionDescription')}
|
|
</p>
|
|
|
|
<div className='mt-2 flex flex-col gap-2'>
|
|
<div className='flex gap-2 items-center text-xs'>
|
|
<div className='size-1.5 rounded-full bg-primary'></div>
|
|
<div>{t('home.specialSolutionFeature1')}</div>
|
|
</div>
|
|
<div className='flex gap-2 items-center text-xs'>
|
|
<div className='size-1.5 rounded-full bg-primary'></div>
|
|
<div>{t('home.specialSolutionFeature2')}</div>
|
|
</div>
|
|
<div className='flex gap-2 items-center text-xs'>
|
|
<div className='size-1.5 rounded-full bg-primary'></div>
|
|
<div>{t('home.specialSolutionFeature3')}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<Button
|
|
label={t('home.freeConsultation')}
|
|
className='mt-12'
|
|
/>
|
|
|
|
<div className='mt-2.5 bg-primary/11 py-6 px-4 rounded-[13px]'>
|
|
<div className='flex justify-between items-center'>
|
|
<div className='flex gap-2 items-center'>
|
|
<MessageQuestion size={20} color={COLORS.primary} />
|
|
<div className='text-xs font-light'>{t('home.contactUs')}</div>
|
|
</div>
|
|
<div>{t('home.phoneNumber')}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<img src={SupportImage} className='w-[50px] absolute bottom-[159px] left-2' />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Home |