Change menu link color only on responsive menu (Burger Menu)

My site is now ready except for one little thing I can't fix.
I have a transparent top bar menu with white links.
For the sticky header I chose white background and black links.
Now when the page is responsive and gets the burger menu toggle the background color of this menu is white and since my link color is also white you can't see anything. As soon as I scroll down and the sticky header is active, the link color changes to black.

So how can I change the link color for smaller devices with the burger menu to black without changing it for desktop sizes?

if it helps the page is http://friseur-empl.de/homedraft/

Comments

  • and maybe as an additional info:
    When the screen size is more narrow and the sticky header is there from the start [logo in the middle - menu toggle right] the links are black.
    It's just for this appearance in between, where the top bar is transparent, logo on the left and the burger menu toggle on the right
  • Hi,
    That link you send isn't working, and index page isn't made with BeTheme.
    We can't help you with not our themes.
    Thanks.

  • Yes the index page is not betheme but the new one is. the link I sent you is the draft for the new homepage which is made with be theme. I apparently don't have the permission to send you a message so I can't provide you with credentials.

    But maybe you could try to answer my question anyway?
  • All I can do without taking a look at your website is redirecting you to :
    BeTheme > Theme Options > Responsive > Header. There you can enable the transparent header for device.
    and BeTheme > Theme Options > Colors  > Header > Top bar left background to change the color on mobile

    Thanks.
  • Hi Pablo. These options don't help me it's about the font color in the dropdown menu that appears from the burger menu -> see picture
    image

    You should have received credentials over the envato contact form so you can check it out

    cheers
  • We have logged in to this page and the drop down menu colors are black, not white like in your screenshot. Please disable cache plugins and clear your browser cache, it is most likely caused by it.
  • Hi Brian - that's because I changed it to black for now so the site is usable (now online). but white font in the transparent top bar would be better in general. And that's where the described problem comes in because on tablet and mobile devices the menu background is also white. And when I change the tobbar left color to black it doesn't work with my sticky bar settings anymore (would be black on black then). So I was looking for an option to change the font color for mobile devices to black without interfering with the desktop settings
  • What you need to do it this:
    1. Change the font color for the menu items to white.
    2. Since you have a transparent header, go to theme options>colors>header and change the top_bar_left background to black
    This way you will have white text on both mobile and desktop versions.
    thanks
Sign In or Register to comment.