yoroi-frontend icon indicating copy to clipboard operation
yoroi-frontend copied to clipboard

Replace overlay value for overflow css prop

Open nistadev opened this issue 3 years ago • 1 comments

Context This fixes a bug where firefox users are not able to send assets due to layout shift and not able to scroll down as seen in this video: https://user-images.githubusercontent.com/22194171/184313659-9704a878-bc7e-4cbd-a9ce-7fe28fe749f9.mp4

The cause was this css prop overflow: overlay which is only compatible with 76.36% of browsers and is a deprecated prop. Refer to the table above from MDN too: image

The property overflow: auto works aswell but the difference is that takes a little space on the layout for the scroll. Until overlay is supported, we still have to use auto as there is no fallback for this.

The overlay value of the overflow CSS property is a non-standard value to make scrollbars appear on top of content rather than take up space. This value is deprecated and related functionality being standardized as the scrollbar-gutter property.

I replaced all occurrences of the value to avoid other layout bugs caused by this incompatible prop.

nistadev avatar Aug 12 '22 08:08 nistadev

Nice! That's great 💯 @nistadev

neuodev avatar Aug 12 '22 13:08 neuodev