Changing the Color for the Open ID Button

Hey @SIC! Thanks for your question. It should be a relatively easy adjustment by leveraging Docebo’s custom stylesheet in Branding, Look and Feel.

The challenge you’ll find is that the HTML for this particular button uses an “nth child” naming convention. I’ll highlight that below. Depending on how many SSO buttons you have introduced and active on the sign-in page, the child number for the selector will vary. In my example code, you’ll see that what I’ve had to target is the 6th “nth-child” reference. Otherwise, I expect the selector and HTML reference to be relatively identical less the child reference itself.

Login page view of OpenID icon/button, with color updated:

In the screenshot above, you can see that I just matched the color to what the background already was for this test site’s sign-in page.

Example CSS code:

#doc-layout-login > div.login-wrap > form > div.sso-buttons > ui-button-raised-neutral:nth-child(6) > ui-button-raised > button {background-color:#002f8e}

Hope this helps!