From 407bdd8c0df4591ebd1b193dd98f807109dcc087 Mon Sep 17 00:00:00 2001
From: saml33 <30796577+saml33@users.noreply.github.com>
Date: Thu, 27 May 2021 23:44:25 +1000
Subject: [PATCH] increase dropdown box max-height (#19)

---
 components/Select.tsx        | 2 +-
 components/Tooltip.tsx       | 3 +++
 components/WithdrawModal.tsx | 6 +++++-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/components/Select.tsx b/components/Select.tsx
index 32aad45..5ea1d01 100644
--- a/components/Select.tsx
+++ b/components/Select.tsx
@@ -36,7 +36,7 @@ const Select = ({
             {open ? (
               <Listbox.Options
                 static
-                className={`text-th-fgd-1 max-h-40 overflow-auto z-20 w-full p-1 absolute left-0 mt-1 bg-th-bkg-1 origin-top-left divide-y divide-th-bkg-3 shadow-lg outline-none rounded-md thin-scroll`}
+                className={`text-th-fgd-1 max-h-56 overflow-auto z-20 w-full p-1 absolute left-0 mt-1 bg-th-bkg-1 origin-top-left divide-y divide-th-bkg-3 shadow-lg outline-none rounded-md thin-scroll`}
               >
                 {children}
               </Listbox.Options>
diff --git a/components/Tooltip.tsx b/components/Tooltip.tsx
index 4d8e448..3e66b7d 100644
--- a/components/Tooltip.tsx
+++ b/components/Tooltip.tsx
@@ -5,12 +5,14 @@ import 'tippy.js/animations/scale.css'
 type TooltipProps = {
   content: ReactNode
   className?: string
+  placement?: any
 }
 
 const Tooltip: FunctionComponent<TooltipProps> = ({
   children,
   content,
   className,
+  placement,
 }) => {
   return (
     <Tippy
@@ -25,6 +27,7 @@ const Tooltip: FunctionComponent<TooltipProps> = ({
           {content}
         </div>
       }
+      placement={placement}
     >
       <div className="outline-none focus:outline-none">{children}</div>
     </Tippy>
diff --git a/components/WithdrawModal.tsx b/components/WithdrawModal.tsx
index bc14ab0..9320968 100644
--- a/components/WithdrawModal.tsx
+++ b/components/WithdrawModal.tsx
@@ -434,7 +434,11 @@ const WithdrawModal = ({ isOpen, onClose }) => {
                 suffix={withdrawTokenSymbol}
               />
               {simulation ? (
-                <Tooltip content="Account Leverage" className="py-1">
+                <Tooltip
+                  content="Projected Leverage"
+                  className="py-1"
+                  placement="bottom"
+                >
                   <span
                     className={`${getAccountStatusColor(
                       simulation.collateralRatio