
-
AuthorPosts
-
September 11, 2025 at 11:48 am #1489160
The logo background (logo area background color) is set to white (#ffffff). This works for both the full and narrow desktop views.
But the background is dark gray on mobile devices. It can only be changed with very bright special colors, which do not fit into the color scheme.
Due to the dark background, the burger menu is no longer visible.Another question: How and where can I change the colors of the search icon and the social icons in the header? When I hover over them with my mouse, a bright color appears that is not set anywhere in the styling.
So, two open points/questions:
1. Why do the header colors differ between desktop and mobile? How can I synchronize this?
2. How and where are the colors of the icons and the burger menu in the header adjusted?September 12, 2025 at 5:37 am #1489179Hey schub1981,
Thank you for the inquiry.
We may need to inspect the elements on your site in order to provide an appropriate solution. Please provide the site URL in the private field. Have you tried adjusting the color options in the Enfold > General Styling > Logo Area tab?
In the meantime, to adjust the color of the burger menu icon on mobile view, try to use the following css code:
@media only screen and (max-width: 767px) { /* Add your Mobile Styles here */ .header_color .av-hamburger-inner, .header_color .av-hamburger-inner::before, .header_color .av-hamburger-inner::after { background-color: #da2727; } .html_av-overlay-side-classic #top .av-burger-overlay li li .avia-bullet, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::before, .html_av-overlay-side.av-burger-overlay-active #top .av-hamburger-inner::after { background-color: #da2727; } }
Best regards,
IsmaelSeptember 12, 2025 at 9:17 am #1489184Hi Ismael,
Thanks for your answer.
I tried to to adjust the color of the burger menu icon on mobile view with your CSS code, but it doesn’t work. I added the CSS snippet under “General Styling” in the “Quick CSS” window.Please find the website link in private field.
September 15, 2025 at 5:34 am #1489238September 16, 2025 at 9:42 am #1489269Please find login details in private field.
September 17, 2025 at 5:31 am #1489299September 17, 2025 at 5:32 am #1489300Hi!
If you need to adjust the color of the search icon as well, include the following css code.
#top #header .av-main-nav > li > a > svg:first-child, #top #wrap_all .header_color .cart_dropdown_first .cart_dropdown_link.avia-svg-icon svg:first-child { fill: #006ab5; stroke: #006ab5; }
Best regards,
IsmaelSeptember 17, 2025 at 10:00 am #1489307Thank you!
September 18, 2025 at 5:15 am #1489337 -
AuthorPosts
- The topic ‘Color setting Logo Area Heading’ is closed to new replies.