I am using mudblazor 6.10.0. I have a MudDataGrid and everything works fine but the column headings are not bold like in the samples. I have the grid defined as follows
<MudDataGrid T="Range" MultiSelection="true" FilterCaseSensitivity="DataGridFilterCaseSensitivity.CaseInsensitive" Items="@_carRanges" SortMode="SortMode.Multiple" Dense ="true"
QuickFilter="@QuickFilter" ColumnResizeMode="@(ResizeMode.Column)" DragDropColumnReordering="true" Striped="true" FilterMode="DataGridFilterMode.ColumnFilterRow">
<ToolBarContent>
<MudTooltip Text="Add Range">
<MudFab id="Add-CarRange" Color="Color.Tertiary" Size="Size.Medium" StartIcon="@Icons.Material.Filled.Add" Href="feerangesave/0" />
</MudTooltip>
<MudTextField @bind-Value="SearchString" Placeholder="Search" Adornment="Adornment.Start" Immediate="true"
AdornmentIcon="@Icons.Material.Filled.Search" IconSize="Size.Medium" Class="mt-0"></MudTextField>
</ToolBarContent>
<Columns>
<PropertyColumn Property="x => x.Name" Title="name" Resizable="true" Filterable="true" />
<PropertyColumn Property="x => x.MinRange" Title="Min Range" Resizable="true" Filterable="true" Format="N0" CellStyle="text-align: right"/>
<PropertyColumn Property="x => x.MaxRange" Title="Max Range" Resizable="true" Filterable="true" Format="N0" CellStyle="text-align: right"/>
</Columns>
</MudDataGrid>
In the MainLayout.cs i have the following
<MudDialogProvider/>
<MudThemeProvider />
<MudLayout>
<MudAppBar Elevation="1" Dense="true" Color="MudBlazor.Color.Info">
<MudIconButton Icon="@Icons.Material.Filled.Menu" Edge="Edge.Start" OnClick="@ToggleDrawer" />
<MudSpacer />
<MudText Typo="Typo.h5" Color="MudBlazor.Color.Default" Style="color: white;">@Heading</MudText>
</MudAppBar>
<MudDrawer @bind-Open="@_menuOpen" ClipMode="_clipMode" Elevation="1" Variant="@DrawerVariant.Responsive">
<NavMenu />
</MudDrawer>
<MudMainContent>
<CustomErrorBoundary>
<div class="content px-4">
@Body
</div>
</CustomErrorBoundary>
</MudMainContent>
</MudLayout>
You can always add styles to it manually with the PropertyColumn.HeaderStyle
property.
i.e.
<PropertyColumn Title="MyPos" HeaderStyle="font-weight:900;font-size:2rem;" Property="x => x.Position" />
Although, as @maciek mentions in the comments, you should try to find what's overriding your style first.
In my case, it was because I had override the Default font with my own font. It appears that setting your own Default font, overrides all styles in the data grid.
To fix this, I set my custom fonts for each style (H1, H2, Body1, Body2 etc) and left the default alone.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With