Add simple NavMenu to StandaloneApp
This commit is contained in:
parent
11bb8eaa6d
commit
96c6d959c0
|
|
@ -1,2 +1,4 @@
|
|||
@(Layout<StandaloneApp.Shared.MainLayout>())
|
||||
<h1>Hello, world!</h1>
|
||||
|
||||
Welcome to your new app.
|
||||
|
|
@ -1,10 +1,16 @@
|
|||
@using Microsoft.AspNetCore.Blazor.RenderTree
|
||||
@(Implements<Microsoft.AspNetCore.Blazor.Layouts.ILayoutComponent>())
|
||||
|
||||
<fieldset>
|
||||
<legend>Layout</legend>
|
||||
@Body
|
||||
</fieldset>
|
||||
<div class='container-fluid'>
|
||||
<div class='row'>
|
||||
<div class='col-sm-3'>
|
||||
<c:NavMenu />
|
||||
</div>
|
||||
<div class='col-sm-9'>
|
||||
@Body
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@functions {
|
||||
public RenderFragment Body { get; set; }
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
<div class='main-nav'>
|
||||
<div class='navbar navbar-inverse'>
|
||||
<div class='navbar-header'>
|
||||
<button type='button' class='navbar-toggle' data-toggle='collapse' data-target='.navbar-collapse'>
|
||||
<span class='sr-only'>Toggle navigation</span>
|
||||
<span class='icon-bar'></span>
|
||||
<span class='icon-bar'></span>
|
||||
<span class='icon-bar'></span>
|
||||
</button>
|
||||
<a class='navbar-brand' href='/'>Blazor app</a>
|
||||
</div>
|
||||
<div class='clearfix'></div>
|
||||
<div class='navbar-collapse collapse'>
|
||||
<ul class='nav navbar-nav'>
|
||||
<li>
|
||||
<a class='active' href='#'>
|
||||
<span class='glyphicon glyphicon-home'></span> Home
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,6 +1,4 @@
|
|||
body {
|
||||
}
|
||||
.main-nav li .glyphicon {
|
||||
.main-nav li .glyphicon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue