From 40a5a2d9acf792156616128e9d5af19ec7545ac2 Mon Sep 17 00:00:00 2001
From: Avior <f.bouillon@aptatio.com>
Date: Mon, 27 Feb 2023 12:06:29 +0100
Subject: [PATCH] fix: button being decalled

Signed-off-by: Avior <f.bouillon@aptatio.com>
---
 src/Input/Input.module.styl | 10 +++++-----
 src/Input/index.tsx         |  4 ++--
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/Input/Input.module.styl b/src/Input/Input.module.styl
index 6dfa0d8..dedcc49 100644
--- a/src/Input/Input.module.styl
+++ b/src/Input/Input.module.styl
@@ -22,7 +22,7 @@
 	svg
 		position absolute
 		user-select none
-		padding 8px
+		padding 16px
 		color black
 		@media (prefers-color-scheme dark)
 			color white
@@ -31,15 +31,15 @@
 		&.iconClickable
 			pointer-events all
 			cursor pointer
-		top 14px
+		top -2px
 		&.left
-			left 16px // input padding-left
+			left 0px // input padding-left
 
 			~ label
-				left 16px + 24px + 10px
+				left 0px + 24px + 10px
 
 		&.right
-			right 16px
+			right 0
 
 	select
 		appearance none
diff --git a/src/Input/index.tsx b/src/Input/index.tsx
index 880a388..455eb55 100644
--- a/src/Input/index.tsx
+++ b/src/Input/index.tsx
@@ -350,8 +350,8 @@ export default class Input extends React.Component<Props, States> {
 		}
 
 		if ('icon' in Icon) {
-			// 18 + 8 of padding
-			return <Icon.icon size={8*2+18} className={buildClassName(css[position], css.iconClickable)} onClick={async () => {
+			// 18 + 16 of padding
+			return <Icon.icon size={16*2+18} className={buildClassName(css[position], css.iconClickable)} onClick={async () => {
 				if (this.props.disabled) {return}
 				const value = Icon.transformer(this.state.value ?? this.state.displayedValue ?? '')
 				this.setState({ value: value, displayedValue: value, valueUpdate: true })