diff --git a/src/components/Onfido/BaseOnfidoWeb.js b/src/components/Onfido/BaseOnfidoWeb.js index 92c868548001..5b8aaf20223f 100644 --- a/src/components/Onfido/BaseOnfidoWeb.js +++ b/src/components/Onfido/BaseOnfidoWeb.js @@ -33,7 +33,7 @@ class Onfido extends React.Component { colorContentTitle: themeColors.text, colorContentSubtitle: themeColors.text, colorContentBody: themeColors.text, - borderRadiusButton: `${variables.componentBorderRadius}px`, + borderRadiusButton: `${variables.buttonBorderRadius}px`, colorBackgroundSurfaceModal: themeColors.appBG, colorBorderDocTypeButton: themeColors.border, colorBorderDocTypeButtonHover: themeColors.link, 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 134fd75795d0..8fbfb3217d3e 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, diff --git a/src/styles/styles.js b/src/styles/styles.js index 7adc9d975c17..adedd13af29c 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -339,12 +339,12 @@ const styles = { }, borderRadiusNormal: { - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, }, button: { backgroundColor: themeColors.buttonDefaultBG, - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, height: variables.componentSizeLarge, justifyContent: 'center', ...spacing.ph3, @@ -363,32 +363,31 @@ const styles = { }, buttonSmall: { - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, height: variables.componentSizeSmall, - paddingTop: 6, - paddingRight: 10, - paddingBottom: 6, - paddingLeft: 10, + paddingTop: 10, + paddingHorizontal: 14, + paddingBottom: 10, backgroundColor: themeColors.buttonDefaultBG, }, buttonMedium: { - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, height: variables.componentSizeNormal, paddingTop: 6, - paddingRight: 12, + paddingRight: 16, paddingBottom: 6, - paddingLeft: 12, + paddingLeft: 16, backgroundColor: themeColors.buttonDefaultBG, }, buttonLarge: { - borderRadius: variables.componentBorderRadius, + borderRadius: variables.buttonBorderRadius, height: variables.componentSizeLarge, paddingTop: 8, - paddingRight: 14, + paddingRight: 18, paddingBottom: 8, - paddingLeft: 14, + paddingLeft: 18, backgroundColor: themeColors.buttonDefaultBG, }, @@ -612,7 +611,7 @@ const styles = { border: { borderWidth: 1, - borderRadius: variables.componentBorderRadiusNormal, + borderRadius: variables.buttonBorderRadius, borderColor: themeColors.border, }, @@ -2685,6 +2684,7 @@ const styles = { errorPageContainer: { backgroundColor: themeColors.componentBG, }, + transferBalancePayment: { borderWidth: 1, borderRadius: variables.componentBorderRadiusNormal, diff --git a/src/styles/variables.js b/src/styles/variables.js index 162bde9394f7..409c9be576f2 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,