Best Answer

Changing the colour of the sign in button only

G
Rank
Userlevel 3
Badge

Hi,

Does anybody know the CSS for changing the background colour of the sign in button (not SSO) and colour of the text?

Thanks in advance.

Gigi

icon

Best answer by gstager 6 July 2022, 18:21

View original

6 replies

gstager
Rank
Userlevel 7
Badge +5

Give this a go.

As always - be sure to test

/** Login Button Tweaks **/
/** Set desired color for button with background-color **/
/** Set desired color of text with color **/

div.login-button button {
    background-color: #000000 !important;
    color:#00ff00 !important;
}

Hope this helps!

Greg
G
Rank
Userlevel 3
Badge

@gstager thank you very much.

 

This one worked at the end: 

ui-button-raised.ui-button-negative button {background-color: #777!important;}

 

Gigi

 

gstager
Rank
Userlevel 7
Badge +5

OK

There is more than one way to accomplish things - to be sure!

Your code will affect more than just the login button - though - but perhaps that is more what you were looking for…?

I was trying to target just that login button for you.

Greg
Bfarkas
Rank
Userlevel 7
Badge +3

Tagging onto @gstager, that second solve, ui-button-raised.ui-button-negative button, is also more likely to change in the long run in updates since it has several classes and a string of them rather than the one element.

G
Rank
Userlevel 3
Badge

Thank you both, I see your point. Has changed the reference to the login-button only and used the code suggested by @gstager . It worked a treat, thank you.

Gigi

hwolfehall
Rank
Userlevel 5
Badge

As a side note, I needed to change the SSO login button to be “less visible” (not the login button) and was able to adjust the above code a bit for that:  

 

/** SSO Login Button Tweaks **/

/** Set desired color for button with background-color **/

/** Set desired color of text with color **/

 

div.sso-buttons button {

    background-color:   

#FFFFFF !important;

    color:#ABB2BA !important;

}

 

 

Reply


Terms & ConditionsCookie settings