fix: [GSW-2040] Mobile UI

gnoswap-labs · Jan 17, 2025 · 1885a0b · 1885a0b
1 parent 5c1f09e
commit 1885a0b
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 2 deletions.
diff --git a/.../web/src/components/common/connect-social-wallet-modal/ConnectSocialWalletModal.styles.ts b/.../web/src/components/common/connect-social-wallet-modal/ConnectSocialWalletModal.styles.ts
@@ -94,6 +94,9 @@ export const ConnectSocialWalletModalWrapper = styled.div`
         span {
           color: ${({ theme }) => (theme.themeKey === "dark" ? theme.color.text01 : theme.color.text09)};
           ${fonts.body7}
+          ${media.mobile} {
+            font-size: 16px;
+          }
         }
         ${media.mobile} {
           height: 41px;

diff --git a/packages/web/src/components/common/connect-wallet-modal/ConnectWalletModal.styles.ts b/packages/web/src/components/common/connect-wallet-modal/ConnectWalletModal.styles.ts
@@ -53,6 +53,11 @@ export const ConnectWalletModalWrapper = styled.div`
         width: 100%;
         ${mixins.flexbox("column", "flex-start", "flex-start")};
         gap: var(--login-section-gap, 24px);
+        &.social-login-section {
+          ${media.mobile} {
+            gap: 16px;
+          }
+        }
       }
 
       .email-section {

diff --git a/packages/web/src/components/common/connect-wallet-modal/ConnectWalletModal.tsx b/packages/web/src/components/common/connect-wallet-modal/ConnectWalletModal.tsx
@@ -103,7 +103,7 @@ const ConnectWalletModal: React.FC<Props> = ({ close, connect, loadingConnect })
           <ConnectWalletModalDivider />
 
           {/* Social Logins */}
-          <div className="login-section">
+          <div className="login-section social-login-section">
             <Button
               text="Sign in With Google"
               leftIcon={<IconGoogleLogo />}

diff --git a/...onents/common/connect-wallet-modal/connect-wallet-error-modal/ConnectWalletErrorModal.tsx b/...onents/common/connect-wallet-modal/connect-wallet-error-modal/ConnectWalletErrorModal.tsx
@@ -29,7 +29,7 @@ const ConnectWalletErrorModal = ({ close }: Props) => {
           </div>
           <div className="button-wrapper">
             <Button
-              text="I understand"
+              text="Close"
               style={{ hierarchy: ButtonHierarchy.Primary, fullWidth: true }}
               onClick={close}
               className="button-confirm"

diff --git a/...ges/web/src/components/common/transaction-confirm-modal/TransactionConfirmModal.styles.ts b/...ges/web/src/components/common/transaction-confirm-modal/TransactionConfirmModal.styles.ts
@@ -319,6 +319,9 @@ export const TransactionConfirmModalWrapper = styled.div`
         button {
           height: 41px;
           width: 304px;
+          span {
+            font-size: 16px;
+          }
         }
       }
     }