MudTreeView - How to change checkbox size and color?

Viewed 535

I'm using a CSS framework for Blazor WebAssembly called Mudblazor. Link to mudblazor

I can not figure out how to set the size and color of the checkbox in MudTreeView.

<MudTreeViewItem  Value="@item.CategoryName" Class="mud-treeview-item-content.mud-treeview-item-activated" Selected="item.IsChecked" SelectedChanged="eventArgs => {  CheckboxClicked(item.CategoryId, eventArgs); }" >

In Mudblazor using MudCheckBox, you can set size by adding Size = "Size.Large" and color: Color="Color.Primary" but I do not get it in MudTreeView.

Is there any way to make it work?

1 Answers

As a workaround you could add a class to the MudTreeViewItem elements that you want to style the checkbox of:

<MudTreeViewItem Value='"Name"' Class="custom-treeview-item"/>

Then you can use this class to target the checkbox in your css:

.custom-treeview-item .mud-checkbox span {
    color: var(--mud-palette-primary);
}

.custom-treeview-item .mud-checkbox svg {
    font-size: 2.25rem;
}
Related