filter search + primary color + logo + ...
This commit is contained in:
hamid zarghami
+13
-7
@@ -1,9 +1,9 @@
|
||||
import { type FC } from 'react'
|
||||
import { type FC, useEffect } from 'react'
|
||||
import Input from '../components/Input'
|
||||
// import { ArrowDown2, CloseCircle, HambergerMenu, Logout, Wallet } from 'iconsax-react'
|
||||
// import AvatarImage from '../assets/images/avatar_image.png'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { Link } from 'react-router-dom'
|
||||
import { Link, useLocation } from 'react-router-dom'
|
||||
import { Pages } from '../config/Pages'
|
||||
import { useSharedStore } from './store/sharedStore'
|
||||
import { HambergerMenu, Wallet } from 'iconsax-react'
|
||||
@@ -13,7 +13,8 @@ const Header: FC = () => {
|
||||
// const location = useLocation();
|
||||
// const [popoverKey, setPopoverKey] = useState(0);
|
||||
const { t } = useTranslation('global')
|
||||
const { setOpenSidebar, openSidebar, hasSubMenu } = useSharedStore()
|
||||
const { setOpenSidebar, openSidebar, hasSubMenu, setSearch } = useSharedStore()
|
||||
const location = useLocation()
|
||||
|
||||
// useEffect(() => {
|
||||
// setPopoverKey((prevKey) => prevKey + 1);
|
||||
@@ -25,6 +26,10 @@ const Header: FC = () => {
|
||||
// window.location.href = Pages.auth.login
|
||||
// }
|
||||
|
||||
useEffect(() => {
|
||||
setSearch('')
|
||||
}, [location.pathname])
|
||||
|
||||
return (
|
||||
<div className={`fixed z-10 right-4 left-4 top-4 xl:h-16 h-12 flex items-center px-6 bg-white justify-between rounded-[32px] ${hasSubMenu ? 'xl:right-[320px] xl:w-[calc(100%-340px)]' : 'xl:right-[285px] xl:w-[calc(100%-305px)]'}`}>
|
||||
|
||||
@@ -32,15 +37,16 @@ const Header: FC = () => {
|
||||
<Input
|
||||
variant='search'
|
||||
placeholder={t('header.search')}
|
||||
onChangeSearchFinal={(value) => setSearch(value)}
|
||||
/>
|
||||
</div>
|
||||
<div onClick={() => setOpenSidebar(!openSidebar)} className='xl:hidden block'>
|
||||
<HambergerMenu size={24} color='black' />
|
||||
<HambergerMenu size={24} color='#da2129' />
|
||||
</div>
|
||||
{/* <img src={LogoImage} className='h-6 xl:hidden block absolute right-0 left-0 mx-auto' /> */}
|
||||
<div className='flex xl:gap-6 gap-4 items-center'>
|
||||
<Link className='xl:hidden' to={Pages.wallet}>
|
||||
<Wallet className='xl:size-[18px] size-[17px]' color='black' />
|
||||
<Wallet className='xl:size-[18px] size-[17px]' color='#da2129' />
|
||||
</Link>
|
||||
{/* <Notifications /> */}
|
||||
{/* {
|
||||
@@ -62,7 +68,7 @@ const Header: FC = () => {
|
||||
|
||||
<PopoverPanel style={{ minHeight: window.innerWidth < 1140 ? window.innerHeight : undefined }} anchor="bottom" className="flex xl:ml-6 overflow-auto flex-col gap-3 bg-white boxShadow xl:mt-7 z-30 py-4 text-xs rounded-2.5 xl:w-[300px] -mt-[50px] w-full fixed xl:h-fit h-full shadow-md">
|
||||
<div className='absolute xl:hidden top-6 left-6'>
|
||||
<CloseCircle onClick={() => setPopoverKey((prevKey) => prevKey + 1)} size={20} color='black' />
|
||||
<CloseCircle onClick={() => setPopoverKey((prevKey) => prevKey + 1)} size={20} color='#da2129' />
|
||||
</div>
|
||||
<Link to={Pages.profile} className='flex flex-col gap-2 items-center justify-center border-b border-[#EAEDF5] pb-4'>
|
||||
<div className='size-14 rounded-full overflow-hidden'>
|
||||
@@ -80,7 +86,7 @@ const Header: FC = () => {
|
||||
|
||||
<div className='px-6 mt-2'>
|
||||
<div onClick={() => handleLogout()} className='flex gap-2 items-center cursor-pointer'>
|
||||
<Logout size={20} color='black' />
|
||||
<Logout size={20} color='#da2129' />
|
||||
<div>
|
||||
{t('sidebar.logout')}
|
||||
</div>
|
||||
|
||||
+18
-18
@@ -106,7 +106,7 @@ const SideBar: FC = () => {
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
{/* داشبورد */}
|
||||
<SideBarItem
|
||||
icon={<Home2 variant={isActive('dashboard') ? 'Bold' : 'Outline'} color={isActive('dashboard') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Home2 variant={isActive('dashboard') ? 'Bold' : 'Outline'} color={isActive('dashboard') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="داشبورد"
|
||||
isActive={isActive('dashboard')}
|
||||
link="/dashboard"
|
||||
@@ -115,7 +115,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* محصولات */}
|
||||
<SideBarItem
|
||||
icon={<Element3 variant={isActive('products') ? 'Bold' : 'Outline'} color={isActive('products') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Element3 variant={isActive('products') ? 'Bold' : 'Outline'} color={isActive('products') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="محصولات"
|
||||
isActive={isActive('products')}
|
||||
link={Pages.products.list}
|
||||
@@ -124,7 +124,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* سفارشات */}
|
||||
<SideBarItem
|
||||
icon={<Receipt21 variant={isActive('orders') ? 'Bold' : 'Outline'} color={isActive('orders') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Receipt21 variant={isActive('orders') ? 'Bold' : 'Outline'} color={isActive('orders') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="سفارشات"
|
||||
isActive={isActive('orders')}
|
||||
link="/orders"
|
||||
@@ -133,7 +133,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* تخفیف ها */}
|
||||
<SideBarItem
|
||||
icon={<TicketDiscount variant={isActive('coupon') ? 'Bold' : 'Outline'} color={isActive('coupon') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<TicketDiscount variant={isActive('coupon') ? 'Bold' : 'Outline'} color={isActive('coupon') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="تخفیف ها"
|
||||
isActive={isActive('coupon')}
|
||||
link={Pages.coupon.list}
|
||||
@@ -142,7 +142,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* بلاگ */}
|
||||
<SideBarItem
|
||||
icon={<DocumentText variant={isActive('blog') ? 'Bold' : 'Outline'} color={isActive('blog') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<DocumentText variant={isActive('blog') ? 'Bold' : 'Outline'} color={isActive('blog') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="بلاگ"
|
||||
isActive={isActive('blog')}
|
||||
link="/blog"
|
||||
@@ -151,7 +151,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* روش های ارسال */}
|
||||
<SideBarItem
|
||||
icon={<Truck variant={isActive('shipment') ? 'Bold' : 'Outline'} color={isActive('shipment') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Truck variant={isActive('shipment') ? 'Bold' : 'Outline'} color={isActive('shipment') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="روش های ارسال"
|
||||
isActive={isActive('shipment')}
|
||||
link={Pages.shipment.list}
|
||||
@@ -160,7 +160,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* مالی */}
|
||||
<SideBarItem
|
||||
icon={<Money3 variant={isActive('financial') ? 'Bold' : 'Outline'} color={isActive('financial') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Money3 variant={isActive('financial') ? 'Bold' : 'Outline'} color={isActive('financial') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="مالی"
|
||||
isActive={isActive('financial')}
|
||||
link={Pages.financial.list}
|
||||
@@ -169,7 +169,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* فروشندگان */}
|
||||
<SideBarItem
|
||||
icon={<People variant={isActive('sellers') ? 'Bold' : 'Outline'} color={isActive('sellers') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<People variant={isActive('sellers') ? 'Bold' : 'Outline'} color={isActive('sellers') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="فروشندگان"
|
||||
isActive={isActive('sellers')}
|
||||
link={Pages.sellers.list}
|
||||
@@ -178,7 +178,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* خریداران */}
|
||||
<SideBarItem
|
||||
icon={<UserSquare variant={isActive('buy-users') ? 'Bold' : 'Outline'} color={isActive('buy-users') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<UserSquare variant={isActive('buy-users') ? 'Bold' : 'Outline'} color={isActive('buy-users') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="خریداران"
|
||||
isActive={isActive('buy-users')}
|
||||
link={Pages.buyUsers.list}
|
||||
@@ -187,7 +187,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* کاربران */}
|
||||
<SideBarItem
|
||||
icon={<Profile variant={isActive('admin') ? 'Bold' : 'Outline'} color={isActive('admin') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Profile variant={isActive('admin') ? 'Bold' : 'Outline'} color={isActive('admin') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="ادمین ها"
|
||||
isActive={isActive('admin')}
|
||||
link={Pages.admin.list}
|
||||
@@ -196,7 +196,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* تیکت ها */}
|
||||
<SideBarItem
|
||||
icon={<Messages3 variant={isActive('tickets') ? 'Bold' : 'Outline'} color={isActive('tickets') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Messages3 variant={isActive('tickets') ? 'Bold' : 'Outline'} color={isActive('tickets') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="تیکت ها"
|
||||
isActive={isActive('tickets')}
|
||||
link={Pages.ticket.list}
|
||||
@@ -205,7 +205,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* گزارش ها */}
|
||||
<SideBarItem
|
||||
icon={<Chart variant={isActive('reports') ? 'Bold' : 'Outline'} color={isActive('reports') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Chart variant={isActive('reports') ? 'Bold' : 'Outline'} color={isActive('reports') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="گزارش ها"
|
||||
isActive={isActive('reports')}
|
||||
link={Pages.report.product}
|
||||
@@ -214,7 +214,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* گفت و گو */}
|
||||
<SideBarItem
|
||||
icon={<SmsTracking variant={isActive('chat') ? 'Bold' : 'Outline'} color={isActive('chat') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<SmsTracking variant={isActive('chat') ? 'Bold' : 'Outline'} color={isActive('chat') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="گفت و گو"
|
||||
isActive={isActive('chat')}
|
||||
link={Pages.messages.list}
|
||||
@@ -223,7 +223,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* ارتباط با ما */}
|
||||
<SideBarItem
|
||||
icon={<Headphone variant={isActive('contact') ? 'Bold' : 'Outline'} color={isActive('contact') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Headphone variant={isActive('contact') ? 'Bold' : 'Outline'} color={isActive('contact') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="ارتباط با ما"
|
||||
isActive={isActive('contact')}
|
||||
link={Pages.contactUs.list}
|
||||
@@ -232,7 +232,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* تنظیمات */}
|
||||
<SideBarItem
|
||||
icon={<Setting2 variant={isActive('settings') ? 'Bold' : 'Outline'} color={isActive('settings') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Setting2 variant={isActive('settings') ? 'Bold' : 'Outline'} color={isActive('settings') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="تنظیمات"
|
||||
isActive={isActive('settings')}
|
||||
link="/settings"
|
||||
@@ -241,7 +241,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* مدیریت صفحات */}
|
||||
<SideBarItem
|
||||
icon={<DocumentText variant={isActive('pages') ? 'Bold' : 'Outline'} color={isActive('pages') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<DocumentText variant={isActive('pages') ? 'Bold' : 'Outline'} color={isActive('pages') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="مدیریت صفحات"
|
||||
isActive={isActive('pages')}
|
||||
link={Pages.pages.aboutUs}
|
||||
@@ -250,7 +250,7 @@ const SideBar: FC = () => {
|
||||
|
||||
{/* مشاغل */}
|
||||
<SideBarItem
|
||||
icon={<Briefcase variant={isActive('jobs') ? 'Bold' : 'Outline'} color={isActive('jobs') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Briefcase variant={isActive('jobs') ? 'Bold' : 'Outline'} color={isActive('jobs') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="مشاغل"
|
||||
isActive={isActive('jobs')}
|
||||
link={Pages.jobs.list}
|
||||
@@ -261,7 +261,7 @@ const SideBar: FC = () => {
|
||||
<div className='flex-1 flex flex-col justify-end mt-14'>
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<Logout variant={isActive('logout') ? 'Bold' : 'Outline'} color={isActive('logout') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
icon={<Logout variant={isActive('logout') ? 'Bold' : 'Outline'} color={isActive('logout') ? '#da2129' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title="خروج"
|
||||
isActive={isActive('logout')}
|
||||
link={`#`}
|
||||
|
||||
@@ -40,7 +40,7 @@ const SideBarItem: FC<Props> = (props: Props) => {
|
||||
hasSubMenu && 'flex-col',
|
||||
)}>
|
||||
<div className={clx(
|
||||
'w-1 bg-black h-6',
|
||||
'w-1 bg-primary h-6',
|
||||
!props.isActive && 'invisible',
|
||||
hasSubMenu && 'hidden',
|
||||
)}></div>
|
||||
@@ -49,7 +49,7 @@ const SideBarItem: FC<Props> = (props: Props) => {
|
||||
hasSubMenu && 'flex-col text-[10px]',
|
||||
)}>
|
||||
{props.icon}
|
||||
<div className={props.isActive ? 'text-black' : ''}>
|
||||
<div className={props.isActive ? 'text-primary' : ''}>
|
||||
{props.title}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -17,7 +17,7 @@ const BlogSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<DocumentText
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const BuyersSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<UserSquare
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const CategorySubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Element3
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -14,7 +14,7 @@ const ChatSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<SmsTracking
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const ContactSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Headphone
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -17,7 +17,7 @@ const CustomerSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<People
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -14,7 +14,7 @@ const DashboardSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Home2
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const FinancialSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Money3
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -14,7 +14,7 @@ const JobsSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Briefcase
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -19,7 +19,7 @@ const LearningSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<Teacher
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -13,7 +13,7 @@ const OrdersSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Receipt21
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const PagesSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<DocumentText
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const ProductsSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Element3
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -19,7 +19,7 @@ const ReceiptSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<Receipt21
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const ReportsSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Chart
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const SellersSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<People
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -20,7 +20,7 @@ const ServicesSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<Element3
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const SettingsSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Setting2
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -14,7 +14,7 @@ const ShippingSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Truck
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,13 +15,13 @@ const SubMenuItem: FC<Props> = (props: Props) => {
|
||||
'flex text-xs gap-6 mt-1',
|
||||
)}>
|
||||
<div className={clx(
|
||||
'w-1 bg-black h-6',
|
||||
'w-1 bg-primary h-6',
|
||||
!props.isActive && 'invisible',
|
||||
)}></div>
|
||||
<div className={clx(
|
||||
'flex gap-3 items-center mt-1',
|
||||
)}>
|
||||
<div className={props.isActive ? 'text-black' : 'text-description'}>
|
||||
<div className={props.isActive ? 'text-primary' : 'text-description'}>
|
||||
{props.title}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -20,7 +20,7 @@ const SupportSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<Headphone
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -20,7 +20,7 @@ const TicketSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<Messages3
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const TicketsSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
|
||||
<Messages3
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -16,7 +16,7 @@ const TransactionsSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<Card
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -15,7 +15,7 @@ const UsersSubMenu: FC = () => {
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<Profile
|
||||
size={24}
|
||||
color='#000'
|
||||
color='#da2129'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
|
||||
@@ -8,4 +8,6 @@ export const useSharedStore = create<SharedStoreType>((set) => ({
|
||||
setSubtMenu: (value: boolean) => set({ hasSubMenu: value }),
|
||||
subMenuName: "",
|
||||
setSubMenuName: (value: string) => set({ subMenuName: value }),
|
||||
search: "",
|
||||
setSearch: (value: string) => set({ search: value }),
|
||||
}));
|
||||
|
||||
@@ -5,6 +5,8 @@ export type SharedStoreType = {
|
||||
setSubtMenu: (value: boolean) => void;
|
||||
subMenuName: string;
|
||||
setSubMenuName: (value: string) => void;
|
||||
search: string;
|
||||
setSearch: (value: string) => void;
|
||||
};
|
||||
|
||||
export type PagerType = {
|
||||
|
||||
Reference in New Issue
Block a user