From ee694d62eb34b825bccf4d0a6cbb299c6bde2a6e Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Sun, 3 Feb 2019 15:32:24 -0500
Subject: [PATCH] Fix fixed background issue
---
src/App.js | 3 +--
src/App.scss | 14 ++++++++++----
src/App.vue | 3 ++-
3 files changed, 13 insertions(+), 7 deletions(-)
diff --git a/src/App.js b/src/App.js
index 83a61d392..23f6cb785 100644
--- a/src/App.js
+++ b/src/App.js
@@ -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})`
}
},
diff --git a/src/App.scss b/src/App.scss
index d3721b324..dedc294d8 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -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;
}
diff --git a/src/App.vue b/src/App.vue
index 833608ea5..8a4e02c47 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -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>
--
GitLab