Merge pull request #3757 from swaponline/exchange-connect-btn

Fix connect button bug on exchange page
swaponline · Dec 7, 2020 · 83e8511 · 83e8511
2 parents f5c632a + 97009ba
commit 83e8511
Showing 2 changed files with 17 additions and 13 deletions.
diff --git a/src/front/shared/pages/Exchange/AddressSelect/AddressSelect.scss b/src/front/shared/pages/Exchange/AddressSelect/AddressSelect.scss
@@ -47,7 +47,6 @@
     background: none;
   }
 
-
   &_error .walletToggle {
     border: 2px solid #a90101;
   }
@@ -69,7 +68,7 @@
 
   & > div {
     padding-left: 0px;
-    border: 1px solid rgba(0,0,0,0.2);
+    border: 1px solid rgba(0, 0, 0, 0.2);
     border-radius: 2px;
 
     div > {
@@ -98,6 +97,18 @@
   height: 100%;
   width: 58%;
   z-index: 1;
+
+  &_connectBtn {
+    border: transparent !important;
+    width: auto;
+    top: 2px;
+
+    & button {
+      width: 100px;
+      font-size: 0.8rem;
+      padding: unset;
+    }
+  }
 }
 
 .readonlyValue {
@@ -117,8 +128,6 @@
   }
 }
 
-
-
 .customWallet {
   position: relative;
   height: 100%;
@@ -198,7 +207,6 @@
   }
 }
 
-
 @include media-mobile {
   .--dark {
     .readonlyValue {

diff --git a/src/front/shared/pages/Exchange/AddressSelect/AddressSelect.tsx b/src/front/shared/pages/Exchange/AddressSelect/AddressSelect.tsx
@@ -26,8 +26,7 @@ import iconInternal from 'components/Logo/images/base.svg'
 import iconCustom from '../../../images/custom.svg'
 
 import { AddressType, AddressRole } from 'domain/address'
-import { COIN_DATA, COIN_MODEL} from 'swap.app/constants/COINS'
-
+import { COIN_DATA, COIN_MODEL } from 'swap.app/constants/COINS'
 
 const langLabels = defineMessages({
   labelSpecifyAddress: {
@@ -373,11 +372,8 @@ export default class AddressSelect extends Component<any, any> {
     // Forbid `Custom address` option when using ethereum/tokens
     // because you need to make a request to the contract
     const isCustomAddressOption = !ethToken.isEthOrEthToken({ name: currency })
-    const isCustomOptionInputHidden = (
-      role === AddressRole.Send 
-      && COIN_DATA[ticker] 
-      && COIN_DATA[ticker].model === COIN_MODEL.UTXO
-    )
+    const isCustomOptionInputHidden =
+      role === AddressRole.Send && COIN_DATA[ticker] && COIN_DATA[ticker].model === COIN_MODEL.UTXO
 
     const web3Icon = metamask.isConnected()
       ? web3Icons[metamask.web3connect.getProviderType()] || false
@@ -475,7 +471,7 @@ export default class AddressSelect extends Component<any, any> {
           onSelect={(value) => this.handleOptionSelect(value)}
         />
         {selectedType === AddressType.Metamask && metamask.isEnabled() && !isMetamaskConnected && (
-          <div styleName="selectedInner">
+          <div styleName="selectedInner selectedInner_connectBtn">
             <div styleName="buttonContainer">
               <Button
                 styleName="button"