CODEWITHSUNDEEP
asp.net-coreblazormudblazor
Aaron Sharon
Aaron Sharon

Reputation: 13

How do I make a Text Bold in the Mudblazor?

I am working with MudBlazor and I’ve noticed that it has many frontend classes, such as Typo and Align. I want to make text bold without using any external CSS or the <b> tag. For example, I have the following code: <MudText Typo="Typo.h1" Align="Align.Start">Welcome Back</MudText>.

How can I achieve that? Thank you!

I want it to be bold.

Upvotes: 1

Views: 86

Answers (1)

Qiang Fu
Qiang Fu

Reputation: 8811

<b>is the official documented way so no other built-in class. Or you could just do inline style

<MudText Typo="Typo.h1" Align="Align.Start" Style="font-weight:bold">Welcome Back</MudText>

Or you could override the default "h1" typo in MudThemeProvider. By creating mud blazor template you should have following code in MainLayout.razor

<MudThemeProvider Theme="@_theme" IsDarkMode="_isDarkMode" />

At below code you could override h1 like this

    private MudTheme? _theme = null;

    protected override void OnInitialized()
    {
        base.OnInitialized();
        _theme = new()
        {
            PaletteLight = _lightPalette,
            PaletteDark = _darkPalette,
            LayoutProperties = new LayoutProperties(),
            Typography = new Typography()
            {
                H1 = new H1()
                {                                 
                    FontWeight = 900
                },

            }
        };
    }

Then all the Typo.h1 will be bold without other configuration.

Upvotes: 0

Related Questions