[dev-v5][Nav] Part 2 - Use the FluentNav in the demo site#4420
Merged
[dev-v5][Nav] Part 2 - Use the FluentNav in the demo site#4420
Conversation
Contributor
There was a problem hiding this comment.
Pull request overview
This PR integrates the FluentNav component into the demo site, replacing the previous navigation implementation. It adds icons to navigation items, updates route URLs for consistency (e.g., /Button/ to /Buttons/, /List/ to /Lists/, /theme/ to /Theme/), and changes project target frameworks from singular to plural form.
- Implements new
DemoNavcomponent with associated CSS and code-behind - Updates navigation layout with new width (262px) and styling
- Standardizes route naming conventions across documentation files
- Adds icon properties to component documentation frontmatter
Reviewed changes
Copilot reviewed 77 out of 77 changed files in this pull request and generated 12 comments.
Show a summary per file
| File | Description |
|---|---|
| FluentUI.Demo/FluentUI.Demo.csproj | Changed TargetFramework to TargetFrameworks (plural) |
| FluentUI.Demo.Client/FluentUI.Demo.Client.csproj | Changed TargetFramework to TargetFrameworks (plural) |
| DemoNav.razor.cs | New code-behind file with navigation item generation logic |
| DemoNav.razor | New component markup using FluentNav components |
| DemoNav.razor.css | New CSS styles for navigation list elements |
| DemoMainLayout.razor | Updated to use DemoNav instead of DemoNavMenu with adjusted width/padding |
| Home.md | Added hidden property and simplified icon reference |
| Multiple component .md files | Added icon properties to frontmatter and updated routes for consistency |
| Buttons/*.md | Updated routes from /Button/ to /Buttons/ |
| List/*.md | Updated routes from /List/ to /Lists/ and added Lists.md overview |
| Theme/*.md | Updated routes from /theme/ to /Theme/ and added Themes.md overview |
| Nav/FluentNav.md | New documentation file for Nav component with example |
| Nav/Examples/NavDefault.razor | New example component demonstrating Nav usage |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
examples/Demo/FluentUI.Demo.Client/Documentation/Components/Stack/FluentStack.md
Outdated
Show resolved
Hide resolved
examples/Demo/FluentUI.Demo.Client/Documentation/Components/List/Lists.md
Outdated
Show resolved
Hide resolved
examples/Demo/FluentUI.Demo.Client/Documentation/GetStarted/Localization.md
Show resolved
Hide resolved
examples/Demo/FluentUI.Demo.Client/Documentation/Components/Counter/CounterPage.md
Show resolved
Hide resolved
examples/Demo/FluentUI.Demo.Client/Documentation/GetStarted/MigrationVersion5.md
Show resolved
Hide resolved
examples/Demo/FluentUI.Demo.Client/Documentation/Components/Nav/Examples/NavDefault.razor
Outdated
Show resolved
Hide resolved
examples/Demo/FluentUI.Demo.Client/Documentation/Components/Nav/Examples/NavDefault.razor
Outdated
Show resolved
Hide resolved
|
✅ All tests passed successfully Details on your Workflow / Core Tests page. |
Summary - Unit Tests Code CoverageSummary
CoverageMicrosoft.FluentUI.AspNetCore.Components - 98.8%
|
dvoituron
requested changes
Dec 30, 2025
- Remove TreeView based navigation
dvoituron
approved these changes
Dec 30, 2025
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.
Result:

Collapsed Buttons category where a sub item is active:
