Transparent mobile menu

Hello, below the mobile menu there is nothing so it can’t be transparent, however if you want me to adjust it and move it so it looks like on desktop please share wp-admin access 🙂

Hi,

As per Laura’s reply there is no content behind the mobile menu so you won’t be able to set it to transparent as is. You can however change the color by using the below CSS in your KLEO Child theme’s style.css by going to Appearance > Editor > KLEO Child > Style.css or Theme Options > General Settings > Scroll to: ‘Quick CSS’

@media (max-width: 991px) {
.kleo-navbar-fixed.navbar-transparent #header {background-color: #000000;}
}

Change #000000 to your desired color and purge your website cache and mobile device cache to see the changes.

Thanks,

Kieran

Hi,

Can you update this ticket, in a private reply, with admin credentials for your site so I can check this out.

Also please let me know the color value you wish to use and where you added the CSS.

Kieran

Hi,

As per my earlier reply you cannot realistically set the color of the header on mobile to transparent but I have followed your wishes and set the transparency for you with the below CSS. This sets the color for the whole of the mobile header and as such causes issues with your secondary request.

@media (max-width: 991px) {
.kleo-navbar-fixed.navbar-transparent #header {
    background-color: rgba(255, 255, 255, 0);
}
.secondary-menu.navbar-collapse.nav-collapse.in {
    background-color: #00943e;
}
}

Please clear your caches to see the changes. You can remove the CSS by going to WP Admin > Theme Options > General Settings > Option: Quick CSS.

Kieran