сделан переключатель темы

src/components/My_naw.vue

@@ -1,5 +1,8 @@
 <template>
   <div class=" sticky top-0 w-full sm:w-1/5 sm:h-screen bg-white z-10 pt-5 md:p-5 dark:bg-gray-800">
+    <!-- Переключатель темы -->
+    <ThemeToggle />
+    
     <!-- Фиксированный левый блок -->
     <div v-if="currentPage === 'rezylt'" class="flex sm:flex-col">
       <button
@@ -15,6 +18,13 @@
       >
         Настройка
       </button>
+
+      <button
+        @click="Valuestatus"
+        class="bg-gray-300 sm:mt-3 w-full min-w-30 hover:text-white hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
+      >
+        Избранное
+      </button>
     </div>
 
     <div v-if="currentPage === 'setings'" class="flex sm:flex-col">
@@ -31,11 +41,43 @@
       >
         Настройка
       </button>
+
+      <button
+        @click="Valuestatus"
+        class="bg-gray-300 sm:mt-3 w-full min-w-30 hover:text-white hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
+      >
+        Избранное
+      </button>
+    </div>
+
+    <div v-if="currentPage === 'status'" class="flex sm:flex-col">
+      <button
+        @click="ValueRezylt"
+        class="bg-gray-300 w-full min-w-30 hover:text-white hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
+      >
+        Результат
+      </button>
+
+      <button
+        @click="ValueSeting"
+        class="bg-gray-300 sm:mt-3 w-full min-w-30 hover:text-white hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
+      >
+        Настройка
+      </button>
+
+      <button
+        @click="Valuestatus"
+        class="bg-gray-600 sm:mt-3 w-full text-white min-w-30 px-4 py-2 rounded cursor-pointer"
+      >
+        Избранное
+      </button>
     </div>
   </div>
 </template>
 
 <script setup>
+import ThemeToggle from "./ThemeToggle.vue";
+
 const props = defineProps({
   currentPage: String,
 });
@@ -50,4 +92,8 @@ function ValueSeting() {
 function ValueRezylt() {
   emit("update", "rezylt");
 }
+
+function Valuestatus() {
+  emit("update", "status");
+}
 </script>