• Resolved deborarichard

    (@deborarichard)


    Hello,

    I’d like the search form icon color in the header to change after scrolling down. How to fix this? CSS?

    Kind regards,

    Debora

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Contributor Robert Wattner

    (@rwattner)

    Hi, do you have a link to the page you would like help with? I can write some custom CSS for you to do this.

    Thread Starter deborarichard

    (@deborarichard)

    Thanks! Can I send you the login details by email? The site is on maintenance mode.

    Thread Starter deborarichard

    (@deborarichard)

    I tried some code myself, reading some of your other answers on this forum, and it worked! Thanks!

    .she-header .elementor-search-form__toggle i {color:#191919;}

    I also want to change the color of the “pointer underline” when sticky and the color of the mobile hamburger icon when sticky. Any suggestions for that?

    Thread Starter deborarichard

    (@deborarichard)

    I also figured out the toggle:.she-header .elementor-menu-toggle i {color:#191919;}

    What’s left is the pointer underline while hovering over the menu…

    Plugin Contributor Robert Wattner

    (@rwattner)

    Hi, sorry for not getting back with you right away. For some reason I’m not getting email notifications for posts here.
    That’s great that you figured that out! I will be back to my computer later and can find the class or id needed for the menu pointer. Let me know if you already found it.

    Plugin Contributor Robert Wattner

    (@rwattner)

    Here is the code to change any of the pointer styles after scrolling

    /* UNDERLINE */
    .she-header .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after {
        background-color: #000000 !important;
    }
    /* OVERLINE */
    .she-header .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before {
        background-color: #000000 !important;
    }
    /* DOUBLE LINE */
    .she-header .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after, .she-header .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before {
        background-color: #000000 !important;
    }
    /* FRAMED */
    .she-header .e--pointer-framed .elementor-item:before, .she-header .e--pointer-framed .elementor-item:after {
        border-color: #000000 !important;
    }
    /* BACKGROUND */
    .she-header .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after {
        background-color: #000000 !important;
    }
    /* TEXT HOVER */
    .she-header .elementor-item:hover, .she-header .elementor-item-anchor:hover {
        color: #000000 !important;
    }

    Here is the code to change the menu text color on scroll

    /* TEXT */
    .she-header .elementor-item, .she-header .elementor-item-anchor {
        color: #000000 !important;
    }

    Obviously just change the #000000 to whatever color you like. RGBA(0,0,0,1) will work also if you would like transparency.

    I hope this helps you!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Search form color’ is closed to new replies.