chore: Fixes height issues with seconday sidebar (#5407)

app/javascript/dashboard/components/layout/Sidebar.vue

@@ -285,8 +285,6 @@ export default {
 }
 
 .secondary-menu .nested.vertical.menu {
-  overflow-y: auto;
-  height: 100%;
   margin-left: var(--space-small);
 }
 </style>

app/javascript/dashboard/components/layout/sidebarComponents/Secondary.vue

@@ -245,6 +245,8 @@ export default {
 @import '~dashboard/assets/scss/woot';
 
 .secondary-menu {
+  display: flex;
+  flex-direction: column;
   background: var(--white);
   border-right: 1px solid var(--s-50);
   height: 100%;
@@ -267,7 +269,6 @@ export default {
   .menu {
     padding: var(--space-small);
     overflow-y: auto;
-    height: 94%;
   }
 }
 </style>

app/javascript/dashboard/routes/dashboard/contacts/components/Header.vue

@@ -2,6 +2,7 @@
   <header class="header">
     <div class="table-actions-wrap">
       <div class="left-aligned-wrap">
+        <woot-sidemenu-icon />
         <h1 class="page-title">
           {{ headerTitle }}
         </h1>
@@ -173,11 +174,13 @@ export default {
 }
 
 .search-wrap {
-  width: 400px;
+  max-width: 400px;
+  min-width: 150px;
   display: flex;
   align-items: center;
   position: relative;
   margin-right: var(--space-small);
+  margin-left: var(--space-small);
 
   .search-icon {
     position: absolute;

app/javascript/dashboard/routes/dashboard/helpcenter/components/HelpCenterLayout.vue

@@ -6,8 +6,8 @@
       @open-key-shortcut-modal="toggleKeyShortcutModal"
       @close-key-shortcut-modal="closeKeyShortcutModal"
     />
-    <div v-if="portals.length">
     <help-center-sidebar
+      v-if="portals.length"
       :class="sidebarClassName"
       :header-title="headerTitle"
       :sub-title="localeName(selectedPortalLocale)"
@@ -16,7 +16,6 @@
       @open-popover="openPortalPopover"
       @open-modal="onClickOpenAddCatogoryModal"
     />
-    </div>
     <section class="app-content columns" :class="contentClassName">
       <router-view />
       <command-bar />

app/javascript/dashboard/routes/dashboard/helpcenter/components/Sidebar/Sidebar.vue

@@ -89,6 +89,8 @@ export default {
 <style scoped lang="scss">
 @import '~dashboard/assets/scss/woot';
 .secondary-menu {
+  display: flex;
+  flex-direction: column;
   background: var(--white);
   border-right: 1px solid var(--s-50);
   height: 100%;
@@ -108,5 +110,10 @@ export default {
   &:hover {
     overflow: auto;
   }
+
+  .menu {
+    padding: var(--space-small);
+    overflow-y: auto;
+  }
 }
 </style>