Ajax search box color

This topic has 9 replies, 4 voices, and was last updated 9 years by sharmstr.

Author

Tagged: search input
May 15, 2015 at 03:59 #58840

joy
Participant
Can someone help me with this please? I can’t get the font color or the background of the ajax box to change. Currently, the font color within the input box is white, so it’s unseen when someone types. I’ve tried several CSS changes, this one being the most recent, to no avail:
COPY CODE
```
.header-color input[type="text"] {
color: #444444;
}
```
I would also like to change the background color of the ajax search box too. The font color in my regular search box is working just fine.

Thank you.
May 15, 2015 at 04:17 #58842

sharmstr
Moderator
Assuming you’re talking about the ajax search in the menu, here are most of the bits
COPY CODE
```
#ajax_search_container {
  background-color: blue !important;
  color: pink;
}

.ajax_search_content a {
  color: pink;
}

#ajax_searchform input {
  background-color: red;
  color: green;
}
```
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
May 15, 2015 at 04:21 #58844

Andrei
Moderator

Can you please post a screenshot pointing to which ajax search box do you refer ( as we have two of them )?
Looking forward.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

May 15, 2015 at 04:27 #58845

joy
Participant

It’s this one. Is the code that @sharmstr correct to fix the text color in this search box?

Attachments:
You must be logged in to view attached files.

May 15, 2015 at 04:29 #58847

joy
Participant

Please note, that when someone is actually typing in the search box, the background is white and the text is white. They cannot see what they are typing. However if they click outside of the search box, the background color changes, and their text is visible.

If possible, I would like to change the background and the text color. I feel it is too dark and of course the text needs to be visible while a search is in progress. Thank you.

May 15, 2015 at 04:31 #58848

joy
Participant

Oh! Nevermind, the code that was provided is correct. Thank you very much.

May 15, 2015 at 04:33 #58849

Andrei
Moderator

I’m glad to hear that your issue is fixed.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

June 2, 2015 at 21:45 #60805

chunkee
Participant

Has something changed here? I cannot find the Code in the app.min.css to make the appropriate changes. I am having the same issue. My heading text color is white, search input needs to be changed to a darker color to be visible in the search bar.
Thank you.
Chunkee

June 2, 2015 at 22:12 #60806

chunkee
Participant

Have tried a few of the CSS areas to no avail. I need to keep the white font for the nav links, but need a dark gray for the search input.

Attachments:
You must be logged in to view attached files.
June 3, 2015 at 18:55 #60916

sharmstr
Moderator
@chunkee – Dont edit any css files except /kleo-child/styles.css. The code to change the search input is
COPY CODE
```
#ajax_searchform input {
  color: #ccc !important;
}
```
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
Author

Posts