Fix transfer popup height

Author: leetdev

packages/extension-ui/src/Popup/Transfer/index.tsx

@@ -125,30 +125,31 @@ function Transfer ({ className }: Props): React.ReactElement<Props> {
             }}
             value={to}
           />
-          <Dropdown
-            className="dropdown"
-            isDisabled={isBusy}
-            label={t<string>('Asset type')}
-            onChange={(asset: string) => {
-              setAsset(asset);
-              _removeError();
-            }}
-            options={[
-              { value: 'cennz', text: 'CENNZ' },
-              { value: 'cpay', text: 'CPAY' },
-            ]}
-            value={asset}
-          />
-          <AmountInput
-            disabled={isBusy}
-            label={t<string>('Send amount')}
-            onChange={amount => {
-              setAmount(amount);
-              _removeError();
-            }}
-            placeholder="0.0000"
-            value={amount}
-          />
+          <div className="amount-container">
+            <AmountInput
+              disabled={isBusy}
+              label={t<string>('Send amount')}
+              onChange={amount => {
+                setAmount(amount);
+                _removeError();
+              }}
+              placeholder="0.0000"
+              value={amount}
+            />
+            <Dropdown
+              className="asset-select"
+              isDisabled={isBusy}
+              onChange={(asset: string) => {
+                setAsset(asset);
+                _removeError();
+              }}
+              options={[
+                { value: 'cennz', text: 'CENNZ' },
+                { value: 'cpay', text: 'CPAY' },
+              ]}
+              value={asset}
+            />
+          </div>
           <InputWithLabel
             disabled={isBusy}
             isError={pass.length < MIN_LENGTH || !!passError}
@@ -192,4 +193,15 @@ export default styled(Transfer)`
   .dropdown {
     margin-bottom: 16px;
   }
+
+  .amount-container {
+    position: relative;
+  }
+
+  .asset-select {
+    position: absolute;
+    top: 26px;
+    right: 0;
+    width: 100px;
+  }
 `;

yarn.lock

@@ -5100,14 +5100,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"bn.js@npm:^5.0.0, bn.js@npm:^5.1.1":
-  version: 5.1.3
-  resolution: "bn.js@npm:5.1.3"
-  checksum: 991c1fefb03bd69315297d454b379d5a5dd4834ab97db3ec985714f00ff7d3cc19642e1ac6bdf0d9f04946cc9f1ad26a5b497b7f4e7fa1230caf68af46fbefe6
-  languageName: node
-  linkType: hard
-
-"bn.js@npm:^5.1.3":
+"bn.js@npm:^5.0.0, bn.js@npm:^5.1.1, bn.js@npm:^5.1.3":
   version: 5.2.0
   resolution: "bn.js@npm:5.2.0"
   checksum: 7a73bdbba63013a7f9953fbbd6ea3351e4cf36d6fdbb5adf7969fcd65255b9c04f2994b0132d89d74ffe608a0eb5a48322526bee20c0e03e71e502603b420f63