diff options
| -rw-r--r-- | app/javascript/packs/public.js | 8 | ||||
| -rw-r--r-- | app/javascript/styles/mastodon/about.scss | 2 |
2 files changed, 9 insertions, 1 deletions
diff --git a/app/javascript/packs/public.js b/app/javascript/packs/public.js index a86dc7831..4ab27c769 100644 --- a/app/javascript/packs/public.js +++ b/app/javascript/packs/public.js @@ -108,6 +108,14 @@ function main() { if (parallaxComponents.length > 0 ) { new Rellax('.parallax', { speed: -1 }); } + + if (document.body.classList.contains('with-modals')) { + const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth; + const scrollbarWidthStyle = document.createElement('style'); + scrollbarWidthStyle.id = 'scrollbar-width'; + document.head.appendChild(scrollbarWidthStyle); + scrollbarWidthStyle.sheet.insertRule(`body.with-modals--active { margin-right: ${scrollbarWidth}px; }`, 0); + } }); delegate(document, '.webapp-btn', 'click', ({ target, button }) => { diff --git a/app/javascript/styles/mastodon/about.scss b/app/javascript/styles/mastodon/about.scss index 47ac9265b..c6f249fab 100644 --- a/app/javascript/styles/mastodon/about.scss +++ b/app/javascript/styles/mastodon/about.scss @@ -364,7 +364,7 @@ $small-breakpoint: 960px; @media screen and (max-width: $column-breakpoint) { .grid { - grid-template-columns: auto; + grid-template-columns: 100%; .column-0 { display: block; |