Sight theme: change color, or hide,the auto assistive-text "search" in searchbox

• 

  unbosquedeteverde · Member · Oct 28, 2013 at 7:24 pm

  • Copy link
  • Add topic to favorites

  Hi, is there a way via CSS to change the color, or hide, the auto assistive text that appear in the searchbox of SIGHT THEME while its empty. I mean, when empty the search box shows the word “search” in light gray. I want to change the color of this assistive text to blue, or just hide it.

  Thanks in advance.

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Oct 29, 2013 at 5:40 pm

  • Copy link

  Hi there, this took a bit of time to figure out, and I see you got it hidden in Chrome and Safari, but I was still seeing it in Firefox. The following, added to your CSS will remove it in Firefox as well.

  .header-search input[placeholder="Buscar …"] {
      color: rgba(0, 0, 0, 0);
  }

• 

  unbosquedeteverde · Member · Oct 29, 2013 at 9:54 pm

  • Copy link

  Thanks a lot thesacredpath. Unfortunatly it don´t work. Actually what i did to hide it is choosing the same grey for the background and the grey, that i don´t know how to change, of the assistive text. But if i change the background of the searchbox, the “Search – buscar” text is still there. I tried to add the code you told me but the auto text is still there whith the with the same color, the gray. I use Chrome. Thanks a lot anyway.

• 

  thesacredpath · Member · Oct 30, 2013 at 2:39 am

  • Copy link

  I’ve tried several different things and cannot get the text to go away. I think your solution of making the background the same color as the text is a good solution at the moment. I can hide the text on other themes using code similar to what I have given, but in this theme it isn’t working.

• 

  unbosquedeteverde · Member · Oct 30, 2013 at 8:23 am

  • Copy link

  I tried a lot of options too but no one worked. Well, at least we tried ;). Thank you very much for your help. I really appreciate it.

• 

  thesacredpath · Member · Oct 30, 2013 at 8:55 pm

  • Copy link

  You are welcome.

• 

  designsimply · Member · Nov 20, 2013 at 10:18 pm

  • Copy link

  This is a great article about the CSS needed to modify placeholder text:
  http://css-tricks.com/snippets/css/style-placeholder-text/

  I think it has what you need.

  Try it out and let us know if it works.

• 

  unbosquedeteverde · Member · Nov 30, 2013 at 10:25 am

  • Copy link

  Thanks a lot desigsimply. That article give me the answer.

• 

  designsimply · Member · Dec 1, 2013 at 3:18 pm

  • Copy link

  Awesome!