From 5802927a40701c9669dcda4acaf83f15ee4d53d2 Mon Sep 17 00:00:00 2001
From: Jatin Lodhi <90623311+Jatin123lodhi@users.noreply.github.com>
Date: Mon, 21 Oct 2024 00:37:28 +0530
Subject: [PATCH] Made the breadcrumb sticky (#1473)

---
 src/components/CourseView.tsx | 4 ++--
 src/components/Sidebar.tsx    | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/CourseView.tsx b/src/components/CourseView.tsx
index 45f5689f9..2924e5d20 100644
--- a/src/components/CourseView.tsx
+++ b/src/components/CourseView.tsx
@@ -38,8 +38,8 @@ export const CourseView = ({
     ? 'folder'
     : courseContent?.value.type;
   return (
-    <div className="flex w-full flex-col gap-8 pb-16 pt-8 xl:pt-[9px]">
-      <div className="flex flex-col gap-4 xl:pt-2">
+    <div className="flex w-full flex-col gap-8 pb-16 pt-8 xl:pt-[9px] relative">
+      <div className="flex flex-col gap-4 xl:pt-2 sticky z-10 top-[120px] py-2 bg-background">
         <BreadCrumbComponent
           course={course}
           contentType={contentType}
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index d113df33b..c6ebfdf50 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -186,7 +186,7 @@ export function Sidebar({
   );
 
   return (
-    <>
+    <div className='sticky top-[72px] z-20 bg-background py-2'>
       <Button
         ref={buttonRef}
         onClick={() => setSidebarOpen((s) => !s)}
@@ -223,7 +223,7 @@ export function Sidebar({
           </motion.div>
         )}
       </AnimatePresence>
-    </>
+    </div>
   );
 }