Split VHeader into VHeaderDesktop and VHeaderMobile components (#1845)

* Refactor SearchTypePopover for desktop header * Add VHeaderDesktop docstrings
WordPress · Oct 1, 2022 · c0b0772 · c0b0772
1 parent e44fb70
commit c0b0772
Show file tree

Hide file tree

Showing 9 changed files with 112 additions and 439 deletions.
diff --git a/src/components/VContentSwitcher/VMobileMenuModal.vue b/src/components/VContentSwitcher/VMobileMenuModal.vue
diff --git a/src/components/VHeader/VHeaderDesktop.vue b/src/components/VHeader/VHeaderDesktop.vue
@@ -11,7 +11,7 @@
 
     <VSearchBar
       v-model.trim="searchTerm"
-      class="flex-grow"
+      class="flex-grow me-4"
       size="medium"
       @submit="handleSearch"
     >
@@ -40,7 +40,6 @@
     </VTeleport>
   </header>
 </template>
-
 <script lang="ts">
 import {
   computed,
@@ -80,6 +79,9 @@ import VSearchTypePopover from '~/components/VContentSwitcher/VSearchTypePopover
 
 import closeIcon from '~/assets/icons/close.svg'
 
+/**
+ * The desktop search header.
+ */
 export default defineComponent({
   name: 'VHeaderDesktop',
   components: {
@@ -248,8 +250,7 @@ export default defineComponent({
       selectSearchType,
       searchStatus,
       searchTerm,
-      sidebarVisibleRef: sidebarVisibleRef,
-
+      sidebarVisibleRef,
       toggleSidebar,
       onTab,
     }

diff --git a/src/components/VHeader/VHeaderFilter.vue b/src/components/VHeader/VHeaderFilter.vue
diff --git a/src/components/VHeader/VHeaderMenu.vue b/src/components/VHeader/VHeaderMenu.vue