Fix theme switcher and improve 404 view layout

Updated NavbarThemeSwitcherComponent to use 'theme.value' instead of 'theme.label' for icon selection, ensuring correct theme icons are displayed. Enhanced NotFoundView layout by adding a wrapper div for improved styling and structure.

frontend/app/src/components/Navbar/NavbarThemeSwitcherComponent.vue

@@ -20,10 +20,10 @@
           @click="changeTheme(theme.value)"
           :aria-pressed="themeStore.theme === theme.value ? 'true' : 'false'"
         >
-          <span v-if="theme.label == 'Dark'" class="me-1"
+          <span v-if="theme.value == 'dark'" class="me-1"
             ><font-awesome-icon :icon="['fas', 'moon']"
           /></span>
-          <span v-else-if="theme.label == 'Light'"
+          <span v-else-if="theme.value == 'light'"
             ><font-awesome-icon :icon="['fas', 'sun']"
           /></span>
           <span v-else><font-awesome-icon :icon="['fas', 'circle-half-stroke']" /></span>

frontend/app/src/views/NotFoundView.vue

@@ -1,11 +1,13 @@
 <template>
-  <div class="form-signin w-100 m-auto text-center p-5" style="max-width: 500px">
-    <h1 class="fw-bolder">404</h1>
-    <h3 class="mt-4">{{ $t('notFound.title') }}</h3>
-    <h6>{{ $t('notFound.subTitle') }}</h6>
+  <div class="bg-body-tertiary border-0 rounded">
+    <div class="form-signin w-100 m-auto text-center p-5" style="max-width: 500px">
+      <h1 class="fw-bolder">404</h1>
+      <h3 class="mt-4">{{ $t('notFound.title') }}</h3>
+      <h6>{{ $t('notFound.subTitle') }}</h6>
 
-    <router-link :to="{ name: 'home' }" type="button" class="mt-4 btn btn-primary">
-      {{ $t('notFound.backToHomeButton') }}
-    </router-link>
+      <router-link :to="{ name: 'home' }" type="button" class="mt-4 btn btn-primary">
+        {{ $t('notFound.backToHomeButton') }}
+      </router-link>
+    </div>
   </div>
 </template>