Merge pull request #47 from wordigo/fix/dash

fix: dashboard
wordigo · Nov 4, 2023 · 07bb8b8 · 07bb8b8
2 parents 87cca9b + fc240f7
commit 07bb8b8
Show file tree

Hide file tree

Showing 8 changed files with 7,899 additions and 7,908 deletions.
diff --git a/apps/next/src/components/Layout/Dashboard/DashboardHeader/Navigation.tsx b/apps/next/src/components/Layout/Dashboard/DashboardHeader/Navigation.tsx
@@ -5,11 +5,11 @@ import Link from "next/link";
 const Navigation = ({ variant }: { variant?: "borgerMenu" }) => {
   const classes = cn(
     "w-full",
-    variant === "borgerMenu" ? "flex-col flex" : "flex items-center gap-3"
+    variant === "borgerMenu" ? "flex-col flex" : "flex items-center gap-6"
   );
 
   return (
-    <ul className="flex items-center font-sm mt-1  w-full">
+    <ul className="flex items-center mt-1 w-full">
       <li className={cn(classes)}>
         <Navigation.Item variant={variant} />
       </li>
@@ -44,7 +44,7 @@ Navigation.Item = ({ variant }: { variant: string }) => {
           passHref
           key={index}
           className={cn(
-            "flex items-center w-full transition-colors text-muted-foreground text-sm hover:text-accent-foreground font-medium group relative",
+            "flex items-center w-full transition-colors text-gray-600 text-sm hover:text-accent-foreground group relative",
             variant === "borgerMenu" &&
               "p-3  rounded-[6px] hover:bg-[#F8FAFC] dark:hover:bg-[#101929] mb-1",
             classes_hover,

diff --git a/apps/next/src/components/Layout/Dashboard/DashboardHeader/index.tsx b/apps/next/src/components/Layout/Dashboard/DashboardHeader/index.tsx
@@ -27,19 +27,19 @@ export default function HomeHeader({ className }: { className?: string }) {
   };
 
   return (
-    <>
+    <div className="border-b border-[#E2E8F0] fixed w-full z-50">
       <div
         className={cn(
-          "w-full fixed max-w-[90rem] bg-LightBackground dark:bg-DarkBackground z-50",
+          "w-full max-w-[90rem] bg-LightBackground dark:bg-DarkBackground m-auto",
           className
         )}
       >
-        <nav className="flex items-center justify-between w-full m-auto py-[1.125rem] px-20 max-md:px-4 max-8xl:px-5">
+        <nav className="flex items-center justify-between w-full m-auto py-[0.8rem] max-md:px-4 max-8xl:px-5">
           <div className="flex items-center">
             <Link
               href="/"
               className={cn(
-                "flex items-center mr-6 justify-center",
+                "flex items-center mr-12 justify-center",
                 !toggleMenu && "hidden"
               )}
             >
@@ -151,6 +151,6 @@ export default function HomeHeader({ className }: { className?: string }) {
           </motion.div>
         )}
       </AnimatePresence>
-    </>
+    </div>
   );
 }
diff --git a/apps/next/src/components/Layout/Dashboard/Sidebar/Menu.tsx b/apps/next/src/components/Layout/Dashboard/Sidebar/Menu.tsx
@@ -2,10 +2,8 @@ import DashboardNav from "./Navigation";
 
 export default function BurgerMenu() {
   return (
-    <div className="col-span-1 flex flex-col justify-between md:top-50 top-50 !h-20 md:!h-full sticky top-[60px] py-4 md:py-8 z-40 text-light_text dark:text-white dark:bg-DarkBackground bg-LightBackground border-t md:border-t-0 g-red-500 md:min-w-[250px] md:max-w-[250px] max-[1022px]:hidden">
-      <aside className="flex w-full md:flex-col">
-        <DashboardNav />
-      </aside>
+    <div className="col-span-1 flex mt-[68px] z-10 flex-col justify-between top-[68px] !h-20 md:!h-full py-4 md:py-8 text-light_text dark:text-white dark:bg-DarkBackground bg-LightBackground border-t md:border-t-0 g-red-500 md:min-w-[250px] md:max-w-[250px] max-[1022px]:hidden">
+      <DashboardNav />
     </div>
   );
 }
diff --git a/apps/next/src/components/Layout/Dashboard/Sidebar/Navigation.tsx b/apps/next/src/components/Layout/Dashboard/Sidebar/Navigation.tsx
@@ -34,7 +34,7 @@ DashboardNav.Item = (item: SidebarNavItem, index: number) => {
   const router = useRouter();
 
   const classes = cn(
-    "flex flex-col hover:text-accent-foreground rounded-[6px] font-medium group relative mb-1 hover:bg-[#F8FAFC] dark:hover:bg-[#101929]",
+    "flex flex-col hover:text-accent-foreground rounded-[6px] font-medium  group relative mb-1 hover:bg-[#F8FAFC] dark:hover:bg-[#101929]",
     path === item.href
       ? "text-accent-foreground bg-[#F1F5F9] dark:bg-[#101929]"
       : "transparent",
@@ -47,7 +47,7 @@ DashboardNav.Item = (item: SidebarNavItem, index: number) => {
         <span className="flex items-center w-full">
           <div className="flex items-center">
             <div>{item.icon}</div>
-            <span className="ml-2 hidden md:block">{item.title}</span>
+            <p className="ml-2 hidden md:block text-[14px]">{item.title}</p>
           </div>
         </span>
       </Link>
@@ -61,7 +61,7 @@ DashboardNav.ChildItem = ({ navs, trigger, loading }: SidebarChildNav) => {
     <Fragment>
       <div
         tabIndex={50}
-        className="text-sm z-50 hidden md:flex absolute font-medium right-3 top-2 items-center justify-center"
+        className="z-40 hidden md:flex absolute right-3 top-2 items-center justify-center"
       >
         {trigger}
       </div>

diff --git a/apps/next/src/components/Layout/Dashboard/Sidebar/navigations.constants.tsx b/apps/next/src/components/Layout/Dashboard/Sidebar/navigations.constants.tsx
@@ -80,9 +80,9 @@ const useSidebarNavigations = (): SidebarNavItem[] => {
             {isLoading ? (
               <RotateCw className="h-3 w-3 animate-spin" />
             ) : showDictionary ? (
-              <ChevronDown size={12} />
+              <ChevronDown size={9} />
             ) : (
-              <ChevronUp size={"12"} />
+              <ChevronUp size={"9"} />
             )}
           </Button>
         ),
@@ -102,11 +102,7 @@ const useSidebarNavigations = (): SidebarNavItem[] => {
             size="icon"
             className="w-fit h-fit p-1"
           >
-            {showSettings ? (
-              <ChevronDown size={12} />
-            ) : (
-              <ChevronUp size={"12"} />
-            )}
+            {showSettings ? <ChevronDown size={9} /> : <ChevronUp size={"9"} />}
           </Button>
         ),
         loading: false,

diff --git a/apps/next/src/components/Layout/Dashboard/index.tsx b/apps/next/src/components/Layout/Dashboard/index.tsx
@@ -16,14 +16,11 @@ export default function DashboardLayout({ children }: DashboardLayoutProps) {
   if (session.status !== "authenticated" || !token) return <PageLoader />;
 
   return (
-    <main className="max-w-[90rem] m-auto">
+    <main>
       <DashboardHeader />
-      <div className="m-auto flex px-20 max-8xl:px-5 max-[1022px]:px-0">
+      <div className="max-w-[90rem] m-auto flex max-8xl:px-5 max-[1022px]:px-0">
         <Sidebar />
-        <section className="py-4 px-4 md:py-8 md:px- w-full m-auto overflow-auto mt-5 max-[1022px]:px-5">
-          <main className="flex items-center justify-between w-full mb-6">
-            <Breadcrumb />
-          </main>
+        <section className="pl-10 md:py-8 w-full m-auto overflow-auto mt-[60px] max-[1022px]:mt-[100px] max-[1022px]:px-5">
           {children}
         </section>
       </div>

diff --git a/package-lock.json b/package-lock.json