Reworking the layouts to allow for the new design

src/views/main/SideBar.vue

@@ -1,12 +1,11 @@
 <script setup>
-import SiteMenu from "@/views/main/SiteMenu.vue";
 import SubscriptionList from "@/views/creators/SubscriptionList.vue";
-import { useAuthStore } from "@/stores/authStore.js";
-import { useRouter } from 'vue-router';
-import { ref } from "vue";
-import { useI18n } from 'vue-i18n';
+import {useAuthStore} from "@/stores/authStore.js";
+import {useRouter} from 'vue-router';
+import {ref} from "vue";
+import {useI18n} from 'vue-i18n';
 
-const { locale } = useI18n();
+const {locale} = useI18n();
 const router = useRouter();
 const selectedLanguage = ref(locale.value);
 
@@ -37,14 +36,12 @@ initializeLocale();
 </script>
 
 <template>
-  <nav class="flex flex-col h-full overflow-y-auto custom-scrollbar">
-    <div class="mt-16"></div>
-    
-
+  <nav class="flex flex-col h-full overflow-y-auto custom-scrollbar bg-white">
+   
     <div class="flex justify-center py-3">
       <v-btn v-if="authStore.isAuthenticated" variant="plain" class="p-8" @click="feedHandler">
         <img src="/images/hutopymedia/icons/feedfollow.svg" alt="feed follow icon"
-             style="filter: invert(0.5) brightness(0.0); width: 32px; height: 32px;" />
+             style="filter: invert(0.5) brightness(0.0); width: 32px; height: 32px;"/>
       </v-btn>
       <v-btn variant="plain" class="p-8" @click="explorerHandler">
         <v-icon style="font-size: 28px;">mdi-earth</v-icon>
@@ -61,25 +58,21 @@ initializeLocale();
 
 
     <div v-if="authStore.isAuthenticated" class="flex-grow px-5 py-4">
-     <div class="font-bold">  {{ $t('sidebar.subscriptionTitle') }}</div>       
+      <div class="font-bold"> {{ $t('sidebar.subscriptionTitle') }}</div>
       <div v-if="authStore.isAuthenticated" class="flex-grow px-5">
-    </div>
-       
+      </div>
+
       <subscription-list>
         <template v-slot:default>
           <span v-if="subscriptionListIsEmpty">Aucun abonnement</span>
         </template>
       </subscription-list>
     </div>
-    
-    <div v-else class="flex-grow px-5 py-4 flex justify-center font-bold ">      
+
+    <div v-else class="flex-grow px-5 py-4 flex justify-center font-bold ">
       <span>Connectez-vous</span>
     </div>
 
-    
-    <div class="border-t w-full py-10 mt-auto">
-      <SiteMenu></SiteMenu>
-    </div>
   </nav>
 </template>
 
@@ -92,7 +85,7 @@ nav {
 
 /* Firefox */
 .custom-scrollbar {
-  scrollbar-width: thin; 
+  scrollbar-width: thin;
   scrollbar-color: #903175 #f1f1f1;
 }