links and other responive

This commit is contained in:
hamid zarghami
2025-01-11 16:13:45 +03:30
parent 0da02d2f03
commit bccad50666
14 changed files with 202 additions and 167 deletions
+1 -2
View File
@@ -1,6 +1,5 @@
import { FC } from 'react'
import RobotImage from '../../assets/images/robot.jpeg'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import { useTranslation } from 'react-i18next'
import Button from '../../components/Button'
import Rate from 'rc-rate'
@@ -195,7 +194,7 @@ const DetailService: FC = () => {
</div>
</div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white h-fit hidden xl:block rounded-3xl overflow-hidden relative'>
<div className='bg-white w-sidebar h-fit hidden xl:block rounded-3xl overflow-hidden relative'>
<img
src={RobotImage}
className='w-full backdrop-blur-[100px] h-[550px] object-cover'
+31 -26
View File
@@ -1,5 +1,4 @@
import { FC } from 'react'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import { useTranslation } from 'react-i18next'
import Input from '../../components/Input'
import Select from '../../components/Select'
@@ -54,39 +53,45 @@ const MyServices: FC = () => {
</div>
</div>
</Link>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection
/>
<div className='mt-6 flex gap-1 items-center'>
<StatusCircle
color='#00BA4B'
<Link to={Pages.services.detail + '1'}>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection
/>
<div className='text-xs text-description'>1 {t('service.active_menu')}</div>
<div className='mt-6 flex gap-1 items-center'>
<StatusCircle
color='#00BA4B'
/>
<div className='text-xs text-description'>1 {t('service.active_menu')}</div>
</div>
</div>
</div>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection
/>
<div className='mt-6 flex gap-1 items-center'>
<StatusCircle
color='#00BA4B'
</Link>
<Link to={Pages.services.detail + '1'}>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection
/>
<div className='text-xs text-description'>1 {t('service.active_menu')}</div>
<div className='mt-6 flex gap-1 items-center'>
<StatusCircle
color='#00BA4B'
/>
<div className='text-xs text-description'>1 {t('service.active_menu')}</div>
</div>
</div>
</div>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection
/>
<div className='mt-6 flex gap-1 items-center'>
<StatusCircle
color='#00BA4B'
</Link>
<Link to={Pages.services.detail + '1'}>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection
/>
<div className='text-xs text-description'>1 {t('service.active_menu')}</div>
<div className='mt-6 flex gap-1 items-center'>
<StatusCircle
color='#00BA4B'
/>
<div className='text-xs text-description'>1 {t('service.active_menu')}</div>
</div>
</div>
</div>
</Link>
</div>
</div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white hidden xl:block rounded-3xl overflow-hidden relative'>
<div className='bg-white w-sidebar hidden xl:block rounded-3xl overflow-hidden relative'>
<img
src={BannerImage}
className='w-full backdrop-blur-[100px] h-[550px] object-cover'
+53 -42
View File
@@ -5,9 +5,10 @@ import BannerImage from '../../assets/images/banner2.jpeg'
import RobotImage from '../../assets/images/robot.jpeg'
import { ArrowLeft } from 'iconsax-react'
import TitleLine from '../../components/TitleLine'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import Button from '../../components/Button'
import ServiceSection from '../../components/ServiceSection'
import { Link } from 'react-router-dom'
import { Pages } from '../../config/Pages'
const OtherServices: FC = () => {
@@ -86,14 +87,16 @@ const OtherServices: FC = () => {
</div>
<div className='mt-4'>
<Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
<Link to={Pages.services.detail + '1'}>
<Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
</Link>
</div>
</div>
<div className='flex-1 min-w-[40%] xl:min-w-[30%] bg-white rounded-3xl xl:p-6 p-4'>
@@ -111,14 +114,16 @@ const OtherServices: FC = () => {
</div>
<div className='mt-4'>
<Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
<Link to={Pages.services.detail + '1'}>
<Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
</Link>
</div>
</div>
<div className='flex-1 min-w-[40%] xl:min-w-[30%] bg-white rounded-3xl xl:p-6 p-4'>
@@ -136,14 +141,16 @@ const OtherServices: FC = () => {
</div>
<div className='mt-4'>
<Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
<Link to={Pages.services.detail + '1'}>
<Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
</Link>
</div>
</div>
<div className='flex-1 min-w-[40%] xl:min-w-[30%] xl:p-6 p-4'></div>
@@ -159,14 +166,16 @@ const OtherServices: FC = () => {
<div className='flex justify-between items-center'>
<ServiceSection
/>
<Button
className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
<Link to={Pages.services.detail + '1'}>
<Button
className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
</Link>
</div>
</div>
@@ -174,14 +183,16 @@ const OtherServices: FC = () => {
<div className='flex justify-between items-center'>
<ServiceSection
/>
<Button
className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
<Link to={Pages.services.detail + '1'}>
<Button
className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl'
>
<div className='flex gap-2'>
<div>{t('service.buy')}</div>
<ArrowLeft color='black' size={16} />
</div>
</Button>
</Link>
</div>
</div>
@@ -193,7 +204,7 @@ const OtherServices: FC = () => {
</div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white h-fit hidden xl:block rounded-3xl overflow-hidden relative'>
<div className='bg-white w-sidebar h-fit hidden xl:block rounded-3xl overflow-hidden relative'>
<img
src={RobotImage}
className='w-full backdrop-blur-[100px] h-[550px] object-cover'