A simple ASP.NET / NPM library pair to automate the production of the left hand menu.
This has probably been done elsewhere and more than likely better, but you don't learn unless you try.
There are two packages included in this project:
This impemtation uses a cookie to track whether the menu is open or closed.
You need to configure which controller methods will be displayed in the menu, and then call the menu in the HTML.
The valid list of decorations are:
- Display - Display the method as a menu item, default = True
- Order - Order of item on menu Display
- Name - Display name
- Icon - Icon, default = fas-circle
- Route - Route, default = Home
- ClassNavItem - Class of Nav Item
- ClassNavLink - Class on Nav Link
- IconGroup - Icon group, default = fas
- Parent - Parent nav item, default = None
Simply add decoarations to your Control. The minimum decoration you needs is the Name
[MenuLibrary.MenuAttributes(Name = "Documentation", Icon = "fa-book" , Order = 50 )]
public IActionResult Docs()
{
return Redirect("https://sfawcett123.github.io/FlightSimulator/");
}
To include in your layouts page, you simply need to call the LeftMenu Method
@using MenuLibrary
<script src="~/lib/menulibrary/dist/js/menu.js"></script>
<link href="~/lib/menulibrary/dist/css/menu.css" rel="stylesheet" />
<body id=@Menu.BODY_ID>
<header class="header" id="header">
<div class="navbar_left header_toggle">
<a class="navbar_brand">Demo</a>
</div>
</header>
@Html.Raw( LeftMenu.Display( Menu.GetSubClasses<Controller>()) )
<!--Container Main start-->
<div class="content">
Something interesting
<!--Container Main end-->
</div