Fix fixed background issue

This commit is contained in:
taehoon 2019-02-03 15:32:24 -05:00
parent 7115584882
commit ee694d62eb
3 changed files with 13 additions and 7 deletions

View file

@ -66,9 +66,8 @@ export default {
})
},
logo () { return this.$store.state.instance.logo },
style () {
bgStyle () {
return {
'--body-background-image': `url(${this.background})`,
'background-image': `url(${this.background})`
}
},

View file

@ -1,15 +1,21 @@
@import './_variables.scss';
#app {
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: 0 50px;
min-height: 100vh;
max-width: 100%;
overflow: hidden;
}
.app-bg-wrapper {
position: fixed;
z-index: -1;
height: 100%;
width: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: 0 50%;
}
i {
user-select: none;
}

View file

@ -1,5 +1,6 @@
<template>
<div id="app" v-bind:style="style">
<div id="app">
<div class="app-bg-wrapper" v-bind:style="bgStyle"></div>
<nav class='nav-bar container' @click="scrollToTop()" id="nav">
<div class='logo' :style='logoBgStyle'>
<div class='mask' :style='logoMaskStyle'></div>