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

service responsive

Browse Source
This commit is contained in:
hamid zarghami
2025-01-19 11:09:48 +03:30
parent acc28d483c
commit bc6a10d585
3 changed files with 52 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/service/components/ServiceHeader.tsx
+29 -9
View File
@@ -11,20 +11,20 @@ const ServiceHeader: FC = () => {
const [planSelected, setPlanSelected] = useState<'year' | '3month' | 'month'>('year')
return (
<div className='w-full p-6 bg-white rounded-3xl flex justify-between'>
<div className='flex gap-8'>
<div className='size-[70px] bg-blue-400 rounded-xl'></div>
<div className='w-full p-6 bg-white rounded-3xl flex xl:flex-row flex-col xl:justify-between'>
<div className='flex xl:gap-8 gap-4'>
<div className='xl:size-[70px] size-[50px] bg-blue-400 rounded-xl'></div>
<div>
<div>
دی منو
</div>
<div className='text-xs mt-3 text-[#4E505A]'>
<div className='text-xs xl:mt-3 mt-1.5 text-[#4E505A]'>
منوی رستوران
</div>
<p className='text-description mt-1 text-[11px]'>
دی منو، راهی ساده و هوشمند برای مدیریت منو شما!
</p>
<div className='flex gap-5 mt-5'>
<div className='hidden xl:flex gap-5 mt-5'>
<RadioGroup
items={[
{
@@ -47,14 +47,34 @@ const ServiceHeader: FC = () => {
</div>
</div>
<div className='flex flex-col justify-between items-end'>
<div className='size-9 bg-description rounded-xl flex justify-center items-center'>
<div className='flex flex-col justify-between xl:items-end'>
<div className='xl:hidden flex gap-5 mt-5'>
<RadioGroup
items={[
{
label: t('service.year'),
value: 'year'
},
{
label: t('service.month3'),
value: '3month'
},
{
label: t('service.month'),
value: 'month'
}
]}
onChange={setPlanSelected}
selected={planSelected}
/>
</div>
<div className='size-9 hidden bg-description rounded-xl xl:flex justify-center items-center'>
<img src={ShareIcon} className='w-4' />
</div>
<div className='flex gap-4 items-center'>
<div className='flex gap-4 mt-5 xl:mt-0 items-center justify-between xl:justify-normal'>
<div className='text-xs whitespace-nowrap'>2,000,000 تومان {t('service.year')}</div>
<Button
className='bg-description text-xs h-8 bg-opacity-20 text-black px-4'
className='bg-description xl:max-w-full max-w-[100px] text-xs h-8 bg-opacity-20 text-black px-4'
>
<div className='flex gap-1 items-center'>
<div>