This website uses cookies to personalize your experience. By using this website you agree to our cookie policy.

Dropdown color

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #11555
    Gee RanasinhaGee Ranasinha
    Participant

    How do you change the dropdown box color?

    #11602
    Ernest MarcinkoErnest Marcinko
    Keymaster

    Hi!

    On the Theme Options -> Settings icon & Drop-down panel, with the Settings drop-down background gradient option: http://i.imgur.com/6VOqg6x.png

    If you use the block layout for the drop-down, then the color is inherited from the theme, and can only be changed via custom CSS, like so:

    [html].wpdreams_asp_sc.searchsettings {
    background: #000000 !important;
    }[/html]

    #11617
    Gee RanasinhaGee Ranasinha
    Participant

    Thanks, but that changes the color of the background element – not the dropdown button color.

    I would like to change the color of the actual button (see attachment).

    I would also like to increase font size of dropdown titles, as well as center the set of 4 buttons.

    Thanks in advance.

    #11620
    Ernest MarcinkoErnest Marcinko
    Keymaster

    Hi!

    I see now. For that use this custom CSS:

    [html]div .ajaxsearchpro.searchsettings select {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: initial !important;
    border-radius: initial !important;
    box-shadow: none !important;
    }[/html]

    The ‘color’ attribute is for the text color.

    #11621
    Gee RanasinhaGee Ranasinha
    Participant

    Thanks – this is great.

    One thing: How do I center the dropdown set underneath the search bar?

    #11622
    Ernest MarcinkoErnest Marcinko
    Keymaster

    It depends on the exact situation, but this might work:

    1. Select the flex layout for the settings box on the Fronted Search Settings panel: http://i.imgur.com/1P92NeE.png

    2. And then use this custom CSS to justify the content to the middle:

    [html].searchsettings form {
    align-items: center;
    justify-content: center;
    }[/html]

    #11638
    Gee RanasinhaGee Ranasinha
    Participant

    Perfect! Thank you.

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.