radzenhq / radzen-blazor

Radzen Blazor is a set of 90+ free native Blazor UI components packed with DataGrid, Scheduler, Charts and robust theming including Material design and FluentUI.
https://www.radzen.com
MIT License
3.52k stars 785 forks source link

Set RadzenPanelMenuItem background color #1055

Closed Andrey-2021 closed 1 year ago

Andrey-2021 commented 1 year ago

Please add variable --radzen-panel-menu-item-background-color that can set background color of parent (whare i set background color) and all childs = RadzenPanelMenuItems

How now i can set all childs background-color?

Thanks.

yordanov commented 1 year ago

Hey @Andrey-2021, Can you elaborate on that or show screenshots? It is not that clear what are you trying to achieve.

Andrey-2021 commented 1 year ago

image

Andrey-2021 commented 1 year ago

image

yordanov commented 1 year ago

You can use the --rz-panel-menu-item-background-color CSS variable via style:

<RadzenPanelMenuItem Text="General" Icon="home" style="background-color: lightgreen;">
    <RadzenPanelMenuItem Text="Buttons" Icon="account_circle" style="--rz-panel-menu-item-background-color: lightgreen;"></RadzenPanelMenuItem>
</RadzenPanelMenuItem>

or css class:

<RadzenPanelMenuItem Text="General" Icon="home" style="background-color: lightgreen;">
    <RadzenPanelMenuItem Text="Buttons" Icon="account_circle" Class="light-green-item"></RadzenPanelMenuItem>
</RadzenPanelMenuItem>

<style>
    .light-green-item {
        --rz-panel-menu-item-background-color: lightgreen;
    }
</style>
image

Here is the list of all PanelMenu CSS variables:

https://github.com/radzenhq/radzen-blazor/blob/fcbbd53dd89d1e11915fb03689f350117a7cd445/Radzen.Blazor/themes/components/blazor/_panel-menu.scss#L54-L102