Adds max-height option to Menu

MuckRock · Nov 26, 2024 · 9ba583a · 9ba583a
1 parent 43da90d
commit 9ba583a
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 5 deletions.
diff --git a/src/lib/components/common/Menu.svelte b/src/lib/components/common/Menu.svelte
@@ -17,6 +17,8 @@
     padding: 0.25rem;
     gap: 0.25rem;
     min-width: 16rem;
+    max-height: var(--max-height, auto);
+    overflow-y: scroll;
   }
   :global(.menu.small) {
     color: var(--gray-3);

diff --git a/src/lib/components/navigation/OrgMenu.svelte b/src/lib/components/navigation/OrgMenu.svelte
@@ -177,7 +177,7 @@
             <p class="orgname">{active_org.name}</p>
             <span class="arrow" slot="end"><ChevronDown12 /></span>
           </SidebarItem>
-          <Menu>
+          <Menu --max-height="24rem">
             {#each otherOrgs as otherOrg}
               <SidebarItem
                 hover
@@ -225,7 +225,6 @@
     color: var(--black, #233944);
     font-family: var(--font-sans, "Source Sans Pro");
     font-weight: var(--font-semibold, 600);
-    line-height: 1rem;
     margin-bottom: 0;
   }
 

diff --git a/src/lib/components/navigation/stories/OrgMenu.stories.svelte b/src/lib/components/navigation/stories/OrgMenu.stories.svelte
@@ -15,9 +15,6 @@
   export const meta = {
     title: "Components / Navigation / Org Menu",
     component: OrgMenu,
-    parameters: {
-      layout: "centered",
-    },
   };
 </script>