- This topic has 5 replies, 3 voices, and was last updated 3 years, 5 months ago by Elvin.
-
AuthorPosts
-
October 21, 2020 at 11:46 pm #1499326Michelle
Hi. Currently my header has the preset colors (bg: #f2f1ed and text #25940C) and those colors show perfectly in the Desktop and Tablet view. However, in the mobile view the menu first shows the links with a with text on a grayish-like background and once you start scrolling down the sticky menu kicks in with the correct color sequence of (bg: #f2f1ed and text #25940C). I’ve looked all over the customized sections to see were I can correct this with no luck in sight. Could someone please point me in the right direction as I’ve clearly overlooked the correct section. Thank you.
October 22, 2020 at 3:25 am #1499544DavidStaffCustomer SupportHi there,
can you share a link to your site so i can see the issue?
You can use the Private Information box.October 22, 2020 at 2:19 pm #1500515MichelleHi! Not sure if my response to your question was received, as I do not see it listed. I’ve added the URL in the “Private Information” box.
Since submitting my Thread, I’ve played around with the color scheme (primary and secondary navigation), added a new menu, removed/added again the sticky navigation, and cleared the cache and cookies on my PC, mobile and tablet and still no luck.
October 22, 2020 at 5:58 pm #1500617ElvinStaffCustomer SupportHi,
To clarify: You want the initial header state to have the same color as the sticky header state?
…once you start scrolling down the sticky menu kicks in with the correct color sequence of (bg: #f2f1ed and text #25940C).
I’ve checked your site and its actually the other way around. The toggle button on sticky header state had a background of #25940C (green) and text color of #f2f1ed (grey/beige?) as shown here:
https://share.getcloudapp.com/d5upOWqqIf you want the inverse of this, you can try this CSS:
@media (max-width:768px){ .mobile-menu-control-wrapper .menu-toggle, .mobile-menu-control-wrapper .menu-toggle:hover, .mobile-menu-control-wrapper .menu-toggle:focus, .has-inline-mobile-toggle #site-navigation.toggled { background-color: #f2f1ed; color: #25940C; } }
or if its the inverse, just swap the value between
color
: andbackground-color:
.October 22, 2020 at 6:14 pm #1500623MichelleHi Elvin:
Thank you for the CSS. That worked like a charm. I did clear the cache and cookies on my PC/mobile/tab and even viewed on another PC and laptop and was still showing white text with the grayish background.October 22, 2020 at 6:22 pm #1500626ElvinStaffCustomer SupportDo you want the same color to be applied on the sticky header state as well?
If so, try adding this too:
#sticky-navigation button.menu-toggle { background-color: #f2f1ed; color: #25940C; } #sticky-navigation button.menu-toggle:hover, button.menu-toggle:focus { color: #25940C; }
Adding this should override the green background set by elementor’s CSS.
-
AuthorPosts
- You must be logged in to reply to this topic.