Convert Blazor.ExampleConsumer sample app to MudBlazor#66
Draft
Convert Blazor.ExampleConsumer sample app to MudBlazor#66
Conversation
Co-authored-by: IEvangelist <7679720+IEvangelist@users.noreply.github.com>
IEvangelist
reviewed
Jul 16, 2025
|
|
||
| <PropertyGroup> | ||
| <TargetFramework>net9.0</TargetFramework> | ||
| <TargetFramework>net8.0</TargetFramework> |
Co-authored-by: IEvangelist <7679720+IEvangelist@users.noreply.github.com>
IEvangelist
reviewed
Jul 16, 2025
| <PackageReference Include="Humanizer.Core" /> | ||
| <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" /> | ||
| <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" PrivateAssets="all" /> | ||
| <PackageReference Include="MudBlazor" Version="7.8.0" /> |
Owner
There was a problem hiding this comment.
I'm using CPM, see the Directory.Packages.props.
Author
There was a problem hiding this comment.
Fixed - removed explicit MudBlazor version from csproj and added it to Directory.Packages.props for Central Package Management in commit 1480fdd.
Co-authored-by: IEvangelist <7679720+IEvangelist@users.noreply.github.com>
Co-authored-by: IEvangelist <7679720+IEvangelist@users.noreply.github.com>
Copilot
AI
changed the title
[WIP] Convert the example app to MudBlazor
Convert Blazor.ExampleConsumer sample app to MudBlazor
Jul 16, 2025
Co-authored-by: IEvangelist <7679720+IEvangelist@users.noreply.github.com>
IEvangelist
reviewed
Jul 16, 2025
Directory.Packages.props
Outdated
| <PackageVersion Include="coverlet.collector" Version="6.0.2" /> | ||
| <PackageVersion Include="Basic.Reference.Assemblies" Version="1.7.9" /> | ||
| <PackageVersion Include="Humanizer.Core" Version="2.14.1" /> | ||
| <PackageVersion Include="MudBlazor" Version="7.8.0" /> |
Owner
There was a problem hiding this comment.
Please use the latest version, 8.9.0.
Suggested change
| <PackageVersion Include="MudBlazor" Version="7.8.0" /> | |
| <PackageVersion Include="MudBlazor" Version="8.9.0" /> |
Author
There was a problem hiding this comment.
Updated MudBlazor to version 8.9.0 as requested in commit 0772f58.
Co-authored-by: IEvangelist <7679720+IEvangelist@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This PR completely converts the
samples/Blazor.ExampleConsumerapp from Bootstrap styling to modern MudBlazor components with Material Design.Changes Made
Core Setup
Program.csto configure MudBlazor servicesindex.html_Imports.razorto include MudBlazor namespaceLayout Conversion
MudLayoutwithMudAppBar,MudDrawer, and responsive designMudNavMenuandMudNavLinkcomponents using Material Design iconsPage Conversions
MudText)MudCard,MudTextField,MudButton,MudCheckBox,MudList, andMudTableMudProgressCircular,MudChip, and proper layoutMudSelect,MudSlider,MudTextField, andMudButtonGroupMudTextFieldand dynamic button stylingShared Components
MudAlertwith proper stylingMudCheckBoxcomponentMudCardandMudPaperfor better code displayKey Improvements
✨ Modern Material Design - Clean, accessible, and responsive UI
🎨 Consistent Typography - Proper heading hierarchy and spacing
📱 Responsive Layout - Collapsible drawer navigation
🔧 Enhanced Form Controls - Better UX with floating labels and validation
📊 Improved Data Display - Cards, tables, and expansion panels
⚡ Loading States - Progress indicators and spinners
🎯 Material Icons - Replaced Open Iconic with Material Design icons
Before/After
The app now features a modern Material Design interface while maintaining all original functionality. The conversion provides better accessibility, responsive design, and a more professional appearance.
All demo pages showcase the various Blazorators packages with enhanced visual presentation and improved user experience.
Fixes #65.
💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.