diff --git a/src/components/Onfido/BaseOnfidoWeb.js b/src/components/Onfido/BaseOnfidoWeb.js index f9f5568cad1..ff0d4adf778 100644 --- a/src/components/Onfido/BaseOnfidoWeb.js +++ b/src/components/Onfido/BaseOnfidoWeb.js @@ -31,7 +31,8 @@ function initializeOnfido({sdkToken, onSuccess, onError, onUserExit, preferredLo borderRadiusButton: `${variables.buttonBorderRadius}px`, colorBackgroundSurfaceModal: themeColors.appBG, colorBorderDocTypeButton: themeColors.border, - colorBorderDocTypeButtonHover: themeColors.link, + colorBorderDocTypeButtonHover: themeColors.transparent, + colorBorderButtonPrimaryHover: themeColors.transparent, colorBackgroundButtonPrimary: themeColors.success, colorBackgroundButtonPrimaryHover: themeColors.successHover, colorBackgroundButtonPrimaryActive: themeColors.successHover, diff --git a/src/components/Onfido/index.css b/src/components/Onfido/index.css index d05ead1027e..7e05cce7d49 100644 --- a/src/components/Onfido/index.css +++ b/src/components/Onfido/index.css @@ -10,6 +10,23 @@ position: relative; } +#onfido-mount button:focus, +#onfido-mount button:focus[data-focusvisible-polyfill], +#onfido-mount button:active { + box-shadow: none !important; +} + +#onfido-mount .-action--primary:focus, +#onfido-mount .-action--primary:focus[data-focusvisible-polyfill], +#onfido-mount .-action--primary:active { + border-color: transparent; +} + +#onfido-mount button:focus-visible { + outline: 0; + box-shadow: inset 0px 0px 0px 1px #5AB0FF !important; +} + /* This is needed to dsiable the blue outline that shows up once the payment page is opened through keyboard */ #onfido-mount [tabindex="-1"]:focus-visible, #onfido-mount [tabindex="-1"]:focus[data-focusvisible-polyfill] {