How to change colour of the mobile sub-menu. Dawn version 15.1.0

[lollypoplane]

Hi, I have managed to change the mobile menu text and main menu colours but can not change the sub-menu colour. I entered the following text which I found on the forum but it doesn't work and attached an image of my assets/component-menu-drawer.css.

.menu-drawer {background-color: #fff !important;}
.menu-drawer .link--text {color: #34675c !important;}
.js .menu-drawer__submenu {background-color: #fff !important;}

Any help would be appreciated.

Thanks

[Rahul_dhiman · Accepted solution]

Hello @lollypoplane 
Go to online store ----> themes ----> actions ----> edit code---->assets---->buddha-megamenu2.css
add this code at the end of the file.

.vertical-mega-menu>.buddha-menu-item>.mm-submenu.height-transition>li
{
background-color: #fff !important;
}
.vertical-mega-menu ul.mm-submenu,
{
color: #34675c !important;
}
.vertical-mega-menu ul.mm-submenu>li.mm-hovering>a[onclick]:not([data-href='no-link'])
{
color: #34675c !important;
}
.vertical-mega-menu>.buddha-menu-item>.mm-submenu.height-transition>li>a>.toggle-menu-btn>.mm-cross {
background-color: #fff !important;
}
.vertical-mega-menu>.buddha-menu-item>.mm-submenu.height-transition>li>.mm-submenu.height-transition {
background-color: #fff !important;
}
.vertical-mega-menu>.buddha-menu-item>.mm-submenu.height-transition {
background-color: #fff !important;
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

[dws_pvt_ltd]

@lollypoplane, 

Please share your store URL and password.So that I will check and let you know the exact solution here.

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

[lollypoplane]

www.lollypoplane.co.uk

Milly

[lollypoplane]

Hi,

I still have the same colour and unable to change it?

[Made4uo-Ribe]

Hi @lollypoplane 

Only the color right? the code is conflict it have another color before which is pink. If you can find it and change it by there then its good. If not try this code below. 

if you can look and change this one. It in the component-menu-drawer.css. 

If you can't find it try to add this on the theme.liquid. before the </body> tag. 

<style>
@media screen and (max-width: 749px) {
    @media screen and (max-width: 749px) {
    div#menu-drawer a.menu-drawer__menu-item {
        color:#34675c !important;
    }
}
</style>

And Save. 

Result:

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[lollypoplane]

Hi Made4uo-Ribe

This has changed the text colour, not the background colour. Any thoughts?

Lollypoplane

[Sangeetanahar]

hello @lollypoplane 

Go to online store ----> themes ----> actions ----> edit code ---->assets ----> base.css...>
add the code end of the file

.menu-drawer__inner-submenu .list-menu__item {
       color:  #34675c;
}

Buy me a Pizza

If this was helpful, hit the like button and accept the solution.
Thanks

[Rahul_dhiman · Accepted solution]

Hello @lollypoplane 
Go to online store ----> themes ----> actions ----> edit code---->assets---->buddha-megamenu2.css
add this code at the end of the file.

.vertical-mega-menu>.buddha-menu-item>.mm-submenu.height-transition>li
{
background-color: #fff !important;
}
.vertical-mega-menu ul.mm-submenu,
{
color: #34675c !important;
}
.vertical-mega-menu ul.mm-submenu>li.mm-hovering>a[onclick]:not([data-href='no-link'])
{
color: #34675c !important;
}
.vertical-mega-menu>.buddha-menu-item>.mm-submenu.height-transition>li>a>.toggle-menu-btn>.mm-cross {
background-color: #fff !important;
}
.vertical-mega-menu>.buddha-menu-item>.mm-submenu.height-transition>li>.mm-submenu.height-transition {
background-color: #fff !important;
}
.vertical-mega-menu>.buddha-menu-item>.mm-submenu.height-transition {
background-color: #fff !important;
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

[lollypoplane]

Hi Rahul_dhiman,

Thanks for helping but I can not see buddha-megamenu2.css in my assets?

Lollypoplane

[Rahul_dhiman]

Okay, so please search file  ---> Assets ---> component-mega-menu.css
and add the given  code in the end and save.

[lollypoplane · Accepted solution]

Hi Rahul_dhiman,

Perfect, thank you.

Lollypoplane

[Rahul_dhiman]

Thanks, please accept my solution and hit the like button.
also, if you can buy me a pizza for my work.
Thank you.

[Rahul_dhiman]

by mistake you have accepted your reply.
you need to accept my reply in which i sent you code.