fix: currency padding

MacPaw · Sep 10, 2021 · af45ad3 · af45ad3
1 parent 63d2e9f
commit af45ad3
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 4 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@macpaw/macpaw-ui",
-  "version": "3.7.6",
+  "version": "3.7.7",
   "main": "lib/ui.js",
   "scripts": {
     "dev": "next -p 1234",

diff --git a/src/Input/Input.scss b/src/Input/Input.scss
@@ -88,8 +88,14 @@
     }
   }
 
-  input.-with-gap {
-    padding-right: 90px;
+  input {
+    &.-with-action {
+      padding-right: 90px;
+    }
+
+    &.-with-currency {
+      padding-right: 60px;
+    }
   }
 
   textarea {

diff --git a/src/Input/Input.tsx b/src/Input/Input.tsx
@@ -35,7 +35,7 @@ const Input = forwardRef<HTMLInputElement, InputProps>((props, ref) => {
   });
 
   const componentProps: any = {
-    className: cx({ '-with-gap': action || currency }, className),
+    className: cx(action && '-with-action', currency && '-with-currency', className),
   };
 
   const showHintError = error && typeof error !== 'boolean';