From a59765d0020ab52d9ded526b9fcb944f2eb3ceee Mon Sep 17 00:00:00 2001
From: William Grant <willmgrant@gmail.com>
Date: Wed, 3 Apr 2024 16:27:32 +1100
Subject: [PATCH] fix: padding resoluton for onboarding buttons

---
 ts/components/icon/SessionIconButton.tsx             | 9 ++++++++-
 ts/components/inputs/SessionInput.tsx                | 1 +
 ts/components/registration/RegistrationStages.tsx    | 2 ++
 ts/components/registration/components/BackButton.tsx | 1 +
 4 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/ts/components/icon/SessionIconButton.tsx b/ts/components/icon/SessionIconButton.tsx
index 5a0ecea99..759ad6a45 100644
--- a/ts/components/icon/SessionIconButton.tsx
+++ b/ts/components/icon/SessionIconButton.tsx
@@ -11,6 +11,7 @@ interface SProps extends SessionIconProps {
   isSelected?: boolean;
   isHidden?: boolean;
   margin?: string;
+  padding?: string;
   dataTestId?: string;
   dataTestIdIcon?: string;
   id?: string;
@@ -56,6 +57,7 @@ const SessionIconButtonInner = forwardRef<HTMLButtonElement, SProps>((props, ref
     borderRadius,
     iconPadding,
     margin,
+    padding,
     id,
     title,
     dataTestId,
@@ -86,7 +88,12 @@ const SessionIconButtonInner = forwardRef<HTMLButtonElement, SProps>((props, ref
       id={id}
       title={title}
       onClick={clickHandler}
-      style={{ ...style, display: isHidden ? 'none' : 'flex', margin: margin || '' }}
+      style={{
+        ...style,
+        display: isHidden ? 'none' : 'flex',
+        margin: margin || '',
+        padding: padding || '',
+      }}
       tabIndex={tabIndex}
       onKeyDown={keyPressHandler}
       data-testid={dataTestId}
diff --git a/ts/components/inputs/SessionInput.tsx b/ts/components/inputs/SessionInput.tsx
index eb58a9fe9..7ba37ce91 100644
--- a/ts/components/inputs/SessionInput.tsx
+++ b/ts/components/inputs/SessionInput.tsx
@@ -81,6 +81,7 @@ const ShowHideButton = (props: { forceShow: boolean; toggleForceShow: Noop; erro
         iconColor={props.error ? 'var(--danger-color)' : 'var(--text-primary-color)'}
         iconSize="huge"
         iconPadding="1.25px"
+        padding={'0'}
         onClick={props.toggleForceShow}
         style={{
           marginTop: '-0.5px',
diff --git a/ts/components/registration/RegistrationStages.tsx b/ts/components/registration/RegistrationStages.tsx
index bccafdd4a..0f61ccca3 100644
--- a/ts/components/registration/RegistrationStages.tsx
+++ b/ts/components/registration/RegistrationStages.tsx
@@ -57,6 +57,7 @@ export const RegistrationStages = () => {
               iconSize={'medium'}
               iconPadding="4px"
               iconColor="var(--text-primary-color)"
+              padding={'0'}
               style={{ border: '2px solid var(--text-primary-color)', borderRadius: '9999px' }}
               dataTestId="session-faq-link"
               onClick={() => {
@@ -70,6 +71,7 @@ export const RegistrationStages = () => {
               iconSize="medium"
               iconColor="var(--text-primary-color)"
               iconPadding="4px"
+              padding={'0'}
               style={{ border: '2px solid var(--text-primary-color)', borderRadius: '9999px' }}
               dataTestId="session-website-link"
               onClick={() => {
diff --git a/ts/components/registration/components/BackButton.tsx b/ts/components/registration/components/BackButton.tsx
index cddfe815c..86c822e0e 100644
--- a/ts/components/registration/components/BackButton.tsx
+++ b/ts/components/registration/components/BackButton.tsx
@@ -45,6 +45,7 @@ export const BackButton = ({ callback }: { callback?: () => void }) => {
       iconType="chevron"
       iconColor="var(--color-text-primary)"
       iconRotation={90}
+      padding={'0'}
       onClick={() => {
         dispatch(setDirection('backward'));
         if (step === Onboarding.CreateAccount) {