• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

login / sign in box background colour

#1
Last question for the moment, I promise!

Where can I change the background colour of the login/signup (popup) box? Right now, it's black text on black, which is not a good look...
 

Attachments

Russ

Well-known member
#2
Last question for the moment, I promise!

Where can I change the background colour of the login/signup (popup) box? Right now, it's black text on black, which is not a good look...
That should be under->

Appearance -> Style Properties - > Your template of choice -> Form Elements
 

Jake Bunce

XenForo moderator
Staff member
#3
Where can I change the background colour of the login/signup (popup) box? Right now, it's black text on black, which is not a good look...
Edit this template:

Admin CP -> Appearance -> Templates -> login_bar.css

Code:
	#loginBar .textCtrl:focus
	{
		background: black;
	}
The text uses this palette color:

Admin CP -> Appearance -> Style Properties -> Color Palette -> @primaryLightest

Or if you want to make an exception for that one instance then you can edit the same template to reference a different palette color or manually set a color:

Admin CP -> Appearance -> Templates -> login_bar.css

Code:
	#loginBar .textCtrl
	{
		background: @primaryDark;
		border-color: @primaryLightish;
		color: @primaryLightest;
	}
 

Carlos

Well-known member
#4
Everytime I use these @colors, it overwrites another variable, if I change the color. For example, I tried changing the options bar (babyblues), but instead, I changed the color for outlines, AND therefore it changed the footer variable!

So, I will fix this login box by hex'es.
Edit this template:

Admin CP -> Appearance -> Templates -> login_bar.css

Code:
	#loginBar .textCtrl:focus
	{
		background: black;
	}
Does this css sheet have a variable for font colors?
 

Jake Bunce

XenForo moderator
Staff member
#5
Everytime I use these @colors, it overwrites another variable, if I change the color. For example, I tried changing the options bar (babyblues), but instead, I changed the color for outlines, AND therefore it changed the footer variable!

So, I will fix this login box by hex'es.
Most of the palette colors are used in multiple locations on the page. So yes, you can manually set hex codes for specific locations in the CSS.

Does this css sheet have a variable for font colors?
The font color in the login box is a different section in the same template. That is in my previous post.