Fix isMobile detection

This commit is contained in:
2026-05-10 20:03:56 +02:00
parent 8385c85820
commit 4c34994ac7
3 changed files with 7 additions and 15 deletions

View File

@@ -34,6 +34,10 @@ export default {
},
inject: ['appConfig'],
created() {
this.mobileMediaQuery = window.matchMedia('only screen and (max-width: 800px)');
this.mobileMediaQuery.addEventListener('change', this.updateMobile);
this.updateMobile();
//Set initial page
let asInitHash = this.getBrowserHash();
if(!asInitHash.page) asInitHash.page = this.consts.default_page;
@@ -42,8 +46,6 @@ export default {
mounted() {
//Catch browser hash change
window.addEventListener('hashchange', this.onBrowserHashChange);
window.addEventListener('resize', this.updateMobile);
this.updateMobile();
},
watch: {
hashSnapshot(jNewHash, jOldHash) {
@@ -61,7 +63,7 @@ export default {
return this.mobile;
},
updateMobile() {
this.mobile = getComputedStyle(this.$refs.mobile).display !== 'none';
this.mobile = this.mobileMediaQuery.matches;
},
setPageTitle(sTitle) {
document.title = this.consts.title + ' - ' + sTitle.trim();
@@ -88,7 +90,7 @@ export default {
},
beforeUnmount() {
window.removeEventListener('hashchange', this.onBrowserHashChange);
window.removeEventListener('resize', this.updateMobile);
this.mobileMediaQuery.removeEventListener('change', this.updateMobile);
}
}
</script>
@@ -96,5 +98,4 @@ export default {
<div id="main">
<component :is="route" />
</div>
<div id="mobile" ref="mobile"></div>
</template>

View File

@@ -147,9 +147,3 @@ h2 {
}
}
}
/* Mobile */
#mobile {
display: none;
}

View File

@@ -67,7 +67,4 @@
}
}
#mobile {
display: block;
}
}
}