1
0

Install MudBlazor and add button with snackbar for testing.

This commit is contained in:
Kevin Matsubara 2025-07-05 22:11:59 +02:00
parent 0f953961ad
commit b31c0ceed5
6 changed files with 47 additions and 2 deletions

View File

@ -9,12 +9,15 @@
<link rel="stylesheet" href="@Assets["IR.Blazor.styles.css"]" />
<ImportMap />
<link rel="icon" type="image/png" href="favicon.png" />
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
<link href="@Assets["_content/MudBlazor/MudBlazor.min.css"]" rel="stylesheet" />
<HeadOutlet @rendermode="InteractiveServer"/>
</head>
<body>
<Routes @rendermode="InteractiveServer"/>
<script src="_framework/blazor.web.js"></script>
<script src="@Assets["_content/MudBlazor/MudBlazor.min.js"]"></script>
</body>
</html>

View File

@ -1,5 +1,15 @@
@inherits LayoutComponentBase
@* Required *@
<MudThemeProvider />
<MudPopoverProvider />
@* Needed for dialogs *@
<MudDialogProvider />
@* Needed for snackbars *@
<MudSnackbarProvider />
<div class="page">
<div class="sidebar">
<NavMenu />

View File

@ -1,7 +1,18 @@
@page "/"
@inject ISnackbar Snackbar
<PageTitle>Home</PageTitle>
<h1>Hello, world!</h1>
<MudButton @onclick="@AddSnackbar" Color="Color.Primary" Variant="Variant.Filled">Test button</MudButton>
Welcome to your new app.
<MudButton @onclick="@(() => Snackbar.Add("My Close button is gone!", Severity.Normal, config => { config.ShowCloseIcon = false; }))" Variant="Variant.Filled" Color="Color.Primary">
Open modified snackbar
</MudButton>
@code {
private void AddSnackbar()
{
Snackbar.Add("Welcome to Imperial Recruitment.", Severity.Info);
}
}

View File

@ -7,5 +7,8 @@
@using static Microsoft.AspNetCore.Components.Web.RenderMode
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.JSInterop
@using MudBlazor
@using IR.Blazor
@using IR.Blazor.Components

View File

@ -16,6 +16,7 @@
<PackageReference Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="9.0.6" />
<PackageReference Include="Microsoft.EntityFrameworkCore.Sqlite" Version="9.0.6" />
<PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="9.0.6" />
<PackageReference Include="MudBlazor" Version="8.9.0" />
</ItemGroup>
<ItemGroup>

View File

@ -1,12 +1,29 @@
using Microsoft.AspNetCore.Components.Authorization;
using Microsoft.AspNetCore.Identity;
using Microsoft.EntityFrameworkCore;
using MudBlazor;
using MudBlazor.Services;
using IR.Blazor.Components;
using IR.Blazor.Components.Account;
using IR.Blazor.Data;
var builder = WebApplication.CreateBuilder(args);
builder.Services.AddMudServices(config =>
{
config.SnackbarConfiguration.PositionClass = Defaults.Classes.Position.TopCenter;
config.SnackbarConfiguration.PreventDuplicates = false;
config.SnackbarConfiguration.NewestOnTop = false;
config.SnackbarConfiguration.ShowCloseIcon = true;
config.SnackbarConfiguration.VisibleStateDuration = 8000;
config.SnackbarConfiguration.HideTransitionDuration = 400;
config.SnackbarConfiguration.ShowTransitionDuration = 300;
config.SnackbarConfiguration.SnackbarVariant = Variant.Filled;
});
// Add services to the container.
builder.Services.AddRazorComponents()
.AddInteractiveServerComponents();