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

select form menu bg color

napy8gen

Active member
#1
Hi Guys. 2 questions.

1. where can I find select form drop menu list bg color usually seen in setting or editor multiple select menu, overwriting .textCtrl do nothing

2. and people you follow index.php?account/following, when we key in follow: field somebody name, it suggest a user while typing, I need that suggestion name - bg color.
 

Shelley

Well-known member
#2
Hi Guys. 2 questions.

1. where can I find select form drop menu list bg color usually seen in setting or editor multiple select menu, overwriting .textCtrl do nothing

2. and people you follow index.php?account/following, when we key in follow: field somebody name, it suggest a user while typing, I need that suggestion name - bg color.
Style properties >> popup menus The options are in there

2. Not sure what you mean I'll leave that to someone else to responded you you on.
 

Shelley

Well-known member
#3
Style properties >> popup menus The options are in there

2. Not sure what you mean I'll leave that to someone else to responded you you on.
If the Style properties don't work you could always try pasting the following in the EXTRA.css template and adjust the rgba values to your preference or use hex values and set the opacity to your preference (pending you still use RGBA). The menu is broken into areas so you have to alter each section accordingly and input your color values.

Code:
.Menu .primaryContent {
    background-color: rgba(255, 0, 0, 0.96);
}
.Menu .secondaryContent {
    background-color: rgba(255, 0, 0, 0.96);
}
 
.Menu .sectionFooter {
    background-color: rgba(255, 0, 0, 0.9);
}
 

napy8gen

Active member
#4
Hi Shelly thank you for answering maybe I dont tell better way. English my 2nd language.
Here goes again.

1. The <select> menu that we can see in thread display option in thread list page.
Sort threads by: <select> Order threads in: <select>

now the <select> has white bg I need to change that to black but overwriting .textCtrl in EXTRA.css with !important does nothing.

2. and for "people you follow" in user setting, the link is index.php?account/following, when we keyed in somebody name in {follow:<field> } it suggest a user while typing, appear like a pop down, I need that suggestion name - background color.

Thanks in advance. Thank for answering my stupid questions. but that was not the answer.
 

Tracy Perry

Well-known member
#5
Hi Shelly thank you for answering maybe I dont tell better way. English my 2nd language.
Here goes again.

1. The <select> menu that we can see in thread display option in thread list page.
Sort threads by: <select> Order threads in: <select>

now the <select> has white bg I need to change that to black but overwriting .textCtrl in EXTRA.css with !important does nothing.
Code:
.textCtrl {
background-color: rgb(0, 0, 0) !important;
}
is what you used? Realize this will be a global for ALL inputs (like the search bar also).


2. and for "people you follow" in user setting, the link is index.php?account/following, when we keyed in somebody name in {follow:<field> } it suggest a user while typing, appear like a pop down, I need that suggestion name - background color.

Thanks in advance. Thank for answering my stupid questions. but that was not the answer.
Code:
.xenForm .ctrlUnit dd .textCtrl {
background-color: black;
}
 

napy8gen

Active member
#6
Hi Tracy thank you for answering but..

1. Yes I did used that overwrite for .textctrl with !important tag but it does nothing.
Have you tried on your board?

2. You almost correct but its not the thing .xenForm .ctrlUnit dd .textCtrl is the text field itself but its not what I am looking for.
try to key in someone on your board that you know the username, while typing there will be a pop suggestion. that pop menu has icon and username.So the pop layer background is white.

My style is black so these are areas which are not yet black.
 

Tracy Perry

Well-known member
#7
Hi Tracy thank you for answering but..

1. Yes I did used that overwrite for .textctrl with !important tag but it does nothing.
Have you tried on your board?

2. You almost correct but its not the thing .xenForm .ctrlUnit dd .textCtrl is the text field itself but its not what I am looking for.
try to key in someone on your board that you know the username, while typing there will be a pop suggestion. that pop menu has icon and username.So the pop layer background is white.

My style is black so these are areas which are not yet black.
Yes, and it worked just as expected, making all textCtrl input areas black.
On the second.. I'll check Chrome developer to see if I can find that.
 

napy8gen

Active member
#8
Can you confirm that it worked on The <select> menu that we can see in thread display option in thread list page.
Sort threads by: <select> Order threads in: <select>

It still not working for me. I attached a screenshot.
 

Tracy Perry

Well-known member
#10
Can you confirm that it worked on The <select> menu that we can see in thread display option in thread list page.
Sort threads by: <select> Order threads in: <select>

It still not working for me. I attached a screenshot.
I went to the site in your profile but it is the vBulletin theme site apparently. You have a link available to the site you are trying to style?
 

Shelley

Well-known member
#11
Still not sure what you are aiming for but try the following and adjust accordingly on the offchance this may be what your looking for.

Code:
.DiscussionListOptions .textCtrl {
background-color: red;
color: white;}

.DiscussionListOptions .textCtrl:focus, .DiscussionListOptions .textCtrl.Focus {
background-color: green;
color: white;}
 

napy8gen

Active member
#13
I went to the site in your profile but it is the vBulletin theme site apparently. You have a link available to the site you are trying to style?
Hi Tracy, I am styling first time for a customer. This is my first xenforo style. I havent show to customer so I cannot show to you yet.
 

napy8gen

Active member
#14
Still not sure what you are aiming for but try the following and adjust accordingly on the offchance this may be what your looking for.

Code:
.DiscussionListOptions .textCtrl {
background-color: red;
color: white;}
 
.DiscussionListOptions .textCtrl:focus, .DiscussionListOptions .textCtrl.Focus {
background-color: green;
color: white;}
You got it almost correct but it only changes the option values bg color not the select menu bg itself.
Actually I aimed for all select menus including found in user settings or any settings available with select menus. From screenshot above you can see 2 select menus background are white. but when we chose a value, that options values are correct colors using that textCtrl class. but the top tag<select> is not changing.
<select>
<option></option>
<option></option>
</select>