Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • March 13, 2025 at 12:56 pm #1479233
    classywebsites

    After updating up to Enfold 7.1, the search icon on the main menu on desktop and mobile turned grey. It used to be white, like the white text on the main menu on desktop and the white menu icon on mobile.
    I tried resetting Performance in theme options, flushing cache, flushing browser cache and deactivating all plugins.
    Please see the staging site with the Enfold 7.1 problems and the live site with Enfold 6.0.9 without problems in the Private Content below.
    Can you please help? Thank you.

    March 13, 2025 at 1:19 pm #1479245
    Rikard

    Hey classywebsites,

    Thanks for the login details. The search icon gets its colour from Enfold->General Styling->Logo Area->Logo Area Secondary Font Color, you can change the colour there. If you want to set the colour using your own CSS, then please use this in Quick CSS:

    .header_color .main_menu ul:first-child > li > a svg:first-child {
  stroke: #fff;
  fill: #fff;
}

    Best regards,
    Rikard

    March 13, 2025 at 2:53 pm #1479261
    classywebsites

    Hi Rikard,
    When I changed the Logo Area Secondary Font Color to white #ffffff, the search icon becomes white, the way it was before the update.
    But, when I type in the search box I cannot see the text because it is white, versus before when the icon was white and the text was in the search box was grey #808080.
    I want to correct this issue without custom css. Thank you.

    March 14, 2025 at 8:51 pm #1479366
    classywebsites

    Hi Rikard,

    Did you have a chance to read my message above. Can you please help me to get my search icon back to the way it was before upgrading to Enfold 7.1, with a white search icon with grey text in the search box? I want to correct this issue without custom css. Thank you.

    March 17, 2025 at 1:56 pm #1479538
    Rikard

    Hi,

    Sorry for the late reply. We’ve checked this and it looks like the theme styling and settings are correct. This CSS in your child theme is setting your menu items as white:

    /* add new css to fix header style in this version */
.main_menu ul:first-child > li > a, #top .header_color .main_menu .menu ul .current_page_item > a, #top .header_color .main_menu .menu ul .current-menu-item > a, #top .header_color .sub_menu li ul a {
color: #fff;
}

    If you want to target the search icon as well, then please add this CSS as well:

    .header_color .main_menu ul:first-child > li > a svg:first-child {
  stroke: #fff;
  fill: #fff;
}

    Best regards,
    Rikard

    March 18, 2025 at 4:06 pm #1479637
    classywebsites

    Hi Rikard,

    Strange that the Enfold 7.1 update changed the search icon from white to grey. Your fix worked. Can you please close the thread? Thank you!

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Broken Search Icon After Updating to Enfold 7.1’ is closed to new replies.