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,17 +6,16 @@
       @open-key-shortcut-modal="toggleKeyShortcutModal"
       @close-key-shortcut-modal="closeKeyShortcutModal"
     />
-    <div v-if="portals.length">
-      <help-center-sidebar
-        :class="sidebarClassName"
-        :header-title="headerTitle"
-        :sub-title="localeName(selectedPortalLocale)"
-        :accessible-menu-items="accessibleMenuItems"
-        :additional-secondary-menu-items="additionalSecondaryMenuItems"
-        @open-popover="openPortalPopover"
-        @open-modal="onClickOpenAddCatogoryModal"
-      />
-    </div>
+    <help-center-sidebar
+      v-if="portals.length"
+      :class="sidebarClassName"
+      :header-title="headerTitle"
+      :sub-title="localeName(selectedPortalLocale)"
+      :accessible-menu-items="accessibleMenuItems"
+      :additional-secondary-menu-items="additionalSecondaryMenuItems"
+      @open-popover="openPortalPopover"
+      @open-modal="onClickOpenAddCatogoryModal"
+    />
     <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>