From 1f768be0485bbfa6b542dd24183fe8389acb9355 Mon Sep 17 00:00:00 2001
From: Md Saban <45597394+mdsaban@users.noreply.github.com>
Date: Sat, 12 Oct 2024 18:37:20 +0530
Subject: feature(web): Introduce a new sticky navbar. Fixes 520  (#515)

* ui: add global header

* fix: design fixes

* fix: tests

* fix navbar background, hide y scrollbar and change sidebar footer to show version

---------

Co-authored-by: MohamedBassem <me@mbassem.com>
---
 apps/web/app/dashboard/layout.tsx | 30 +++++++++++++++++-------------
 1 file changed, 17 insertions(+), 13 deletions(-)

(limited to 'apps/web/app/dashboard/layout.tsx')

diff --git a/apps/web/app/dashboard/layout.tsx b/apps/web/app/dashboard/layout.tsx
index b0ac1f7d..cbd51245 100644
--- a/apps/web/app/dashboard/layout.tsx
+++ b/apps/web/app/dashboard/layout.tsx
@@ -1,3 +1,4 @@
+import Header from "@/components/dashboard/header/Header";
 import MobileSidebar from "@/components/dashboard/sidebar/ModileSidebar";
 import Sidebar from "@/components/dashboard/sidebar/Sidebar";
 import DemoModeBanner from "@/components/DemoModeBanner";
@@ -14,20 +15,23 @@ export default async function Dashboard({
   modal: React.ReactNode;
 }>) {
   return (
-    <div className="flex min-h-screen w-screen flex-col sm:h-screen sm:flex-row">
-      <ValidAccountCheck />
-      <div className="hidden flex-none sm:flex">
-        <Sidebar />
-      </div>
-      <main className="flex-1 bg-muted sm:overflow-y-auto">
-        {serverConfig.demoMode && <DemoModeBanner />}
-        <div className="block w-full sm:hidden">
-          <MobileSidebar />
-          <Separator />
+    <div>
+      <Header />
+      <div className="flex min-h-[calc(100vh-64px)] w-screen flex-col sm:h-[calc(100vh-64px)] sm:flex-row">
+        <ValidAccountCheck />
+        <div className="hidden flex-none sm:flex">
+          <Sidebar />
         </div>
-        {modal}
-        <div className="container min-h-screen p-4">{children}</div>
-      </main>
+        <main className="flex-1 bg-muted sm:overflow-y-auto">
+          {serverConfig.demoMode && <DemoModeBanner />}
+          <div className="block w-full sm:hidden">
+            <MobileSidebar />
+            <Separator />
+          </div>
+          {modal}
+          <div className="min-h-30 container p-4">{children}</div>
+        </main>
+      </div>
     </div>
   );
 }
-- 
cgit v1.2.3-70-g09d2