Take your website
To the next level
Discover our newly launched customization services and elevate your web projects to new heights.
Delegate tasks, save time, and unlock the power of professional WordPress outsourcing.

Okay
  Public Ticket #3572504
Search colors in custom header
Closed

Comments

  • csiscommunications started the conversation

    I need to customize the color of the search bar in a custom header/top menu, but I'm not seeing any options. Am I missing something? How can I accomplish this?

    I also note that the "Submit" button is not appearing properly.

    Attached files:  Screenshot 2024-01-29 151645.png

  •  4,780
    Michael replied

    Hi,

    Please specify which colors you want to use and we will help you change them with custom code.

  • csiscommunications replied

    Border and outer area: #A31F15

    Text box: white with typed text in black and the border in #F9F9F9. The "Search..." placeholder should also be black.

    "Submit" in #A31F15 with a hover to black.

    Please let me know if I've missed anything.

  •  4,780
    Michael replied

    I've added this CSS:

    9911228080.png

    Please check your site now.

  • csiscommunications replied

    Looks good!

    One item I missed: when the search box is open, the close "X" is a light blue. Can we change that to white?

  •  4,780
    Michael replied

    This setting affects the color of the icon.

    6987650563.png
  • WeatherManNX01 replied

    Thanks!

  • WeatherManNX01 replied

    Hi, another color question, if it's all right to use the same ticket.

    I'm trying to change the color of the text in a closed accordion so that it's white on a colored background. I used the custom code listed at https://docs.codex-themes.com/article/380-toggles-accordion, but the text is still black.

    The page in question is https://michaelh497.sg-host.com/congregations/dwelling/

  • WeatherManNX01 replied

    Also changing the accordion +/- icon colors, if possible (+ to white, - to black).

  • csiscommunications replied

    Sorry, looks like I was logged into my personal account instead of my work account. Those are indeed my question. :)

  •  4,780
    Michael replied

    pls. use following css:

    body .vc_tta.vc_tta-color-thegem.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-title>a {
        color: #fff;
    }
    body .vc_tta.vc_tta-color-thegem.vc_tta-style-classic .vc_active .vc_tta-controls-icon::before {
        border-color: #000 !important;
    }