fix: ensure last item is visible

code100x · Nov 11, 2024 · 204c496 · 204c496
1 parent ec94a77
commit 204c496
Showing 1 changed file with 5 additions and 3 deletions.
diff --git 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'>
+    <div className="sticky top-[72px] z-20 bg-background py-2">
       <Button
         ref={buttonRef}
         onClick={() => setSidebarOpen((s) => !s)}
@@ -206,7 +206,9 @@ export function Sidebar({
             variants={sidebarVariants}
             className="fixed right-0 top-0 z-[99999] flex h-screen w-full flex-col gap-4 overflow-y-auto rounded-r-lg border-l border-primary/10 bg-neutral-50 dark:bg-neutral-900 md:max-w-[30vw]"
           >
-            <div className="sticky top-0 z-10 flex items-center justify-between border-b border-primary/10 bg-neutral-50 p-5 dark:bg-neutral-900">              <h4 className="text-xl font-bold tracking-tighter text-primary lg:text-2xl">
+            <div className="sticky top-0 z-10 flex items-center justify-between border-b border-primary/10 bg-neutral-50 p-5 dark:bg-neutral-900">
+              {' '}
+              <h4 className="text-xl font-bold tracking-tighter text-primary lg:text-2xl">
                 Course Content
               </h4>
               <Button
@@ -217,7 +219,7 @@ export function Sidebar({
                 <X className="size-5" />
               </Button>
             </div>
-            <Accordion type="multiple" className="w-full px-4 capitalize">
+            <Accordion type="multiple" className="w-full px-4 pb-20 capitalize">
               {memoizedContent}
             </Accordion>
           </motion.div>