Google Sign-in branding

[dynosapp]

Hi, we got an email this morning from Google that our google authentication screen needs to conform to Google’s branding.
We have been using Auth0-provided google-oauth2 connection and it has been rendering an auth screen like this… “LOG IN WITH GOOGLE”
which is different from what is suggested in their branding-guidelines.
I was a looking for a setting to update this, but it looks like it is something you have to do it on your end. If this is right, could you update Auth0’s default styling for Google authentication as required by Google? If not, please suggest where we can update this.

[mathiasconradt]

@dynosapp In the Auth0 Dashboard > Universal Login Page, do you have selected the Classic or the New Universal Login Experience (I suggest to choose the latter)? Looking at the screenshot, it seems that your using the Classic version.

Note that the new one has a different Google button and this should be in line with the Google guidelines. See example below, second screenshot.

[dynosapp]

Thanks for the quick response. It says No JavaScript required. Do we need to update our code for this change? We have been using the lock CDN.
And the code is something similar to this:

<script src="https://cdn.auth0.com/js/lock/11.6.1/lock.min.js"></script>
<script>
    document.getElementById('signin-link').onclick = function () {
        var pwdless = new Auth0LockPasswordless(CLIENT_ID, CLIENT_DOMAIN, options)
        pwdless.show();
    }

[dynosapp]

Wait! Passwordless option is not supported using New Universal Login UI? That’s a bummer. So, we can’t use it yet. So, the problem still persists.

[mathiasconradt]

Ok, so in case of Passwordless, you are right.

New Universal Login Experience

Don’t see an adhoc solution right now, instead of maybe overwriting a few css styles somehow, though this might be a bit hacky.

[dynosapp]

Thanks. Surprised that no oneelse experienced this issue before. I already see the place where I can hack it on the lock.js. It would be nice if Auth0 can handle it as soon as possible though.

[luis.rudge]

Hi! Did google outlined what is not conforming with the guidelines? It’s unlikely it is the text, since the “log in with google” is only a recommendation, not a requirement.

[dynosapp]

No, they just said it needs to conform to their branding guidelines. It is not only text, but also the color. There are two options on thier guidelines - Light or Dark. The one we are using is different from either of them in many aspects.

[luis.rudge]

Please update Lock to the latest version. We updated it last year to adhere to the google design guidelines.

[dynosapp]

Thanks! That did the trick.

[konrad.sopala]

Glad it works for you now @dynosapp!