Make Icon background Transparent

  • Resolved nihonnik

    (@nihonnik)


    6 years, 7 months ago

    Hello support,
    I am trying to make the background of the search Icon transparent. I tried putting:

    .is-search-form.is-form-style button.is-search-submit {
    background-color: transparent !important;
    }

    into the Custom CSS area, but that didn’t seem to work.
    Thanks!

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    6 years, 7 months ago

    I hope you are well today and thank you for your question.

    Could you please share your site URL where it’s displaying so that I can help you to achieve it?

    Best regards,

    Thread Starter nihonnik

    (@nihonnik)

    6 years, 7 months ago

    Hi Vinod,
    Is there a way to send you a private message with that info or make this thread private? Our site currently is in development and has login information in order to access it.

    Thanks,
    Nik

    Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    6 years, 7 months ago

    You can send it to us privately using the below form.

    https://ivorysearch.com/contact/

    Thread Starter nihonnik

    (@nihonnik)

    6 years, 7 months ago

    Hi Vinod,
    I have just sent your team a message via the contact page you listed.

    Thanks,
    Nik

    Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    6 years, 7 months ago

    You can achieve this by adding the below CSS code in the Custom CSS option of Ivory Search plugin settings on the path Ivory Search -> Settings -> Settings

    #top .is-search-form button.is-search-submit .is-search-icon {
    background: #F4F2DE !important;
}
    Thread Starter nihonnik

    (@nihonnik)

    6 years, 7 months ago

    Hi Vinod,

    Thanks, but this is not correct.
    That set the color of the Icon to #F42DE. If you scroll down the page, you will notice that the menu is sticky and converts to a white background. Also, in reactive mode / mobile, the menu is also white.

    This is why I would like it to be transparent.

    Thread Starter nihonnik

    (@nihonnik)

    6 years, 7 months ago

    Hi Vinod,

    After trying a few things it seems that I have to edit the icon CSS as well as the search CSS.
    I changed it to this:

    .is-search-form.is-form-style .is-search-icon {
    background-color: transparent !important;
    }

    .is-search-form button.is-search-submit {
    background-color: transparent !important;
    }

    This appears to do what I need.
    Thanks.

    Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    6 years, 7 months ago

    Awesome great to see you got that achieved.

    Please advise if you have more questions.

    Have a fantastic day!

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Make Icon background Transparent’ is closed to new replies.