diff --git a/src/components/Onfido/BaseOnfidoWeb.tsx b/src/components/Onfido/BaseOnfidoWeb.tsx index 47723c02526d..0af023908262 100644 --- a/src/components/Onfido/BaseOnfidoWeb.tsx +++ b/src/components/Onfido/BaseOnfidoWeb.tsx @@ -51,9 +51,10 @@ function initializeOnfido({sdkToken, onSuccess, onError, onUserExit, preferredLo colorBorderButtonPrimary: theme.success, colorContentButtonSecondaryText: theme.text, colorBackgroundButtonSecondary: theme.border, - colorBackgroundButtonSecondaryHover: theme.icon, - colorBackgroundButtonSecondaryActive: theme.icon, + colorBackgroundButtonSecondaryHover: theme.hoverComponentBG, + colorBackgroundButtonSecondaryActive: theme.hoverComponentBG, colorBorderButtonSecondary: theme.border, + colorBorderButtonSecondaryHover: theme.transparent, colorBackgroundIcon: theme.transparent, colorContentLinkTextHover: theme.appBG, colorBorderLinkUnderline: theme.link, @@ -66,6 +67,17 @@ function initializeOnfido({sdkToken, onSuccess, onError, onUserExit, preferredLo colorBackgroundDocTypeButtonHover: theme.successHover, colorBackgroundButtonIconHover: theme.transparent, colorBackgroundButtonIconActive: theme.transparent, + colorBorderButtonPrimaryFocus: theme.transparent, + colorBorderButtonPrimaryActive: theme.transparent, + colorBorderButtonSecondaryFocus: theme.transparent, + colorBorderButtonSecondaryActive: theme.transparent, + colorIcon: theme.icon, + colorContentButtonTertiaryText: theme.link, + colorBackgroundButtonTertiaryHover: theme.hoverComponentBG, + colorBorderButtonTertiaryFocus: theme.transparent, + colorInputOutline: theme.borderFocus, + colorBackgroundInput: theme.appBG, + colorBorderInput: theme.border, }, steps: [ { diff --git a/src/components/Onfido/index.css b/src/components/Onfido/index.css index b013311e1509..15925ff05f05 100644 --- a/src/components/Onfido/index.css +++ b/src/components/Onfido/index.css @@ -1,4 +1,8 @@ /* These style overrides are necessary so that the Onfido modal looks nice */ +:root { + --ods-color-border-separator: transparent; +} + .onfido-sdk-ui-Modal-inner { border-style: none !important; width: 100% !important;