Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • January 3, 2014 at 12:31 pm #204971
    Minz

    Hello!

    I’m quite pleased with the theme so far! :) However I was wondering how I can style the colors of the search box in the header seperately. I searched the forum and tried it myself, but didn’t succeed.

    I noticed that the background color of the header affects the box, but that doesn’t help me. Basically I would like the search box to have a light background with dark link/font colors. I’d also like to have the search button to have a different link and hover color: https://dl.dropboxusercontent.com/u/20750570/screen_tv.jpg

    Is this possible without too much hassle and can you point me to the CSS I need to edit for that?

    Thanks a lot in advance! :)

    January 3, 2014 at 6:27 pm #205079
    Yigit

    Hey Minz!

    Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as needed

     .header_color .avia-tt .avia-arrow, .header_color .avia-tt { background-color: red; color: blue; }
#top .header_color input[type='text'] { background-color: blue; color: white; }
.header_color input[type='submit'] { background-color: red; }
.header_color input[type='submit']:hover { background-color:blue; }

    Best regards,
    Yigit

    January 4, 2014 at 2:10 am #205221
    Minz

    Thanks so much for the fast answer Yigit! This did the trick :) It looks almost perfect, the only thing I couldn’t figure out myself is how to change the hover color (should be white instead of the dark brown) and the backrgound color of the round icon.
    https://dl.dropboxusercontent.com/u/20750570/screen_tv2.jpg

    Can I change these two things aswell?

    Thanks! :)

    January 4, 2014 at 3:09 am #205228
    Yigit

    Hey!

    Please add following code to Quick CSS as well

    #top .header_color .ajax_search_entry:hover {
background-color: white;
}

    Regards,
    Yigit

    January 4, 2014 at 3:19 pm #205324
    Minz

    Perfect, thank you! Though I also asked if the icon’s colors can be changed as well? (especially the BG color)
    Sorry for bothering again!

    January 4, 2014 at 6:30 pm #205365
    Yigit

    Hi!

    Please add following code to Quick CSS

     .header_color input[type='submit']:hover {
background-color: blue;
color: red;
border-color: blue; }
 .header_color input[type='submit'] {
background-color: red;
color: blue;
border-color: red;

    Best regards,
    Yigit

    January 5, 2014 at 5:50 pm #205580
    Minz

    Awesome! Everything’s solved, thanks for the great support :))

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Styling of the Header Search Box’ is closed to new replies.