From 8110705d020a0025ce307a9c8ee5ba9bfe8e9323 Mon Sep 17 00:00:00 2001 From: kimsible Date: Mon, 13 Jul 2020 23:51:46 +0200 Subject: [PATCH] Fix: disable vertical scroll instead of hide on desktop browsers --- client/src/sass/application.scss | 4 ++++ client/src/sass/bootstrap.scss | 8 ++++++++ 2 files changed, 12 insertions(+) diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss index 4f753e041..5ca3b447a 100644 --- a/client/src/sass/application.scss +++ b/client/src/sass/application.scss @@ -57,6 +57,10 @@ body { color: pvar(--mainForegroundColor); background-color: pvar(--mainBackgroundColor); font-size: 14px; + // On desktop browsers, make sure vertical scroll bar is always visible + // Allow to disable the scrollbar instead of hide it when the content fit the body + // And not move the content and header horizontally sticked to right when the content is updating + overflow-y: scroll; } ::selection { diff --git a/client/src/sass/bootstrap.scss b/client/src/sass/bootstrap.scss index 0dc58a7c9..dd5824b7a 100644 --- a/client/src/sass/bootstrap.scss +++ b/client/src/sass/bootstrap.scss @@ -143,6 +143,14 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/'; } } + +// On desktop browsers, make the content and header horizontally sticked to right not move when modal open and close +.modal-open { + overflow-y: scroll !important; // Make sure vertical scroll bar is always visible on desktop browsers to get disabled scrollbar effect + position: fixed; // Fix the body position to disable any scroll content + width: 100vw; // Make sure the content fits all the available width when position: fixed +} + // Nav customizations .nav .nav-link { display: flex !important; -- 2.41.0