diff --git a/Frontend/src/App.vue b/Frontend/src/App.vue
index acfd065..65660b2 100644
--- a/Frontend/src/App.vue
+++ b/Frontend/src/App.vue
@@ -3,13 +3,7 @@ import { onMounted, ref } from 'vue';
 import { RouterView } from 'vue-router';
 import SidebarComponent from '@components/sidebar/SidebarComponent.vue';
 
-const activeToolBox = ref('');
 
-
-
-onMounted(() => {
-  activeToolBox.value = "xml";
-});
 </script>
 
 <template>
diff --git a/Frontend/src/components/sidebar/SidebarComponent.vue b/Frontend/src/components/sidebar/SidebarComponent.vue
index 35313d1..e8ab267 100644
--- a/Frontend/src/components/sidebar/SidebarComponent.vue
+++ b/Frontend/src/components/sidebar/SidebarComponent.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref , onMounted, watch } from 'vue'
+import { ref , onMounted, watch, onUpdated } from 'vue'
 import SidebarToolLinkComponent from './SidebarToolLinkComponent.vue';
 import SidebarMenuElementComponent from './SidebarMenuElementComponent.vue';
 import logoDark from '@assets/logo_biale.svg';
@@ -18,7 +18,7 @@ function isDarkModeSet(){
 
 onMounted( () => {
     changeLogoForTheme();
-} )
+})
 
 </script>
 
diff --git a/Frontend/src/components/sidebar/SidebarMenuElementComponent.vue b/Frontend/src/components/sidebar/SidebarMenuElementComponent.vue
index f7d45a6..0dd42af 100644
--- a/Frontend/src/components/sidebar/SidebarMenuElementComponent.vue
+++ b/Frontend/src/components/sidebar/SidebarMenuElementComponent.vue
@@ -17,7 +17,7 @@ const props = defineProps(
 
 
 <template>
-    <div class="mb-4 bg-gradient-to-r from-blue-400 to-blue-200 dark:from-blue-700 dark:to-indigo-900 p-2 rounded-xl w-full shadow-md">
+    <div class="w-full mb-4 p-2 rounded-xl  shadow-md bg-gradient-to-r from-blue-400 to-blue-200 dark:from-blue-600 dark:to-blue-900">
         <button @click="switchHiddenElement()" type="button" :class="[isActive ? 'rounded-lg' : 'rounded-lg']" class="w-full p-2 text-lg font-bold text-gray-900 transition duration-75 hover:bg-blue-100 dark:text-gray-100  dark:hover:bg-slate-600">
             <span class="flex-1 whitespace-nowrap">{{props.categoryName}}</span>
         </button>
diff --git a/Frontend/src/components/sidebar/SidebarToolLinkComponent.vue b/Frontend/src/components/sidebar/SidebarToolLinkComponent.vue
index f85e7e7..5a1b5c4 100644
--- a/Frontend/src/components/sidebar/SidebarToolLinkComponent.vue
+++ b/Frontend/src/components/sidebar/SidebarToolLinkComponent.vue
@@ -11,7 +11,7 @@ const props = defineProps(
 
 <template>
     <RouterLink
-        class="w-full text-center py-2 px-4 text-gray-800 transition duration-75 hover:bg-blue-200 dark:text-white dark:hover:bg-slate-600"
+        class="w-full text-center py-2 px-4 text-gray-800 transition duration-75 hover:bg-blue-100 dark:text-white dark:hover:bg-slate-600"
         :to="props.pathTo">{{ props.elementContent }}</RouterLink>
 </template>