src/Layouts/DefaultLayout.tsx

@@ -1,12 +1,11 @@
 import { HStack, Image, Text, VStack } from "@chakra-ui/react";
 import React, { FC } from "react";
-import { GiHamburgerMenu } from "react-icons/gi";
 import { RiNotificationLine } from "react-icons/ri";
+import { NavLink, useLocation, useNavigate } from "react-router-dom";
 import { nav } from "../Routes/Nav";
-import logo from '../assets/logo.svg'
-import { Avatar } from "../components/ui/avatar";
-import { NavLink, useLocation, useNavigate, useParams } from "react-router-dom";
+import logo from '../assets/logo.svg';
 import { AccordionItem, AccordionItemContent, AccordionItemTrigger, AccordionRoot } from "../components/ui/accordion";
+import { Avatar } from "../components/ui/avatar";
 
 const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {
   const navigate = useNavigate()
@@ -26,7 +25,7 @@ const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {
           {nav?.map(({ title, path, Icon, type, children }, index) => type === 'single' ?
             <NavLink className="link" key={index} to={path} style={{ cursor: 'pointer', borderRadius: '8px', padding: '6px', width: '100%', display: 'flex', alignItems: 'center', gap: 6, border: '1px solid #ffffff', backgroundColor:'#fff', color:'#000', boxShadow:'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'}} ><Icon style={{ fontSize: '20px' }} /> <Text fontSize={'xs'} w={'100%'}>{title}</Text></NavLink> :
             <AccordionRoot bg={'#fff'} rounded={'lg'} collapsible>
-              <AccordionItem borderBottom={'none'} p={0} key={index} value={title}>
+              <AccordionItem boxShadow={'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'} rounded={'lg'} borderBottom={'none'} p={0} key={index} value={title}>
                 <AccordionItemTrigger color={'#fff'}   onClick={() => navigate(path)} gap={0} style={{ cursor: 'pointer', borderRadius: '8px', padding: '5px', width: '100%', display: 'flex', alignItems: 'center', border: '1px solid #ffffff', backgroundColor:'#fff',color:'#000',  fontSize: '14px', fontWeight:'normal' }}> <Text fontSize={'xs'} gap={1} display={'flex'} alignItems={'center'} ><Icon style={{ fontSize: '20px' }} />{title}</Text></AccordionItemTrigger>
                 {children?.map(({ title, path, Icon }, index) => <AccordionItemContent className={`linkChild  ${location?.pathname === path && 'activeChild'}`} key={index} onClick={()=>navigate(path)} style={{ marginTop: 6, cursor: 'pointer', borderRadius: '8px', padding: '6px', width: '100%', display: 'flex', alignItems: 'center', gap: 6, border: '1px solid #ffffff', backgroundColor:'#fff',color:'#000' }} ><Icon style={{ fontSize: '20px' }} /> <Text fontSize={'xs'} w={'100%'}>{title}</Text></AccordionItemContent>)}
               </AccordionItem>

src/Pages/ManageCommunity/ManageCommunity.tsx

@@ -2,7 +2,7 @@ import MainFrame from "../../components/MainFrame"
 
 const ManageCommunity = () => {
   return (
-    <MainFrame title="Manage Community">
+    <MainFrame >
 
     </MainFrame>
   )

src/Pages/ManageCommunity/ManagePost.tsx

@@ -2,7 +2,7 @@ import MainFrame from "../../components/MainFrame"
 
 const ManagePost = () => {
   return (
-    <MainFrame title="Manage Post">
+    <MainFrame >
 
     </MainFrame>
   )

src/Pages/ManageGroups/ManageGroups.tsx

@@ -2,7 +2,7 @@ import MainFrame from "../../components/MainFrame"
 
 const ManageGroups = () => {
   return (
-    <MainFrame title="Manage Group">
+    <MainFrame >
 
     </MainFrame>
   )

src/Pages/ManageUsers/ManageUsers.tsx

@@ -2,7 +2,7 @@ import MainFrame from "../../components/MainFrame"
 
 const ManageUsers = () => {
   return (
-    <MainFrame title="Manage User">
+    <MainFrame >
 
     </MainFrame>
   )

src/Pages/Profile/Profile.tsx

@@ -2,7 +2,7 @@ import MainFrame from "../../components/MainFrame"
 
 const Profile = () => {
   return (
-    <MainFrame title="Pofile">
+    <MainFrame >
 
     </MainFrame>
   )

src/Pages/Reporting/Reporting.tsx

@@ -3,7 +3,7 @@ import MainFrame from "../../components/MainFrame"
 const Reporting = () => {
   return (
     
-    <MainFrame title="Manage Report">
+    <MainFrame >
 
     </MainFrame>
   )

src/Pages/SubAdmin/SubAdmin.tsx

@@ -3,7 +3,7 @@ import MainFrame from "../../components/MainFrame"
 const SubAdmin = () => {
   return (
     
-    <MainFrame title="Manage Subadmin">
+    <MainFrame >
 
     </MainFrame>
   )

src/Pages/Support/Support.tsx

@@ -3,7 +3,7 @@ import MainFrame from "../../components/MainFrame"
 const Support = () => {
   return (
     
-    <MainFrame title="Manage Support">
+    <MainFrame >
 
     </MainFrame>
   )