Merge pull request #307 from pendulum-chain/306-bug-jumping-button-sizes

Make main buttons 50% width
pendulum-chain · Nov 27, 2024 · 6f852cd · 6f852cd
2 parents de4c604 + 9e1ce1f
commit 6f852cd
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/src/components/buttons/SwapSubmitButton/index.tsx b/src/components/buttons/SwapSubmitButton/index.tsx
@@ -17,7 +17,7 @@ export const SwapSubmitButton: FC<SwapSubmitButtonProps> = ({ text, disabled, pe
 
   if (!isConnected) {
     return (
-      <div className="grow">
+      <div style={{ flex: '1 1 calc(50% - 0.75rem/2)' }}>
         <button onClick={() => openWalletModal()} type="button" className="w-full btn-vortex-primary btn rounded-xl">
           Connect Wallet
         </button>
@@ -26,7 +26,7 @@ export const SwapSubmitButton: FC<SwapSubmitButtonProps> = ({ text, disabled, pe
   }
 
   return (
-    <div className="grow">
+    <div style={{ flex: '1 1 calc(50% - 0.75rem/2)' }}>
       <button className="w-full btn-vortex-primary btn" disabled={showInDisabledState}>
         {pending && <Spinner />}
         {text}

diff --git a/src/pages/swap/index.tsx b/src/pages/swap/index.tsx
@@ -394,7 +394,8 @@ export const SwapPage = () => {
         </section>
         <div className="flex mt-5 gap-3">
           <button
-            className="grow btn-vortex-secondary btn"
+            className="btn-vortex-secondary btn"
+            style={{ flex: '1 1 calc(50% - 0.75rem/2)' }}
             disabled={!inputAmountIsStable}
             onClick={(e) => {
               e.preventDefault();
@@ -413,7 +414,8 @@ export const SwapPage = () => {
               href={firstSep24ResponseState.url}
               target="_blank"
               rel="opener" //noopener forbids the use of postMessages.
-              className="grow btn-vortex-primary btn rounded-xl"
+              className="btn-vortex-primary btn rounded-xl"
+              style={{ flex: '1 1 calc(50% - 0.75rem/2)' }}
               onClick={handleOnAnchorWindowOpen}
               // open in a tinier window
             >