AmruthPillai / Reactive-Resume

A one-of-a-kind resume builder that keeps your privacy in mind. Completely secure, customizable, portable, open-source and free forever. Try it out today!
https://rxresu.me
MIT License
25.89k stars 2.65k forks source link

bugfix: Fixed clipping issue with cards on dashboard page #2035

Open noreb001 opened 2 months ago

noreb001 commented 2 months ago

Issue

Fixed Card clipping issue on Dashboard page in grid view. Where the sides of the card where being clipped once the hover animation is triggered.

BEFORE

desktop image

Mobile image

AFTER Desktop image

Mobile image

Explanation: By default ScrollAreaPrimitive.Root sets the class name to 'overflow-hidden'. Then passing a classname with 'overflow-visible' to the scroll-area UI component is not enough. "ScrollAreaPrimitiv.Viewport" applies some extra default styles if the props type='scroll'. I have added a boolean prop type that allows us to disable this and allow bot overflowX and overflowY to be visible in the scenarios where we need it.

Let me know if you need more information.