Add route watcher to close menu when route changes

Author: j0h-dev

components/Site/Header.vue

@@ -25,9 +25,9 @@
 </template>
 
 <script setup lang="ts">
+const route = useRoute()
 const isMenuOpen = ref(false)
 
-
 const setMenuOpen = (value: boolean) => {
  isMenuOpen.value = value
  window.scrollTo(0, 0)
@@ -39,6 +39,12 @@ const setMenuOpen = (value: boolean) => {
  }
 }
 
+watch(
+ () => route.fullPath,
+ () => setMenuOpen(false),
+ { deep: true, immediate: false }
+)
+
 const routes = [
  { name: 'Buttons', url: '/UI/buttons' },
  { name: 'Headings', url: '/UI/headings' },