Burger menu styling - backgrounds

[Tomica]

I have attached two views of a standard menu with default Metro Touch skin and mobile rendering mode.

When activated, I am happy to see that there is a transparent effect which blends very well with my page element.

When closed, I would like to get rid of the gray background, leaving just the black slices.

[Magdalena]

Hello Thomas,

Thank you for contacting Telerik support.

Applying the following CSS you will achieve transparent background to the RadMenu in mobile render mode:

html .RadMenu_MetroTouch .rmRootToggle {
    border: 0;
    background: transparent;
    box-shadow: none;
}

If you would like to set different effect to the expanded menu, you can achieved it by the selector "html .RadMenu_MetroTouch .rmRootToggle:active, html.RadMenu_MetroTouch .rmRootToggle.rmExpanded"

Do not hesitate to contact us if you have other questions.

Regards,
Magdalena
Telerik

 

 

[Tomica]

This code solves my requirement.

I also note that my comment on apparent transparency for expanded mobile rendering was not quite accurate. The skin provides the blue, for which I matched the background a few months ago, and promptly forgot.