Unfloyded/Legamunt
0
0
Fork 0
Code Activity

Change single-column mode to scroll the whole page (#11359)

Browse source 
Fix #10840
This commit is contained in:
Eugen Rochko 2019-07-19 09:25:22 +02:00 • committed by GitHub
parent 4fa6472523
commit aa22b38fdb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
25 changed files with 162 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

24
app/javascript/mastodon/features/ui/components/modal_root.js
View file

@ -32,6 +32,28 @@ const MODAL_COMPONENTS = {
'LIST_ADDER':ListAdder,
};
let cachedScrollbarWidth = null;
export const getScrollbarWidth = () => {
if (cachedScrollbarWidth !== null) {
return cachedScrollbarWidth;
}
const outer = document.createElement('div');
outer.style.visibility = 'hidden';
outer.style.overflow = 'scroll';
document.body.appendChild(outer);
const inner = document.createElement('div');
outer.appendChild(inner);
const scrollbarWidth = outer.offsetWidth - inner.offsetWidth;
cachedScrollbarWidth = scrollbarWidth;
outer.parentNode.removeChild(outer);
return scrollbarWidth;
};
export default class ModalRoot extends React.PureComponent {
static propTypes = {
@ -47,8 +69,10 @@ export default class ModalRoot extends React.PureComponent {
componentDidUpdate (prevProps, prevState, { visible }) {
if (visible) {
document.body.classList.add('with-modals--active');
document.documentElement.style.marginRight = `${getScrollbarWidth()}px`;
} else {
document.body.classList.remove('with-modals--active');
document.documentElement.style.marginRight = 0;
}
}