Auth0 lock dialog for login and singup social icons greyed out in safari browser

[gmrao]

Hi,

We are using auth0 lock 11.20.1 version. The social icons in auth0 dialog showing grey in safari. Is there any property needs to be set to work them properly?

In chrome colors showing properly.

Thanks
Manohar

[stevehobbsdev]

Unfortunately I don't experience that on my end. Are you getting any JavaScript errors in the developer console? Do you have your app published anywhere where I can test this out in your environment?

[gmrao]

I see this error other than that no errors -> ignoring an element of additionalSignupFields (role) because it has hidden type but doesnt specify a value.

You can check app at https://qa-app.zyyah.com. Click on login or signup buttons.

[gmrao]

Hi,

Appreciate your help on this.

[stevehobbsdev]

Hi @gmrao, apologies for the delay.

I've had a bit of a play and there's obviously some style customization here which may be getting in the way. When I use the default Lock template with it's default styling, I don't get any issues with the social buttons in Safari, so I would start by peeling back the style customizations that have been applied to see what is affecting your login page.

When I was tinkering though, I noticed that some styles were being applied by Bootstrap which may have an effect. For example, if I disabled the style rule from Bootstrap that applied -webkit-appearance: button to the social buttons, the proper styling more or less came back. Also, I can see that the background for the Facebook social button has been commented out.

Hopefully that gives you a start. Closing this for now but if you still feel there's something we need to do on the SDK, please feel free to continue the discussion.