From e5b26e6a208ac3b00bba6e6ea9227508573a4b5d Mon Sep 17 00:00:00 2001
From: checktheroads <matt@allroads.io>
Date: Mon, 18 Jan 2021 22:48:14 -0700
Subject: [PATCH] make footer button content scrollable, closes #107

---
 hyperglass/ui/components/footer/button.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/hyperglass/ui/components/footer/button.tsx b/hyperglass/ui/components/footer/button.tsx
index 268b948..96d4126 100644
--- a/hyperglass/ui/components/footer/button.tsx
+++ b/hyperglass/ui/components/footer/button.tsx
@@ -14,6 +14,7 @@ export const FooterButton: React.FC<TFooterButton> = (props: TFooterButton) => {
   return (
     <Menu placement={placement} preventOverflow isLazy>
       <MenuButton
+        zIndex={2}
         as={Button}
         size={size}
         variant="ghost"
@@ -25,9 +26,12 @@ export const FooterButton: React.FC<TFooterButton> = (props: TFooterButton) => {
         px={6}
         py={4}
         bg={bg}
+        // Ensure the height doesn't overtake the viewport, especially on mobile. See overflow also.
+        maxH="50vh"
         color={color}
         boxShadow="2xl"
         textAlign="left"
+        overflowY="auto"
         mx={{ base: 1, lg: 2 }}
         maxW={{ base: '100%', lg: '50vw' }}
         {...rest}