From 07dc19523479b803c8606d700e71dcf903660757 Mon Sep 17 00:00:00 2001 From: shpuld Date: Sun, 12 Nov 2017 20:24:20 +0200 Subject: Add a hack to a hack to make it look much less hacky. --- src/App.js | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) (limited to 'src/App.js') diff --git a/src/App.js b/src/App.js index 1da3ff7c..61ef91bb 100644 --- a/src/App.js +++ b/src/App.js @@ -23,6 +23,18 @@ export default { style () { return { 'background-image': `url(${this.background})` } }, sitename () { return this.$store.state.config.name } }, + created () { + // this is to detect user zooming mostly + window.addEventListener('resize', this.fixSidebarWidth) + }, + mounted () { + // for some reason, at least in dev mode, dom is not ready enough at this point + // in theory calling the function directly here should be enough, but it's not + setTimeout( () => { this.fixSidebarWidth() }, 500) + }, + destroyed () { + window.removeEventListener('resize', this.fixSidebarWidth) + }, methods: { activatePanel (panelName) { this.mobileActivePanel = panelName @@ -32,6 +44,17 @@ export default { }, logout () { this.$store.dispatch('logout') + }, + fixSidebarWidth () { + // firefox + let barwidth = window.innerWidth - document.body.offsetWidth + if (document.body.offsetWidth <= 0) { + // chromium + barwidth = window.innerWidth - document.body.scrollWidth + } + // adjust the sidebar size to fit the scrollbar width to keep the gap consistently sized + document.getElementById("sidebar-container").style.width = `${345 + barwidth}px` + document.getElementById("sidebar-container").style.paddingRight = `${barwidth}px` } } } -- cgit v1.2.3-70-g09d2 From 8745fd4bdfb149803163e7fbf857d3c731c45926 Mon Sep 17 00:00:00 2001 From: shpuld Date: Sun, 12 Nov 2017 20:42:26 +0200 Subject: please the linter --- src/App.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'src/App.js') diff --git a/src/App.js b/src/App.js index 61ef91bb..3823bd03 100644 --- a/src/App.js +++ b/src/App.js @@ -30,7 +30,7 @@ export default { mounted () { // for some reason, at least in dev mode, dom is not ready enough at this point // in theory calling the function directly here should be enough, but it's not - setTimeout( () => { this.fixSidebarWidth() }, 500) + setTimeout(() => { this.fixSidebarWidth() }, 500) }, destroyed () { window.removeEventListener('resize', this.fixSidebarWidth) @@ -53,8 +53,8 @@ export default { barwidth = window.innerWidth - document.body.scrollWidth } // adjust the sidebar size to fit the scrollbar width to keep the gap consistently sized - document.getElementById("sidebar-container").style.width = `${345 + barwidth}px` - document.getElementById("sidebar-container").style.paddingRight = `${barwidth}px` + document.getElementById('sidebar-container').style.width = `${345 + barwidth}px` + document.getElementById('sidebar-container').style.paddingRight = `${barwidth}px` } } } -- cgit v1.2.3-70-g09d2