Reimplemented XML Tools and added styling (#227)

Co-authored-by: Adam Bem <adam.bem@zoho.eu>
Reviewed-on: #227
Reviewed-by: Mikolaj Widla <widlam@noreply.example.com>

Frontend/src/App.vue

@@ -1,21 +1,14 @@
 <script setup lang="ts">
-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>
-  <div id="layout" class="flex dark:bg-gray-700">
+  <div id="layout" class="flex bg-gradient-to-r from-white to-blue-200 dark:from-slate-800 dark:to-indigo-950">
     <SidebarComponent />
-    <div class="relative p-12 w-11/12">
+    <div class="relative p-6 w-full m-4 bg-indigo-50 dark:bg-gray-700 rounded-2xl shadow-md">
       <RouterView></RouterView>
     </div>
   </div>