From 4d71afa8841223a150c00d0828906ff990c13c11 Mon Sep 17 00:00:00 2001
From: Insert5StarName <anime@shourai.de>
Date: Tue, 17 Oct 2023 08:23:10 +0200
Subject: [PATCH] fix: move background into seperate element to prevent it from
being funny
---
packages/frontend/src/pages/user/home.vue | 33 ++++++++++++-----------
1 file changed, 17 insertions(+), 16 deletions(-)
diff --git a/packages/frontend/src/pages/user/home.vue b/packages/frontend/src/pages/user/home.vue
index a3373ff257..d34221b397 100644
--- a/packages/frontend/src/pages/user/home.vue
+++ b/packages/frontend/src/pages/user/home.vue
@@ -154,6 +154,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<XListenBrainz v-if="user.listenbrainz && listenbrainzdata" :key="user.id" :user="user"/>
</div>
</div>
+ <div class="background"></div>
</MkSpacer>
</template>
@@ -359,23 +360,23 @@ onUnmounted(() => {
</script>
<style lang="scss" scoped>
+.background{
+ position: fixed;
+ z-index: -1;
+ background: var(--backgroundImageStatic);
+ background-size: cover;
+ background-position: center;
+ pointer-events: none;
+ filter: blur(8px) opacity(0.6);
+ // Funny CSS schenanigans to make background escape container
+ left: -100%;
+ top: -5%;
+ right: -100%;
+ bottom: -100%;
+ background-attachment: fixed;
+}
+
.ftskorzw {
- &::before {
- content: "";
- position: fixed;
- inset: 0;
- background: var(--backgroundImageStatic);
- background-size: cover;
- background-position: center;
- pointer-events: none;
- filter: blur(8px) opacity(0.6);
- // Funny CSS schenanigans to make background escape container
- left: -100%;
- top: -5%;
- right: -100%;
- bottom: -100%;
- background-attachment: fixed;
- }
> .main {