From cd5710bc0ee395c773b26bb326e8ad17ced38c91 Mon Sep 17 00:00:00 2001 From: Luke Donahue Date: Thu, 3 Nov 2022 15:57:51 -0700 Subject: [PATCH 1/6] add button variable --- src/styles/variables.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/styles/variables.js b/src/styles/variables.js index 785f9775eeeb..88e150b72ee1 100644 --- a/src/styles/variables.js +++ b/src/styles/variables.js @@ -8,6 +8,7 @@ export default { componentBorderRadiusSmall: 4, componentBorderRadiusNormal: 8, componentBorderRadiusCard: 12, + buttonBorderRadius: 100, avatarSizeLarge: 80, avatarSizeNormal: 40, avatarSizeSmall: 28, From 7e0ad2fd95d379c3f0d295ecc5a2612c0e462024 Mon Sep 17 00:00:00 2001 From: Luke Donahue Date: Thu, 3 Nov 2022 15:58:14 -0700 Subject: [PATCH 2/6] use new vars --- src/styles/styles.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/styles/styles.js b/src/styles/styles.js index f2d7cff023da..2b68e4bcac3d 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -342,7 +342,7 @@ const styles = { button: { backgroundColor: themeColors.buttonDefaultBG, - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, height: variables.componentSizeLarge, justifyContent: 'center', ...spacing.ph3, @@ -361,12 +361,11 @@ const styles = { }, buttonSmall: { - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, height: variables.componentSizeSmall, paddingTop: 6, - paddingRight: 10, + paddingHorizontal: 14, paddingBottom: 6, - paddingLeft: 10, backgroundColor: themeColors.buttonDefaultBG, }, From 23e7d0c0fb5332b8befaf12afc7304fb2e0d2506 Mon Sep 17 00:00:00 2001 From: Luke Donahue Date: Mon, 21 Nov 2022 15:34:27 -0800 Subject: [PATCH 3/6] changing button radius usage --- src/components/Onfido/BaseOnfidoWeb.js | 2 +- src/styles/getReportActionContextMenuStyles.js | 2 +- src/styles/getTooltipStyles.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/Onfido/BaseOnfidoWeb.js b/src/components/Onfido/BaseOnfidoWeb.js index b1114f911abd..f4573c453e32 100644 --- a/src/components/Onfido/BaseOnfidoWeb.js +++ b/src/components/Onfido/BaseOnfidoWeb.js @@ -33,7 +33,7 @@ class Onfido extends React.Component { colorContentTitle: colors.dark, colorContentSubtitle: colors.dark, colorContentBody: colors.dark, - borderRadiusButton: `${variables.componentBorderRadius}px`, + borderRadiusButton: `${variables.buttonBorderRadius}px`, colorBackgroundSurfaceModal: colors.white, colorBorderDocTypeButton: colors.gray2, colorBorderDocTypeButtonHover: colors.blue, diff --git a/src/styles/getReportActionContextMenuStyles.js b/src/styles/getReportActionContextMenuStyles.js index 0b0c65bb05a6..496b0762aca7 100644 --- a/src/styles/getReportActionContextMenuStyles.js +++ b/src/styles/getReportActionContextMenuStyles.js @@ -10,7 +10,7 @@ const miniWrapperStyle = [ styles.flexRow, defaultWrapperStyle, { - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, borderWidth: 1, borderColor: themeColors.border, }, diff --git a/src/styles/getTooltipStyles.js b/src/styles/getTooltipStyles.js index c786d5f6c6ed..db8a6f8e3cb4 100644 --- a/src/styles/getTooltipStyles.js +++ b/src/styles/getTooltipStyles.js @@ -116,7 +116,7 @@ export default function getTooltipStyles( tooltipWrapperStyle: { position: 'fixed', backgroundColor: themeColors.heading, - borderRadius: variables.componentBorderRadiusSmall, + borderRadius: variables.buttonBorderRadius, ...tooltipVerticalPadding, ...spacing.ph2, zIndex: variables.tooltipzIndex, From fe10aae7d4b96506bbee399c5dd88cfe2255b7d1 Mon Sep 17 00:00:00 2001 From: Luke Donahue Date: Mon, 21 Nov 2022 15:34:34 -0800 Subject: [PATCH 4/6] changing styles --- src/styles/styles.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/styles/styles.js b/src/styles/styles.js index 2b68e4bcac3d..c67c7a156af9 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -337,7 +337,7 @@ const styles = { }, borderRadiusNormal: { - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, }, button: { @@ -370,7 +370,7 @@ const styles = { }, buttonMedium: { - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, height: variables.componentSizeNormal, paddingTop: 6, paddingRight: 12, @@ -380,7 +380,7 @@ const styles = { }, buttonLarge: { - borderRadius: variables.componentBorderRadius, + borderRadius: variables.buttonBorderRadius, height: variables.componentSizeLarge, paddingTop: 8, paddingRight: 14, @@ -615,7 +615,7 @@ const styles = { border: { borderWidth: 1, - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, borderColor: themeColors.border, }, @@ -688,7 +688,7 @@ const styles = { textInputContainer: { flex: 1, - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, justifyContent: 'center', height: '100%', backgroundColor: themeColors.componentBG, @@ -2672,6 +2672,7 @@ const styles = { errorPageContainer: { backgroundColor: themeColors.componentBG, }, + transferBalancePayment: { borderWidth: 1, borderRadius: variables.componentBorderRadiusNormal, From 9e7c54be97b5c3dd3af0feb9452b896bb5d35306 Mon Sep 17 00:00:00 2001 From: Luke Donahue Date: Mon, 21 Nov 2022 15:49:31 -0800 Subject: [PATCH 5/6] a bridge too far --- src/styles/styles.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/styles.js b/src/styles/styles.js index d64205a14609..f32a2f9579a9 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -684,7 +684,7 @@ const styles = { textInputContainer: { flex: 1, - borderRadius: variables.buttonBorderRadius, + borderRadius: variables.componentBorderRadiusNormal, justifyContent: 'center', height: '100%', backgroundColor: themeColors.componentBG, From eb0e125514ddedbd7055b1363850f08b8dc38c05 Mon Sep 17 00:00:00 2001 From: Luke Donahue Date: Tue, 22 Nov 2022 16:25:19 -0800 Subject: [PATCH 6/6] lil more padding for the buttons --- src/styles/styles.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/styles/styles.js b/src/styles/styles.js index f32a2f9579a9..1e45950097e7 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -365,9 +365,9 @@ const styles = { buttonSmall: { borderRadius: variables.buttonBorderRadius, height: variables.componentSizeSmall, - paddingTop: 6, + paddingTop: 10, paddingHorizontal: 14, - paddingBottom: 6, + paddingBottom: 10, backgroundColor: themeColors.buttonDefaultBG, }, @@ -375,9 +375,9 @@ const styles = { borderRadius: variables.buttonBorderRadius, height: variables.componentSizeNormal, paddingTop: 6, - paddingRight: 12, + paddingRight: 16, paddingBottom: 6, - paddingLeft: 12, + paddingLeft: 16, backgroundColor: themeColors.buttonDefaultBG, }, @@ -385,9 +385,9 @@ const styles = { borderRadius: variables.buttonBorderRadius, height: variables.componentSizeLarge, paddingTop: 8, - paddingRight: 14, + paddingRight: 18, paddingBottom: 8, - paddingLeft: 14, + paddingLeft: 18, backgroundColor: themeColors.buttonDefaultBG, },