1. 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

Discussion in 'Styling and Customization Questions' started by napy8gen, Apr 19, 2013.

  1. napy8gen

    napy8gen Active Member

    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.
     
  2. Shelley

    Shelley Well-Known Member

    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.
     
  3. Shelley

    Shelley Well-Known Member

    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);
    }
     
  4. napy8gen

    napy8gen Active Member

    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.
     
  5. Tracy Perry

    Tracy Perry Well-Known Member

    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).


    Code:
    .xenForm .ctrlUnit dd .textCtrl {
    background-color: black;
    }
     
  6. napy8gen

    napy8gen Active Member

    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.
     
  7. Tracy Perry

    Tracy Perry Well-Known Member

    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.
     
  8. napy8gen

    napy8gen Active Member

    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.
     
  9. Tracy Perry

    Tracy Perry Well-Known Member

    It looks like it has something to do with the following class

    class=xenForm AutoValidator FollowForm

    but I'm not familiar enough with punching down that far to style it... sorry.
     
  10. Tracy Perry

    Tracy Perry Well-Known Member

    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?
     
  11. Shelley

    Shelley Well-Known Member

    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;}
    
     
  12. napy8gen

    napy8gen Active Member

    follow.png ok thank you for your time. for any one else that may help for the no 2. the follow field pop thing screen attached.
     
  13. napy8gen

    napy8gen Active Member

    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.
     
  14. napy8gen

    napy8gen Active Member

    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>
     
  15. napy8gen

    napy8gen Active Member

    sorry the problem with select menu is Chrome only
     
  16. Brogan

    Brogan XenForo Moderator Staff Member

    I think the class you want is ul.autoCompleteList
     

Share This Page