I recently made some updates to my theme and realized that my search bar has turned all white. I assume it’s the font color that got changed because it is all white but the thing is I did not touch anything to do with the font colors. The search bar still works and I can search up products but it is all white and I have no idea how to change it back even though I’ve looked all over the theme settings.
Has anyone else ever experienced this before? Some assistance on this would be greatly appreciated!
Hi @Matt_TYH
To get the search visible properly you can add below CSS code to component-predictive-search.css, It will show like the: https://prnt.sc/TJWEAqhoPqun
div#predictive-search-results-groups-wrapper {
background-color: #253e73;
}
And below css to component-search.css
.search__input.field__input {
color: black;
}
[data-predictive-search-search-for-text] {
color: black;
}
2 Likes
Did you change the color in any Scheme of your theme? If you don’t mind, please share your store URL so I can check and give you the code to solve the solution.
Thank you so so much, that’s what I was looking for. With these codes I can also play around with the color as well!
1 Like
I did play around with the theme’s colour scheme, but I tried to change some colours back and the search bar was still white so I assumed the scheme colour change wasn’t the problem but if you could search the root cause of it that would be great! so I can avoid this mistake again next time.
Some sections use the same color scheme so when you edit colors in those settings, it could affect other pages or sections. I recommend you create a new color scheme from your Theme settings
Select that scheme to edit color so it would not affect other sections or page
1 Like
Well noted on that Dan, I will keep this in mind! Thanks for your help!
Thank you, this worked for me!!
Is it possible that you can help me change the color for the results please?
