From f24a4e5b5b2d6e46b54c25eecb4486da756bd982 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fernando=20Fern=C3=A1ndez?= <ferferga@hotmail.com>
Date: Wed, 25 Jan 2023 19:47:55 +0100
Subject: [PATCH] fix: backdrop borking v-app

Backdrop was breaking v-app's behaviour. The order of the elements is important for things like v-hover to work properly
---
 frontend/src/App.vue                        | 2 +-
 frontend/src/components/Layout/Backdrop.vue | 6 ++++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 0f09497b015..d7ea9d9181e 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -1,6 +1,6 @@
 <template>
+  <backdrop />
   <v-app>
-    <backdrop />
     <router-view-transition is-root />
     <snackbar />
     <player-element />
diff --git a/frontend/src/components/Layout/Backdrop.vue b/frontend/src/components/Layout/Backdrop.vue
index e551ee1b938..42c0b2f1b24 100644
--- a/frontend/src/components/Layout/Backdrop.vue
+++ b/frontend/src/components/Layout/Backdrop.vue
@@ -19,6 +19,12 @@ const opacity = computed(() => route.meta.backdrop?.opacity || 0.25);
 .backdrop {
   background-color: rgb(var(--v-theme-background));
   opacity: v-bind(opacity);
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  background-size: cover;
 
   & canvas {
     position: fixed;