diff --git a/apps/client/src/pages/dashboard/resumes/page.tsx b/apps/client/src/pages/dashboard/resumes/page.tsx
index 4a2b3c09..0bd8b3c6 100644
--- a/apps/client/src/pages/dashboard/resumes/page.tsx
+++ b/apps/client/src/pages/dashboard/resumes/page.tsx
@@ -50,8 +50,8 @@ export const ResumesPage = () => {
         </div>
 
         <ScrollArea
+          allowOverflow
           className="h-[calc(100vh-140px)] overflow-visible lg:h-[calc(100vh-88px)]"
-          allowOverflow={true}
         >
           <TabsContent value="grid">
             <GridView />
diff --git a/libs/ui/src/components/scroll-area.tsx b/libs/ui/src/components/scroll-area.tsx
index b85cee66..7811db39 100644
--- a/libs/ui/src/components/scroll-area.tsx
+++ b/libs/ui/src/components/scroll-area.tsx
@@ -5,9 +5,9 @@ import { forwardRef } from "react";
 export const ScrollArea = forwardRef<
   React.ElementRef<typeof ScrollAreaPrimitive.Root>,
   React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root> & {
+    allowOverflow?: boolean;
     hideScrollbar?: boolean;
     orientation?: "vertical" | "horizontal";
-    allowOverflow?: boolean;
   }
 >(
   (
@@ -29,8 +29,7 @@ export const ScrollArea = forwardRef<
       {...props}
     >
       <ScrollAreaPrimitive.Viewport
-        className="size-full rounded-[inherit]"
-        style={allowOverflow ? { overflowX: "visible", overflowY: "visible" } : {}}
+        className={cn("size-full rounded-[inherit]", allowOverflow && "!overflow-visible")}
       >
         {children}
       </ScrollAreaPrimitive.Viewport>