diff --git a/src/langs/fa.json b/src/langs/fa.json index fede563..cb3b94a 100644 --- a/src/langs/fa.json +++ b/src/langs/fa.json @@ -85,6 +85,13 @@ "buy": "خرید", "other_services": "سایر سرویس ها" }, + "footer": { + "home": "صفحه اصلی", + "other_services": "سایر سرویس ها", + "my_services": "سرویس های من", + "announcements": "اطلاعیه ها", + "tickets": "تیکت ها" + }, "ticket": { "tickets": "تیکت ها", "new_ticket": "تیکت جدید", diff --git a/src/pages/home/Home.tsx b/src/pages/home/Home.tsx index acfb901..e21ad25 100644 --- a/src/pages/home/Home.tsx +++ b/src/pages/home/Home.tsx @@ -17,22 +17,24 @@ const Home: FC = () => { return (
- { }} onPointerLeaveCapture={() => { }} > + null} nextArrow={() => null} autoplay={false} className="rounded-xl h-fit dltr" placeholder="" onPointerEnterCapture={() => { }} onPointerLeaveCapture={() => { }} >
-
- +
+
+ +
-
+
سفارش نرم‌افزار اختصاصی: سرمایه‌ای برای آینده یا فقط هزینه‌ای برای امروز؟
-
+
۸ دقیقه مطالعه
-
-
- +
+
+ +
-
+
سفارش نرم‌افزار اختصاصی: سرمایه‌ای برای آینده یا فقط هزینه‌ای برای امروز؟
-
+
۸ دقیقه مطالعه
-
-
+
} @@ -105,8 +109,8 @@ const Home: FC = () => {
-
-
+
+
{t('home.add_access')} diff --git a/src/pages/home/components/BoxNewAccessbility.tsx b/src/pages/home/components/BoxNewAccessbility.tsx index b4c395a..45e23a6 100644 --- a/src/pages/home/components/BoxNewAccessbility.tsx +++ b/src/pages/home/components/BoxNewAccessbility.tsx @@ -14,7 +14,7 @@ const BoxNewAccessbility: FC = () => { <>
setOpen(true)} - className="flex-1 flex justify-center items-center h-[160px]" + className="flex-1 min-w-[40%] xl:min-w-[20%] flex justify-center items-center h-[160px]" style={{ position: 'relative', }} diff --git a/src/pages/home/components/DanakLearning.tsx b/src/pages/home/components/DanakLearning.tsx index b524add..5533628 100644 --- a/src/pages/home/components/DanakLearning.tsx +++ b/src/pages/home/components/DanakLearning.tsx @@ -9,7 +9,7 @@ const DanakLearning: FC = () => { const { t } = useTranslation('global') return ( -
+
{t('home.danak_learning')} diff --git a/src/pages/home/components/ItemDashboard.tsx b/src/pages/home/components/ItemDashboard.tsx index 985727e..f83b6ab 100644 --- a/src/pages/home/components/ItemDashboard.tsx +++ b/src/pages/home/components/ItemDashboard.tsx @@ -11,7 +11,7 @@ type Props = { const ItemDashboard: FC = (props: Props) => { return ( -
+
{props.icon}
diff --git a/src/pages/service/OtherServices.tsx b/src/pages/service/OtherServices.tsx index e668c0a..3786524 100644 --- a/src/pages/service/OtherServices.tsx +++ b/src/pages/service/OtherServices.tsx @@ -70,8 +70,8 @@ const OtherServices: FC = () => {
-
-
+
+
@@ -96,7 +96,7 @@ const OtherServices: FC = () => {
-
+
@@ -121,7 +121,7 @@ const OtherServices: FC = () => {
-
+
diff --git a/src/router/Main.tsx b/src/router/Main.tsx index 0f41ff5..95b5048 100644 --- a/src/router/Main.tsx +++ b/src/router/Main.tsx @@ -18,13 +18,14 @@ import Wallet from '../pages/wallet/Wallet' import ReceiptsDetail from '../pages/receipts/Detail' import Profile from '../pages/profile/Profile' import OtherServices from '../pages/service/OtherServices' +import Footer from '../shared/Footer' const MainRouter: FC = () => { return (
-
+
@@ -47,6 +48,7 @@ const MainRouter: FC = () => {
+
) } diff --git a/src/shared/Footer.tsx b/src/shared/Footer.tsx new file mode 100644 index 0000000..92fbf38 --- /dev/null +++ b/src/shared/Footer.tsx @@ -0,0 +1,68 @@ +import { Element3, Element4, Home2, Messages3, NotificationStatus } from 'iconsax-react' +import { FC } from 'react' +import { useTranslation } from 'react-i18next' + +const Footer: FC = () => { + + const { t } = useTranslation('global') + + return ( +
+
+
+
+ +
+ {t('footer.home')} +
+
+
+ +
+ {t('footer.other_services')} +
+
+ +
+
+
+ +
+
+
+ {t('footer.my_services')} +
+
+
+ +
+ {t('footer.announcements')} +
+
+
+ +
+ {t('footer.tickets')} +
+
+
+
+ ) +} + +export default Footer \ No newline at end of file diff --git a/src/shared/Header.tsx b/src/shared/Header.tsx index 3729bfc..3e541f3 100644 --- a/src/shared/Header.tsx +++ b/src/shared/Header.tsx @@ -1,29 +1,36 @@ import { FC } from 'react' import Input from '../components/Input' -import { ArrowDown2, Element3, Wallet } from 'iconsax-react' +import { ArrowDown2, Element3, HambergerMenu, Wallet } from 'iconsax-react' import AvatarImage from '../assets/images/Avatar.png' import { useTranslation } from 'react-i18next' import { Link } from 'react-router-dom' import { Pages } from '../config/Pages' import Notifications from '../pages/notification/Notification' +import LogoImage from '../assets/images/logo.svg' +import { useSharedStore } from './store/sharedStore' const Header: FC = () => { const { t } = useTranslation('global') + const { setOpenSidebar, openSidebar } = useSharedStore() return ( -
+
-
+
-
- +
setOpenSidebar(!openSidebar)} className='xl:hidden block'> + +
+ +
+ - +
@@ -32,7 +39,7 @@ const Header: FC = () => {
-
+
مهرداد مظفری
diff --git a/src/shared/SideBar.tsx b/src/shared/SideBar.tsx index 10d0143..0620093 100644 --- a/src/shared/SideBar.tsx +++ b/src/shared/SideBar.tsx @@ -5,10 +5,13 @@ import { Card, DocumentText, Element3, Element4, Home2, Logout, Messages3, Notif import SideBarItem from './SideBarItem' import { useLocation } from 'react-router-dom' import { Pages } from '../config/Pages' +import { useSharedStore } from './store/sharedStore' +import { clx } from '../helpers/utils' const SideBar: FC = () => { const { t } = useTranslation('global') + const { openSidebar, setOpenSidebar } = useSharedStore() const location = useLocation() const isActive = (name: string) => { @@ -18,106 +21,116 @@ const SideBar: FC = () => { const iconSizeSideBar = 20 return ( -
-
- -
- -
-
- {t('sidebar.menu')} + <> + { + openSidebar &&
setOpenSidebar(false)} /> + } +
+
+
-
- } - title={t('sidebar.mainpage')} - isActive={isActive('dashboard')} - link={Pages.dashboard} - /> - } - title={t('sidebar.myservice')} - isActive={isActive('services')} - link={Pages.services.mine} - /> - } - title={t('sidebar.other_service')} - isActive={isActive('other-service')} - link={Pages.services.other} - /> - } - title={t('sidebar.receipt_list')} - isActive={isActive('receipts')} - link={Pages.receipts.index} - /> - } - title={t('sidebar.transactions')} - isActive={isActive('transactions')} - link={Pages.transactions} - /> -
+
+
+ {t('sidebar.menu')} +
-
- {t('sidebar.other')} -
- -
- } - title={t('sidebar.ticket')} - isActive={isActive('tickets')} - link={Pages.ticket.list} - /> -
-
- } - title={t('sidebar.announcement')} - isActive={isActive('announcement')} - link={Pages.announcement} - /> -
-
- } - title={t('sidebar.criticisms')} - isActive={isActive('criticisms')} - link={Pages.criticisms} - /> -
-
- } - title={t('sidebar.learning')} - isActive={isActive('learning')} - link={Pages.learning} - /> -
- -
} - title={t('sidebar.setting')} - isActive={isActive('setting')} - link={Pages.setting} + icon={} + title={t('sidebar.mainpage')} + isActive={isActive('dashboard')} + link={Pages.dashboard} + /> + } + title={t('sidebar.myservice')} + isActive={isActive('services')} + link={Pages.services.mine} + /> + } + title={t('sidebar.other_service')} + isActive={isActive('other-service')} + link={Pages.services.other} + /> + } + title={t('sidebar.receipt_list')} + isActive={isActive('receipts')} + link={Pages.receipts.index} + /> + } + title={t('sidebar.transactions')} + isActive={isActive('transactions')} + link={Pages.transactions} + /> +
+ +
+ {t('sidebar.other')} +
+ +
+ } + title={t('sidebar.ticket')} + isActive={isActive('tickets')} + link={Pages.ticket.list} />
} - title={t('sidebar.logout')} - isActive={isActive('logout')} - link={`#`} + icon={} + title={t('sidebar.announcement')} + isActive={isActive('announcement')} + link={Pages.announcement} />
+
+ } + title={t('sidebar.criticisms')} + isActive={isActive('criticisms')} + link={Pages.criticisms} + /> +
+
+ } + title={t('sidebar.learning')} + isActive={isActive('learning')} + link={Pages.learning} + /> +
+ +
+
+ } + title={t('sidebar.setting')} + isActive={isActive('setting')} + link={Pages.setting} + /> +
+
+ } + title={t('sidebar.logout')} + isActive={isActive('logout')} + link={`#`} + /> +
+
-
+ ) } diff --git a/src/shared/store/sharedStore.ts b/src/shared/store/sharedStore.ts new file mode 100644 index 0000000..731c65a --- /dev/null +++ b/src/shared/store/sharedStore.ts @@ -0,0 +1,7 @@ +import { create } from "zustand"; +import { SharedStoreType } from "../types/SharedTypes"; + +export const useSharedStore = create((set) => ({ + openSidebar: false, + setOpenSidebar: (value) => set({ openSidebar: value }), +})); diff --git a/src/shared/types/SharedTypes.ts b/src/shared/types/SharedTypes.ts new file mode 100644 index 0000000..b681e51 --- /dev/null +++ b/src/shared/types/SharedTypes.ts @@ -0,0 +1,4 @@ +export type SharedStoreType = { + openSidebar: boolean; + setOpenSidebar: (value: boolean) => void; +};