Use ch units instead of em, absolute positioned reset button

safe-global · Jul 4, 2023 · ed671ae · ed671ae
1 parent 4514a2e
commit ed671ae
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/src/components/tx-flow/common/TxNonce/index.tsx b/src/components/tx-flow/common/TxNonce/index.tsx
@@ -151,7 +151,7 @@ const TxNonceForm = ({ nonce, recommendedNonce }: { nonce: number; recommendedNo
                     className={css.input}
                     title={field.value}
                     sx={{
-                      minWidth: `clamp(1em, ${field.value.length}em, 200px)`,
+                      minWidth: `clamp(1ch, ${field.value.length}ch, 200px)`,
                     }}
                   />
                 </Tooltip>

diff --git a/src/components/tx-flow/common/TxNonce/styles.module.css b/src/components/tx-flow/common/TxNonce/styles.module.css
@@ -4,10 +4,12 @@
 
 .input input {
   font-weight: bold;
-  padding-right: 6px !important;
+  padding-right: 30px !important;
 }
 
 .adornment {
   margin-left: 0;
   margin-right: 4px;
+  position: absolute;
+  right: 0;
 }