You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
84 lines
9.6 KiB
84 lines
9.6 KiB
@rendermode InteractiveServer
|
|
|
|
<div class="navmenu">
|
|
<input type="checkbox" title="Menu expand/collapse toggle" id="navmenu-toggle" class="navmenu-icon" />
|
|
<label for="navmenu-toggle" class="navmenu-icon"><FluentIcon Value="@(new Icons.Regular.Size20.Navigation())" Color="Color.Fill" /></label>
|
|
<nav class="sitenav" aria-labelledby="main-menu">
|
|
<FluentMessageBarProvider Section="@App.MESSAGE_NAV_TOP" />
|
|
<FluentNavMenu Id="main-menu" Collapsible="true" Width="250" Title="Navigation menu" @bind-Expanded="expanded" CustomToggle="true">
|
|
<FluentNavLink Href="/" Match="NavLinkMatch.All" Icon="@(new Icons.Regular.Size20.Home())" IconColor="Color.Accent">Home</FluentNavLink>
|
|
<FluentNavGroup Icon="@(new Icons.Regular.Size20.Globe())" Expanded="false" Title="Original">
|
|
<FluentNavLink Href="counter" Icon="@(new Icons.Regular.Size20.NumberSymbolSquare())" IconColor="Color.Accent">Counter</FluentNavLink>
|
|
<FluentNavLink Href="weather" Icon="@(new Icons.Regular.Size20.WeatherPartlyCloudyDay())" IconColor="Color.Accent">Weather</FluentNavLink>
|
|
</FluentNavGroup>
|
|
<FluentNavGroup Icon="@(new Icons.Regular.Size20.SlideLayout())" Expanded="false" Title="Layout">
|
|
<FluentNavLink Href="layoutheader" Icon="@(new Icons.Regular.Size20.DocumentHeader())" IconColor="Color.Accent">Header</FluentNavLink>
|
|
<FluentNavLink Href="layoutfooter" Icon="@(new Icons.Regular.Size20.DocumentFooter())" IconColor="Color.Accent">Footer</FluentNavLink>
|
|
<FluentNavLink Href="layoutbodycontent" Icon="@(new Icons.Regular.Size20.ContentViewGallery())" IconColor="Color.Accent">BodyContent</FluentNavLink>
|
|
<FluentNavLink Href="layoutgrid" Icon="@(new Icons.Regular.Size20.Grid())" IconColor="Color.Accent">Grid</FluentNavLink>
|
|
<FluentNavLink Href="layoutlayout" Icon="@(new Icons.Regular.Size20.LayoutColumnOneThirdLeft())" IconColor="Color.Accent">Layout</FluentNavLink>
|
|
<FluentNavLink Href="layoutmainlayout" Icon="@(new Icons.Regular.Size20.LayoutColumnTwoSplitRight())" IconColor="Color.Accent">MainLayout</FluentNavLink>
|
|
<FluentNavLink Href="layoutspacer" Icon="@(new Icons.Regular.Size20.Spacebar())" IconColor="Color.Accent">Spacer</FluentNavLink>
|
|
<FluentNavLink Href="layoutsplitter" Icon="@(new Icons.Regular.Size20.SplitVertical())" IconColor="Color.Accent">Splitter</FluentNavLink>
|
|
<FluentNavLink Href="layoutstack" Icon="@(new Icons.Regular.Size20.Stack())" IconColor="Color.Accent">Stack</FluentNavLink>
|
|
</FluentNavGroup>
|
|
<FluentNavGroup Icon="@(new Icons.Regular.Size20.Form())" Expanded="false" Title="Form & Input">
|
|
<FluentNavLink Href="forminputoverview" Icon="@(new Icons.Regular.Size20.Eye())" IconColor="Color.Accent">Overview</FluentNavLink>
|
|
<FluentNavLink Href="forminputcheckbox" Icon="@(new Icons.Regular.Size20.CheckboxChecked())" IconColor="Color.Accent">Checkbox</FluentNavLink>
|
|
<FluentNavLink Href="forminputfile" Icon="@(new Icons.Regular.Size20.ArrowUpload())" IconColor="Color.Accent">InputFile</FluentNavLink>
|
|
<FluentNavGroup Icon="@(new Icons.Regular.Size20.List())" Expanded="false" Title="List">
|
|
<FluentNavLink Href="forminputcombobox" Icon="@(new Icons.Regular.Size20.BoxCheckmark())" IconColor="Color.Accent">Combobox</FluentNavLink>
|
|
<FluentNavLink Href="forminputlistbox" Icon="@(new Icons.Regular.Size20.List())" IconColor="Color.Accent">Listbox</FluentNavLink>
|
|
<FluentNavLink Href="forminputselect" Icon="@(new Icons.Regular.Size20.GroupList())" IconColor="Color.Accent">Select</FluentNavLink>
|
|
</FluentNavGroup>
|
|
<FluentNavLink Href="forminputnumberfield" Icon="@(new Icons.Regular.Size20.NumberSymbolSquare())" IconColor="Color.Accent">NumberField</FluentNavLink>
|
|
<FluentNavLink Href="forminputradio" Icon="@(new Icons.Regular.Size20.RadioButton())" IconColor="Color.Accent">Radio</FluentNavLink>
|
|
<FluentNavLink Href="forminputrating" Icon="@(new Icons.Regular.Size20.Star())" IconColor="Color.Accent">Rating</FluentNavLink>
|
|
<FluentNavLink Href="forminputsearch" Icon="@(new Icons.Regular.Size20.ScreenSearch())" IconColor="Color.Accent">Search</FluentNavLink>
|
|
<FluentNavLink Href="forminputslider" Icon="@(new Icons.Regular.Size20.Options())" IconColor="Color.Accent">Slider</FluentNavLink>
|
|
<FluentNavLink Href="forminputswitch" Icon="@(new Icons.Regular.Size20.ToggleLeft())" IconColor="Color.Accent">Switch</FluentNavLink>
|
|
<FluentNavLink Href="forminputtextarea" Icon="@(new Icons.Regular.Size20.EditLineHorizontal3())" IconColor="Color.Accent">TextArea</FluentNavLink>
|
|
<FluentNavLink Href="forminputtexfield" Icon="@(new Icons.Regular.Size20.ColorLine())" IconColor="Color.Accent">TextField</FluentNavLink>
|
|
<FluentNavLink Href="forminputcalendar" Icon="@(new Icons.Regular.Size20.CalendarDate())" IconColor="Color.Accent">Calendar</FluentNavLink>
|
|
<FluentNavLink Href="forminputdatetimepicker" Icon="@(new Icons.Regular.Size20.Clock())" IconColor="Color.Accent">Date & Time Picker</FluentNavLink>
|
|
</FluentNavGroup>
|
|
<FluentNavGroup Icon="@(new Icons.Regular.Size20.PuzzlePiece())" Expanded="false" Title="Components">
|
|
<FluentNavLink Href="compooverview" Icon="@(new Icons.Regular.Size20.Eye())" IconColor="Color.Accent">Overview</FluentNavLink>
|
|
<FluentNavLink Href="compoaccordion" Icon="@(new Icons.Regular.Size20.ListBar())" IconColor="Color.Accent">Accordion</FluentNavLink>
|
|
<FluentNavLink Href="compoanchor" Icon="@(new Icons.Regular.Size20.LinkMultiple())" IconColor="Color.Accent">Anchor</FluentNavLink>
|
|
<FluentNavLink Href="compoappbar" Icon="@(new Icons.Regular.Size20.AppsList())" IconColor="Color.Accent">AppBar</FluentNavLink>
|
|
<FluentNavGroup Icon="@(new Icons.Regular.Size20.Tag())" Expanded="false" Title="Badge">
|
|
<FluentNavLink Href="compobadge" Icon="@(new Icons.Regular.Size20.Badge())" IconColor="Color.Accent">Badge</FluentNavLink>
|
|
<FluentNavLink Href="compocounterbadge" Icon="@(new Icons.Regular.Size20.NumberCircle1())" IconColor="Color.Accent">CounterBadge</FluentNavLink>
|
|
<FluentNavLink Href="compopresencebadge" Icon="@(new Icons.Regular.Size20.CheckmarkCircle())" IconColor="Color.Accent">PresenceBadge</FluentNavLink>
|
|
</FluentNavGroup>
|
|
<FluentNavLink Href="compobreadcrumb" Icon="@(new Icons.Regular.Size20.FoodPizza())" IconColor="Color.Accent">Breadcrumb</FluentNavLink>
|
|
<FluentNavGroup Icon="@(new Icons.Regular.Size20.CursorHover())" Expanded="false" Title="Button">
|
|
<FluentNavLink Href="compobutton" Icon="@(new Icons.Regular.Size20.ControlButton())" IconColor="Color.Accent">Button</FluentNavLink>
|
|
<FluentNavLink Href="compomenubutton" Icon="@(new Icons.Regular.Size20.ControlButton())" IconColor="Color.Accent">MenuButton</FluentNavLink>
|
|
</FluentNavGroup>
|
|
<FluentNavLink Href="compocard" Icon="@(new Icons.Regular.Size20.CardUi())" IconColor="Color.Accent">Card</FluentNavLink>
|
|
<FluentNavLink Href="compodatagrid" Icon="@(new Icons.Regular.Size20.Grid())" IconColor="Color.Accent">DataGrid</FluentNavLink>
|
|
<FluentNavLink Href="compodialog" Icon="@(new Icons.Regular.Size20.AppTitle())" IconColor="Color.Accent">Dialog</FluentNavLink>
|
|
<FluentNavLink Href="compodivider" Icon="@(new Icons.Regular.Size20.DividerShort())" IconColor="Color.Accent">Divider</FluentNavLink>
|
|
<FluentNavLink Href="compodrag" Icon="@(new Icons.Regular.Size20.Drag())" IconColor="Color.Accent">Drag</FluentNavLink>
|
|
<FluentNavLink Href="compoemoji" Icon="@(new Icons.Regular.Size20.EmojiMeme())" IconColor="Color.Accent">Emoji</FluentNavLink>
|
|
<FluentNavLink Href="compoflipper" Icon="@(new Icons.Regular.Size20.LineHorizontal3())" IconColor="Color.Accent">Flipper</FluentNavLink>
|
|
<FluentNavLink Href="compohighlighter" Icon="@(new Icons.Regular.Size20.Highlight())" IconColor="Color.Accent">Highlighter</FluentNavLink>
|
|
<FluentNavLink Href="compohorizontalscroll" Icon="@(new Icons.Regular.Size20.AlignSpaceEvenlyHorizontal())" IconColor="Color.Accent">HorizontalScroll</FluentNavLink>
|
|
<FluentNavLink Href="compomenu" Icon="@(new Icons.Regular.Size20.ListBar())" IconColor="Color.Accent">Menu</FluentNavLink>
|
|
<FluentNavLink Href="compomessagebar" Icon="@(new Icons.Regular.Size20.WindowArrowUp())" IconColor="Color.Accent">MessageBar</FluentNavLink>
|
|
<FluentNavLink Href="compomessagebox" Icon="@(new Icons.Regular.Size20.BoxArrowUp())" IconColor="Color.Accent">MessageBox</FluentNavLink>
|
|
<FluentNavLink Href="compooverlay" Icon="@(new Icons.Regular.Size20.BoxArrowUp())" IconColor="Color.Accent">Overlay</FluentNavLink>
|
|
<FluentNavLink Href="compopersona" Icon="@(new Icons.Regular.Size20.PersonSearch())" IconColor="Color.Accent">Persona</FluentNavLink>
|
|
<FluentNavLink Href="compopopover" Icon="@(new Icons.Regular.Size20.TooltipQuote())" IconColor="Color.Accent">Popover</FluentNavLink>
|
|
<FluentNavLink Href="compotoast" Icon="@(new Icons.Regular.Size20.FoodToast())" IconColor="Color.Accent">Toast</FluentNavLink>
|
|
|
|
</FluentNavGroup>
|
|
</FluentNavMenu>
|
|
</nav>
|
|
</div>
|
|
|
|
@code {
|
|
private bool expanded = true;
|
|
}
|
|
|