From f1724fb5ea430cb3c4ff4270c3edf0a07f5d8e35 Mon Sep 17 00:00:00 2001
From: Kasper Seweryn <github@wvffle.net>
Date: Sun, 1 May 2022 13:50:32 +0200
Subject: [PATCH] Fix double #app id

---
 front/src/App.vue                    |  1 -
 front/src/style/globals/_layout.scss | 12 ++++++------
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/front/src/App.vue b/front/src/App.vue
index ed2fa749c..c5a4a6f49 100644
--- a/front/src/App.vue
+++ b/front/src/App.vue
@@ -119,7 +119,6 @@ const showSetInstanceModal = ref(false)
 
 <template>
   <div
-    id="app"
     :key="String(store.state.instance.instanceUrl)"
     :class="[store.state.ui.queueFocused ? 'queue-focused' : '',
              {'has-bottom-player': store.state.queue.tracks.length > 0}]"
diff --git a/front/src/style/globals/_layout.scss b/front/src/style/globals/_layout.scss
index b7cfab2a7..1454de064 100644
--- a/front/src/style/globals/_layout.scss
+++ b/front/src/style/globals/_layout.scss
@@ -28,7 +28,7 @@
     justify-content: space-between !important;
   }
 }
-#app:not(.queue-focused) {
+#app > :not(.queue-focused) {
   .when-queue-focused {
     @include media("<desktop") {
       display: none;
@@ -36,7 +36,7 @@
   }
 }
 
-#app {
+#app > div {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   display: flex;
@@ -54,12 +54,12 @@
   border-bottom: none;
   border-top: 1px solid rgba(34, 36, 38, 0.15);
 }
-#app > main, #app > .main {
+#app > div > main, #app > .main {
   flex: 1;
 }
 
 
-#app {
+#app > div {
   > .main.pusher,
   > .footer {
     position: relative;
@@ -144,7 +144,7 @@
     }
   }
 }
-#app.queue-focused {
+#app > .queue-focused {
   .queue-not-focused {
     @include media("<desktop") {
       display: none;
@@ -181,4 +181,4 @@
   overflow: auto;
   position: absolute;
   width: auto;
-}
\ No newline at end of file
+}