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

links and other responive

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Tabs.tsx
+18 -6
View File
@@ -1,5 +1,6 @@
import { FC, ReactNode } from 'react' import { FC, ReactNode } from 'react'
import { clx } from '../helpers/utils' import { clx } from '../helpers/utils'
import { Swiper, SwiperSlide } from 'swiper/react'
type Item = { type Item = {
icon: ReactNode, icon: ReactNode,
@@ -14,24 +15,35 @@ type Props = {
} }
const Tabs: FC<Props> = (props: Props) => { const Tabs: FC<Props> = (props: Props) => {
const SWIPER_SLIDE_STYLE = {
overflow: 'visible !important',
display: 'flex',
}
return ( return (
<div className='px-10 w-fit items-center text-description mx-auto backdrop-blur-md border-2 border-white gap-10 flex h-[80px] rounded-[32px] bg-white bg-opacity-45'> <Swiper
slidesPerView='auto'
spaceBetween={30}
className='px-10 max-w-full w-fit items-center text-description mx-auto backdrop-blur-md border-2 border-white gap-10 flex h-[80px] rounded-[32px] bg-white bg-opacity-45'>
{ {
props.items.map((item: Item) => { props.items.map((item: Item, index: number) => {
return ( return (
<div onClick={() => props.onChange(item.value)} key={item.value} className={clx( <SwiperSlide style={SWIPER_SLIDE_STYLE} onClick={() => props.onChange(item.value)} key={item.value} className={clx(
'flex flex-col items-center gap-2 cursor-pointer', 'flex flex-col max-w-fit mt-[15px] items-center gap-2 cursor-pointer',
index === 0 && 'pr-[30px]',
index === props.items.length - 1 && 'pl-[30px]',
props.active === item.value && 'text-black' props.active === item.value && 'text-black'
)}> )}>
{item.icon} {item.icon}
<div className='text-xs'> <div className='text-xs'>
{item.label} {item.label}
</div> </div>
</div> </SwiperSlide>
) )
}) })
} }
</div> </Swiper>
) )
} }
src/pages/criticisms/Add.tsx
+1 -2
View File
@@ -1,6 +1,5 @@
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import Input from '../../components/Input' import Input from '../../components/Input'
import Textarea from '../../components/Textarea' import Textarea from '../../components/Textarea'
import UploadBox from '../../components/UploadBox' import UploadBox from '../../components/UploadBox'
@@ -56,7 +55,7 @@ const AddCriticisms: FC = () => {
</div> </div>
</div> </div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white hidden xl:block py-10 px-5 h-fit rounded-3xl'> <div className='bg-white w-sidebar hidden xl:block py-10 px-5 h-fit rounded-3xl'>
<div className='text-sm'> <div className='text-sm'>
{t('ticket.title_hint')} {t('ticket.title_hint')}
</div> </div>
src/pages/home/components/DanakLearning.tsx
+1 -2
View File
@@ -1,5 +1,4 @@
import { FC } from 'react' import { FC } from 'react'
import { SIDEBAR_SIZE_LEFT } from '../../../config/Const'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { ArrowLeft } from 'iconsax-react' import { ArrowLeft } from 'iconsax-react'
import CoverImage from '../../../assets/images/banner.png' import CoverImage from '../../../assets/images/banner.png'
@@ -9,7 +8,7 @@ const DanakLearning: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
return ( return (
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white text-xs hidden 2xl:block h-fit px-5 py-7 rounded-3xl'> <div className='bg-white w-sidebar text-xs hidden 2xl:block h-fit px-5 py-7 rounded-3xl'>
<div className='flex justify-between items-center'> <div className='flex justify-between items-center'>
<div> <div>
{t('home.danak_learning')} {t('home.danak_learning')}
src/pages/learning/List.tsx
+1 -2
View File
@@ -1,6 +1,5 @@
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import BannerImage from '../../assets/images/banner.png' import BannerImage from '../../assets/images/banner.png'
import Select from '../../components/Select' import Select from '../../components/Select'
import Input from '../../components/Input' import Input from '../../components/Input'
@@ -104,7 +103,7 @@ const LearningList: FC = () => {
<div className='h-14 xl:hidden'></div> <div className='h-14 xl:hidden'></div>
</div> </div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white hidden xl:block h-fit rounded-3xl overflow-hidden relative'> <div className='bg-white w-sidebar hidden xl:block h-fit rounded-3xl overflow-hidden relative'>
<img <img
src={BannerImage} src={BannerImage}
className='w-full backdrop-blur-[100px] h-[550px] object-cover' className='w-full backdrop-blur-[100px] h-[550px] object-cover'
src/pages/receipts/Detail.tsx
+5 -6
View File
@@ -1,6 +1,5 @@
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import { Edit } from 'iconsax-react' import { Edit } from 'iconsax-react'
import StatusCircle from '../../components/StatusCircle' import StatusCircle from '../../components/StatusCircle'
import SamanImage from '../../assets/images/saman.png' import SamanImage from '../../assets/images/saman.png'
@@ -16,7 +15,7 @@ const ReceiptsDetail: FC = () => {
۱۲۳۱۲ ۱۲۳۱۲
</div> </div>
<div className='flex mt-8 gap-6'> <div className='flex xl:flex-row flex-col mt-8 gap-6'>
<div className='flex-1'> <div className='flex-1'>
<div className='w-full bg-white rounded-3xl p-8'> <div className='w-full bg-white rounded-3xl p-8'>
<div className='flex justify-between items-center'> <div className='flex justify-between items-center'>
@@ -31,7 +30,7 @@ const ReceiptsDetail: FC = () => {
</div> </div>
</div> </div>
<div className='mt-8 flex gap-16 items-center text-xs'> <div className='mt-8 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
<div className='flex gap-2'> <div className='flex gap-2'>
<div className='text-description'> <div className='text-description'>
{t('receip.type_person')} {t('receip.type_person')}
@@ -68,7 +67,7 @@ const ReceiptsDetail: FC = () => {
</div> </div>
</div> </div>
<div className='mt-8 border-t pt-7 flex gap-16 items-center text-xs'> <div className='mt-8 border-t pt-7 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
<div className='flex gap-2'> <div className='flex gap-2'>
<div className='text-description'> <div className='text-description'>
{t('receip.tel_company')} {t('receip.tel_company')}
@@ -98,7 +97,7 @@ const ReceiptsDetail: FC = () => {
</div> </div>
<div className='mt-6 flex gap-16 items-center text-xs'> <div className='mt-6 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
<div className='flex gap-2'> <div className='flex gap-2'>
<div className='text-description'> <div className='text-description'>
{t('receip.state')} {t('receip.state')}
@@ -187,7 +186,7 @@ const ReceiptsDetail: FC = () => {
</div> </div>
</div> </div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white text-sm h-fit rounded-3xl p-8'> <div className='bg-white xl:w-sidebar text-sm h-fit rounded-3xl p-8'>
<div className='flex justify-between items-center'> <div className='flex justify-between items-center'>
<div> <div>
{t('receip.receip_information')} {t('receip.receip_information')}
src/pages/service/DetailService.tsx
+1 -2
View File
@@ -1,6 +1,5 @@
import { FC } from 'react' import { FC } from 'react'
import RobotImage from '../../assets/images/robot.jpeg' import RobotImage from '../../assets/images/robot.jpeg'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import Button from '../../components/Button' import Button from '../../components/Button'
import Rate from 'rc-rate' import Rate from 'rc-rate'
@@ -195,7 +194,7 @@ const DetailService: FC = () => {
</div> </div>
</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 <img
src={RobotImage} src={RobotImage}
className='w-full backdrop-blur-[100px] h-[550px] object-cover' className='w-full backdrop-blur-[100px] h-[550px] object-cover'
src/pages/service/MyServices.tsx
+7 -2
View File
@@ -1,5 +1,4 @@
import { FC } from 'react' import { FC } from 'react'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import Input from '../../components/Input' import Input from '../../components/Input'
import Select from '../../components/Select' import Select from '../../components/Select'
@@ -54,6 +53,7 @@ const MyServices: FC = () => {
</div> </div>
</div> </div>
</Link> </Link>
<Link to={Pages.services.detail + '1'}>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'> <div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection <ServiceSection
/> />
@@ -64,6 +64,8 @@ const MyServices: FC = () => {
<div className='text-xs text-description'>1 {t('service.active_menu')}</div> <div className='text-xs text-description'>1 {t('service.active_menu')}</div>
</div> </div>
</div> </div>
</Link>
<Link to={Pages.services.detail + '1'}>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'> <div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection <ServiceSection
/> />
@@ -74,6 +76,8 @@ const MyServices: FC = () => {
<div className='text-xs text-description'>1 {t('service.active_menu')}</div> <div className='text-xs text-description'>1 {t('service.active_menu')}</div>
</div> </div>
</div> </div>
</Link>
<Link to={Pages.services.detail + '1'}>
<div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'> <div className='flex-1 min-w-[40%] xl:min-w-[20%] bg-white rounded-3xl p-6'>
<ServiceSection <ServiceSection
/> />
@@ -84,9 +88,10 @@ const MyServices: FC = () => {
<div className='text-xs text-description'>1 {t('service.active_menu')}</div> <div className='text-xs text-description'>1 {t('service.active_menu')}</div>
</div> </div>
</div> </div>
</Link>
</div> </div>
</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 <img
src={BannerImage} src={BannerImage}
className='w-full backdrop-blur-[100px] h-[550px] object-cover' className='w-full backdrop-blur-[100px] h-[550px] object-cover'
src/pages/service/OtherServices.tsx
+13 -2
View File
@@ -5,9 +5,10 @@ import BannerImage from '../../assets/images/banner2.jpeg'
import RobotImage from '../../assets/images/robot.jpeg' import RobotImage from '../../assets/images/robot.jpeg'
import { ArrowLeft } from 'iconsax-react' import { ArrowLeft } from 'iconsax-react'
import TitleLine from '../../components/TitleLine' import TitleLine from '../../components/TitleLine'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import Button from '../../components/Button' import Button from '../../components/Button'
import ServiceSection from '../../components/ServiceSection' import ServiceSection from '../../components/ServiceSection'
import { Link } from 'react-router-dom'
import { Pages } from '../../config/Pages'
const OtherServices: FC = () => { const OtherServices: FC = () => {
@@ -86,6 +87,7 @@ const OtherServices: FC = () => {
</div> </div>
<div className='mt-4'> <div className='mt-4'>
<Link to={Pages.services.detail + '1'}>
<Button <Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl' className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
> >
@@ -94,6 +96,7 @@ const OtherServices: FC = () => {
<ArrowLeft color='black' size={16} /> <ArrowLeft color='black' size={16} />
</div> </div>
</Button> </Button>
</Link>
</div> </div>
</div> </div>
<div className='flex-1 min-w-[40%] xl:min-w-[30%] bg-white rounded-3xl xl:p-6 p-4'> <div className='flex-1 min-w-[40%] xl:min-w-[30%] bg-white rounded-3xl xl:p-6 p-4'>
@@ -111,6 +114,7 @@ const OtherServices: FC = () => {
</div> </div>
<div className='mt-4'> <div className='mt-4'>
<Link to={Pages.services.detail + '1'}>
<Button <Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl' className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
> >
@@ -119,6 +123,7 @@ const OtherServices: FC = () => {
<ArrowLeft color='black' size={16} /> <ArrowLeft color='black' size={16} />
</div> </div>
</Button> </Button>
</Link>
</div> </div>
</div> </div>
<div className='flex-1 min-w-[40%] xl:min-w-[30%] bg-white rounded-3xl xl:p-6 p-4'> <div className='flex-1 min-w-[40%] xl:min-w-[30%] bg-white rounded-3xl xl:p-6 p-4'>
@@ -136,6 +141,7 @@ const OtherServices: FC = () => {
</div> </div>
<div className='mt-4'> <div className='mt-4'>
<Link to={Pages.services.detail + '1'}>
<Button <Button
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl' className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
> >
@@ -144,6 +150,7 @@ const OtherServices: FC = () => {
<ArrowLeft color='black' size={16} /> <ArrowLeft color='black' size={16} />
</div> </div>
</Button> </Button>
</Link>
</div> </div>
</div> </div>
<div className='flex-1 min-w-[40%] xl:min-w-[30%] xl:p-6 p-4'></div> <div className='flex-1 min-w-[40%] xl:min-w-[30%] xl:p-6 p-4'></div>
@@ -159,6 +166,7 @@ const OtherServices: FC = () => {
<div className='flex justify-between items-center'> <div className='flex justify-between items-center'>
<ServiceSection <ServiceSection
/> />
<Link to={Pages.services.detail + '1'}>
<Button <Button
className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl' className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl'
> >
@@ -167,6 +175,7 @@ const OtherServices: FC = () => {
<ArrowLeft color='black' size={16} /> <ArrowLeft color='black' size={16} />
</div> </div>
</Button> </Button>
</Link>
</div> </div>
</div> </div>
@@ -174,6 +183,7 @@ const OtherServices: FC = () => {
<div className='flex justify-between items-center'> <div className='flex justify-between items-center'>
<ServiceSection <ServiceSection
/> />
<Link to={Pages.services.detail + '1'}>
<Button <Button
className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl' className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl'
> >
@@ -182,6 +192,7 @@ const OtherServices: FC = () => {
<ArrowLeft color='black' size={16} /> <ArrowLeft color='black' size={16} />
</div> </div>
</Button> </Button>
</Link>
</div> </div>
</div> </div>
@@ -193,7 +204,7 @@ const OtherServices: 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 <img
src={RobotImage} src={RobotImage}
className='w-full backdrop-blur-[100px] h-[550px] object-cover' className='w-full backdrop-blur-[100px] h-[550px] object-cover'
src/pages/ticket/CreateTicket.tsx
+3 -4
View File
@@ -1,6 +1,5 @@
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import Input from '../../components/Input' import Input from '../../components/Input'
import Select from '../../components/Select' import Select from '../../components/Select'
import Textarea from '../../components/Textarea' import Textarea from '../../components/Textarea'
@@ -18,8 +17,8 @@ const CreateTicket: FC = () => {
{t('ticket.new_ticket')} {t('ticket.new_ticket')}
</div> </div>
<div className='flex gap-6 mt-8'> <div className='flex gap-6 xl:mt-8 mt-4'>
<div className='flex-1 bg-white py-8 px-10 rounded-3xl'> <div className='flex-1 bg-white py-8 xl:px-10 px-4 rounded-3xl'>
<div> <div>
{t('ticket.submit_your_message')} {t('ticket.submit_your_message')}
</div> </div>
@@ -90,7 +89,7 @@ const CreateTicket: FC = () => {
</div> </div>
</div> </div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white py-10 px-5 h-fit rounded-3xl'> <div className='bg-white w-sidebar xl:block hidden py-10 px-5 h-fit rounded-3xl'>
<div className='text-sm'> <div className='text-sm'>
{t('ticket.title_hint')} {t('ticket.title_hint')}
</div> </div>
src/pages/ticket/Detail.tsx
+10 -11
View File
@@ -1,6 +1,5 @@
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import Input from '../../components/Input' import Input from '../../components/Input'
import Textarea from '../../components/Textarea' import Textarea from '../../components/Textarea'
import UploadBox from '../../components/UploadBox' import UploadBox from '../../components/UploadBox'
@@ -17,8 +16,8 @@ const TicketDetail: FC = () => {
<div>{t('ticket.ticket_number')}</div> <div>{t('ticket.ticket_number')}</div>
<div>12312</div> <div>12312</div>
</div> </div>
<div className='flex gap-6 mt-8'> <div className='flex xl:flex-row flex-col-reverse gap-6 xl:mt-8 mt-6'>
<div className='flex-1 bg-white py-8 px-10 rounded-3xl'> <div className='flex-1 bg-white py-8 xl:px-10 px-4 rounded-3xl'>
<div className='gap-6 rowTwoInput'> <div className='gap-6 rowTwoInput'>
<Input <Input
label={t('ticket.select_your_service')} label={t('ticket.select_your_service')}
@@ -32,11 +31,11 @@ const TicketDetail: FC = () => {
/> />
</div> </div>
<div className='mt-8 text-sm'> <div className='mt-8 xl:text-sm text-xs'>
موضوع درخواست پشتیبانی موضوع درخواست پشتیبانی
</div> </div>
<div className='mt-6 text-sm bg-[#F6F7FA] p-6 rounded-3xl rounded-tr-none max-w-[70%]'> <div className='mt-6 xl:text-sm text-xs bg-[#F6F7FA] p-6 rounded-3xl rounded-tr-none xl:max-w-[70%] max-w-[90%]'>
<div className='leading-7'> <div className='leading-7'>
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد،
</div> </div>
@@ -46,7 +45,7 @@ const TicketDetail: FC = () => {
</div> </div>
<div className='w-full flex justify-end'> <div className='w-full flex justify-end'>
<div className='mt-6 text-sm bg-[#EBEDF5] p-6 rounded-3xl rounded-tl-none max-w-[70%]'> <div className='mt-6 xl:text-sm text-xs bg-[#EBEDF5] p-6 rounded-3xl rounded-tl-none xl:max-w-[70%] max-w-[90%]'>
<div className='flex gap-1'> <div className='flex gap-1'>
<div className='font-bold'> <div className='font-bold'>
{t('ticket.expert')} {t('ticket.expert')}
@@ -81,16 +80,16 @@ const TicketDetail: FC = () => {
className='max-w-[100px]' className='max-w-[100px]'
/> />
</div> </div>
<div className='h-8'></div>
</div> </div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='h-fit'> <div className={`h-fit xl:w-sidebar w-full`}>
<div className='bg-white p-6 rounded-3xl flex gap-4'> <div className='bg-white xl:p-6 p-4 rounded-3xl flex gap-4'>
<Button <Button
label={t('ticket.send_answer')} label={t('ticket.send_answer')}
className='text-xs' className='text-xs xl:h-10 h-8'
/> />
<Button <Button
className='bg-[#D52903]' className='bg-[#D52903] xl:h-10 h-8'
> >
<div className='flex gap-2 text-xs items-center'> <div className='flex gap-2 text-xs items-center'>
<CloseCircle <CloseCircle
src/pages/transaction/List.tsx
+17 -17
View File
@@ -14,18 +14,18 @@ const TransactionList: FC = () => {
{t('transaction.transaction')} {t('transaction.transaction')}
</div> </div>
<div className='mt-6 flex gap-6 justify-center'> <div className='mt-6 flex xl:gap-6 gap-1 justify-center'>
<div className='bg-white rounded-2xl p-6 w-[253px]'> <div className='bg-white flex-1 rounded-2xl xl:p-6 py-2 px-4 xl:max-w-[253px]'>
<div className='flex gap-2 items-center'> <div className='flex xl:flex-row flex-col gap-2 items-center'>
<div className='size-8 bg-[#EEF0F7] rounded-full flex justify-center items-center'> <div className='size-8 bg-[#EEF0F7] rounded-full flex justify-center items-center'>
<MoneySend size={18} color='black' /> <MoneySend size={18} color='black' />
</div> </div>
<div className='text-xs text-[#101828]'> <div className='xl:text-xs text-[10px] text-[#101828]'>
{t('transaction.totao_deposit')} {t('transaction.totao_deposit')}
</div> </div>
</div> </div>
<div className='mt-2 flex gap-2 items-center'> <div className='mt-2 flex xl:flex-row flex-col gap-2 items-center'>
<div className='text-[#101828] text-xs'> <div className='text-[#101828] xl:text-xs text-[10px]'>
۱۴۰,۰۰۰,۰۰۰ ریال ۱۴۰,۰۰۰,۰۰۰ ریال
</div> </div>
<div className='flex gap gap-0.5 px-2 py-1 bg-green-100 rounded-lg text-[10px] text-success'> <div className='flex gap gap-0.5 px-2 py-1 bg-green-100 rounded-lg text-[10px] text-success'>
@@ -34,17 +34,17 @@ const TransactionList: FC = () => {
</div> </div>
</div> </div>
</div> </div>
<div className='bg-white rounded-2xl p-6 w-[253px]'> <div className='bg-white flex-1 rounded-2xl xl:p-6 py-2 px-4 xl:max-w-[253px]'>
<div className='flex gap-2 items-center'> <div className='flex xl:flex-row flex-col gap-2 items-center'>
<div className='size-8 bg-[#EEF0F7] rounded-full flex justify-center items-center'> <div className='size-8 bg-[#EEF0F7] rounded-full flex justify-center items-center'>
<MoneyRecive size={18} color='black' /> <MoneyRecive size={18} color='black' />
</div> </div>
<div className='text-xs text-[#101828]'> <div className='xl:text-xs text-[10px] text-[#101828]'>
{t('transaction.total_withdrawal')} {t('transaction.total_withdrawal')}
</div> </div>
</div> </div>
<div className='mt-2 flex gap-2 items-center'> <div className='mt-2 flex xl:flex-row flex-col gap-2 items-center'>
<div className='text-[#101828] text-xs'> <div className='text-[#101828] xl:text-xs text-[10px]'>
۱۴۰,۰۰۰,۰۰۰ ریال ۱۴۰,۰۰۰,۰۰۰ ریال
</div> </div>
<div className='flex gap gap-0.5 px-2 py-1 bg-green-100 rounded-lg text-[10px] text-success'> <div className='flex gap gap-0.5 px-2 py-1 bg-green-100 rounded-lg text-[10px] text-success'>
@@ -53,17 +53,17 @@ const TransactionList: FC = () => {
</div> </div>
</div> </div>
</div> </div>
<div className='bg-white rounded-2xl p-6 w-[253px]'> <div className='bg-white flex-1 rounded-2xl xl:p-6 py-2 px-4 xl:max-w-[253px]'>
<div className='flex gap-2 items-center'> <div className='flex xl:flex-row flex-col gap-2 items-center'>
<div className='size-8 bg-[#EEF0F7] rounded-full flex justify-center items-center'> <div className='size-8 bg-[#EEF0F7] rounded-full flex xl:flex-row flex-col justify-center items-center'>
<MoneyRecive size={18} color='black' /> <MoneyRecive size={18} color='black' />
</div> </div>
<div className='text-xs text-[#101828]'> <div className='xl:text-xs text-[10px] text-[#101828]'>
{t('transaction.balance')} {t('transaction.balance')}
</div> </div>
</div> </div>
<div className='mt-2 flex gap-2 items-center'> <div className='mt-2 flex xl:flex-row flex-col gap-2 items-center'>
<div className='text-[#101828] text-xs'> <div className='text-[#101828] xl:text-xs text-[10px]'>
۱۴۰,۰۰۰,۰۰۰ ریال ۱۴۰,۰۰۰,۰۰۰ ریال
</div> </div>
<div className='flex gap gap-0.5 px-2 py-1 text-red-400 rounded-lg text-[10px] bg-red-100'> <div className='flex gap gap-0.5 px-2 py-1 text-red-400 rounded-lg text-[10px] bg-red-100'>
src/pages/wallet/Wallet.tsx
+1 -2
View File
@@ -1,7 +1,6 @@
import { Cards, Money3, MoneyRecive, TickSquare } from 'iconsax-react' import { Cards, Money3, MoneyRecive, TickSquare } from 'iconsax-react'
import { FC, useState } from 'react' import { FC, useState } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
import Tabs from '../../components/Tabs' import Tabs from '../../components/Tabs'
import Online from './components/Online' import Online from './components/Online'
import CardtoCard from './components/CardtoCard' import CardtoCard from './components/CardtoCard'
@@ -52,7 +51,7 @@ const Wallet: FC = () => {
</div> </div>
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white xl:block hidden py-10 px-5 h-fit rounded-3xl'> <div className='bg-white w-sidebar xl:block hidden py-10 px-5 h-fit rounded-3xl'>
<div className='text-sm'> <div className='text-sm'>
{t('ticket.title_hint')} {t('ticket.title_hint')}
</div> </div>
src/shared/Footer.tsx
+13 -1
View File
@@ -1,6 +1,8 @@
import { Element3, Element4, Home2, Messages3, NotificationStatus } from 'iconsax-react' import { Element3, Element4, Home2, Messages3, NotificationStatus } from 'iconsax-react'
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import { Pages } from '../config/Pages'
import { Link } from 'react-router-dom'
const Footer: FC = () => { const Footer: FC = () => {
@@ -10,6 +12,7 @@ const Footer: FC = () => {
<div className='xl:hidden'> <div className='xl:hidden'>
<div className='h-[60px] '></div> <div className='h-[60px] '></div>
<div className='fixed bottom-2 right-3 left-3 bg-white h-[60px] rounded-2xl flex justify-between items-center px-3'> <div className='fixed bottom-2 right-3 left-3 bg-white h-[60px] rounded-2xl flex justify-between items-center px-3'>
<Link to={Pages.dashboard}>
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'> <div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
<Home2 <Home2
className='size-5' className='size-5'
@@ -19,6 +22,8 @@ const Footer: FC = () => {
{t('footer.home')} {t('footer.home')}
</div> </div>
</div> </div>
</Link>
<Link to={Pages.services.other}>
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'> <div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
<Element4 <Element4
className='size-5' className='size-5'
@@ -28,7 +33,8 @@ const Footer: FC = () => {
{t('footer.other_services')} {t('footer.other_services')}
</div> </div>
</div> </div>
</Link>
<Link to={Pages.services.mine}>
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'> <div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
<div className='bg-white p-1 rounded-full -mt-7'> <div className='bg-white p-1 rounded-full -mt-7'>
<div className='bg-black flex justify-center items-center size-10 rounded-full'> <div className='bg-black flex justify-center items-center size-10 rounded-full'>
@@ -42,6 +48,8 @@ const Footer: FC = () => {
{t('footer.my_services')} {t('footer.my_services')}
</div> </div>
</div> </div>
</Link>
<Link to={Pages.announcement.list}>
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'> <div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
<NotificationStatus <NotificationStatus
className='size-5' className='size-5'
@@ -51,6 +59,9 @@ const Footer: FC = () => {
{t('footer.announcements')} {t('footer.announcements')}
</div> </div>
</div> </div>
</Link>
<Link to={Pages.ticket.list}>
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'> <div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
<Messages3 <Messages3
className='size-5' className='size-5'
@@ -60,6 +71,7 @@ const Footer: FC = () => {
{t('footer.tickets')} {t('footer.tickets')}
</div> </div>
</div> </div>
</Link>
</div> </div>
</div> </div>
) )
tailwind.config.js
+3
View File
@@ -16,6 +16,9 @@ module.exports = withMT({
header: "#C3C7DD", header: "#C3C7DD",
success: "#00BA4B" success: "#00BA4B"
}, },
width: {
'sidebar': '300px'
},
borderRadius: { borderRadius: {
'2.5': '10px' '2.5': '10px'
} }