From 9eb9cf5153160e38a25dbbdeeb223fac769879db Mon Sep 17 00:00:00 2001
From: Percy Ma <kecrily@gmail.com>
Date: Sun, 4 Dec 2022 16:56:10 +0800
Subject: [PATCH] fix(web): reduce page jitter on browsers that support overlay
scrollbar (#21850)
Reduce jitter caused by the presence or absence of scrollbars in page
switching
---
Ref [scrollbar-gutter |
MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-gutter)
https://user-images.githubusercontent.com/45708948/165972251-7d5a5017-f76d-4ba2-9106-a224b3ee521f.mp4
---
web_src/less/_base.less | 7 +++++++
1 file changed, 7 insertions(+)
diff --git a/web_src/less/_base.less b/web_src/less/_base.less
index 14b69dec49..e156ccd6cc 100644
--- a/web_src/less/_base.less
+++ b/web_src/less/_base.less
@@ -222,6 +222,13 @@ body {
overflow-wrap: break-word;
}
+@supports (overflow: overlay) {
+ body {
+ overflow: overlay;
+ scrollbar-gutter: stable;
+ }
+}
+
img {
border-radius: 3px;
}