authorgravatar for julius0216@outlook.comJulius Marminge <julius0216@outlook.com> 2026-06-04 14:31:24-07:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-06-04 14:31:24-07:00
logb0fa60a121bd55f88c2432b1e29ec694c3d76863
tree5fb91e3cdb2aaac8151c58d460218c413cf59b58
parent348a9140e9d352fdcb1779d467b4b68000b61bdf
signature Signed by PGP key B5690EEEBB952194

Prevent settings layout shifts with scrollbar gutters (#2960)

2 files changed, 2 insertions(+), 2 deletions(-)

apps/web/src/components/settings/settingsLayout.tsx+1-1
......@@ -127,7 +127,7 @@ export function SettingsPageContainer({
127127 className?: string;
128128}) {
129129 return (
130 <div className="flex-1 overflow-y-auto p-6 sm:p-8">
130 <div className="scrollbar-gutter-both flex-1 overflow-y-auto p-6 sm:p-8">
131131 <div className={cn("mx-auto flex w-full max-w-3xl flex-col gap-8", className)}>
132132 {children}
133133 </div>
apps/web/src/components/ui/scroll-area.tsx+1-1
......@@ -29,7 +29,7 @@ function ScrollArea({
2929 chainVerticalScroll && "overscroll-y-auto",
3030 scrollFade &&
3131 "mask-t-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-y-start)))] mask-b-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-y-end)))] mask-l-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-x-start)))] mask-r-from-[calc(100%-min(var(--fade-size),var(--scroll-area-overflow-x-end)))] [--fade-size:1.5rem]",
32 scrollbarGutter && "[scrollbar-gutter:stable]",
32 scrollbarGutter && "scrollbar-gutter-stable",
3333 hideScrollbars &&
3434 "[-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
3535 )}