Search bar

[LovAri]

Currently, my header is transparent and all my header icons and pages are in white, when I click on the search bar nothing shows up because the scheme is white, how can I fix this while keeping everything else the same?

I attached what it looks like now and what I’d like it to look like.

[Rukhsana]

Hello @LovAri Could you please provide your store URL so that I can check it and offer a solution?

[suyash1]

@LovAri - can you please share this page link?

[DaisyVo]

Hi @LovAri

Could you please share with me your store URL and password if it has?

Best,

Daisy

[LovAri]

https://shoplovari.co/

[LovAri]

https://shoplovari.co/

[DaisyVo]

Hi @LovAri

To complete your requests, please follow these steps:

1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
2. Paste the code provided into the Custom CSS section.

search-form.search-modal__form form.search.search-modal__form * {
    color: black !important;
}
search-form.search-modal__form form.search.search-modal__form {
    border: 1px solid rgba(0,0,0,0.2) !important;
}

Here is the result: https://prnt.sc/YIMtQVsvGIDp

I hope this helps

Best,

Daisy

[LovAri]

It sort of works but when I click on it to type something the outline disappears

[DaisyVo]

HI @LovAri

Please add this code more to the same position

input.search__input.field__input:focus {
    border: 1px solid black !important;
    margin-right: 0 !important;
}

Here is the result: https://prnt.sc/PXE9zQf67pri

I hope this helps

If it helps, please let us know by giving it a Like or marking it as a Solution!

Daisy