diff --git a/src/components/Onfido/BaseOnfidoWeb.js b/src/components/Onfido/BaseOnfidoWeb.js index 92c868548001a..5b8aaf20223ff 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 0b0c65bb05a64..496b0762aca78 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 134fd75795d07..8fbfb3217d3e2 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 7adc9d975c173..adedd13af29cc 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 162bde9394f7f..409c9be576f2a 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,