Navbar: comments, menu links, collapse on mobile fixed.
This commit is contained in:
@@ -1,23 +1,33 @@
|
||||
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
||||
<!-- Brand and toggle get grouped for better mobile display -->
|
||||
|
||||
<!-- Brand and toggle get grouped for better mobile display -->
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
|
||||
|
||||
<!-- Button used to (un)collapse on mobile display. -->
|
||||
<button
|
||||
type="button"
|
||||
class="navbar-toggle"
|
||||
ng-init="collapsed = true"
|
||||
ng-click="collapsed = !collapsed"
|
||||
>
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a href="#" class="navbar-brand" data-toggle="dropdown">Xen Orchestra</a>
|
||||
|
||||
<!-- Brand name. -->
|
||||
<a class="navbar-brand" data-toggle="dropdown" href="#/">Xen Orchestra</a>
|
||||
</div>
|
||||
|
||||
<!-- Collect the nav links, forms, and other content for toggling -->
|
||||
<!-- All navbar items are collapsed on mobile display. -->
|
||||
<div class="collapse navbar-collapse" ng-class="!collapsed && 'in'">
|
||||
|
||||
<!-- Search form of the navbar. -->
|
||||
<form class="navbar-form navbar-left" role="search" style="width: 250px">
|
||||
<!-- Forced width due to issue with `input`s
|
||||
(https://github.com/twbs/bootstrap/issues/9950. -->
|
||||
|
||||
<div class="collapse navbar-collapse navbar-ex1-collapse">
|
||||
<!-- navbar forced width 250px, bootstrap issue with chrome browsers
|
||||
see https://github.com/twbs/bootstrap/issues/9950
|
||||
-->
|
||||
<form class="navbar-form navbar-left" role="search" style="width: 250px;">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control inverse" placeholder="">
|
||||
<span class="input-group-btn">
|
||||
@@ -25,25 +35,73 @@
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
<!-- /Search form. -->
|
||||
|
||||
<!-- Right items of the navbar. -->
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
|
||||
<!-- Main menu. -->
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle inverse" data-toggle="dropdown"><i class="fa fa-th"></i></a>
|
||||
<a class="dropdown-toggle inverse">
|
||||
<i class="fa fa-th"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu inverse">
|
||||
<li><a href="flat-view.html"><i class="fa fa-list"></i> Flat view</a></li>
|
||||
<li class="disabled"><a href="#"><i class="fa fa-sitemap"></i> Graphs view</a></li>
|
||||
<li>
|
||||
<a href="#/list">
|
||||
<i class="fa fa-list"></i>
|
||||
Flat view
|
||||
</a>
|
||||
</li>
|
||||
<li class="disabled">
|
||||
<a href="#/graph">
|
||||
<i class="fa fa-sitemap"></i>
|
||||
Graphs view
|
||||
</a>
|
||||
</li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="#"><i class="fa fa-plus-circle" style="color:#5cb85c"></i> Add server</a></li>
|
||||
<li class="disabled"><a href="#"><i class="fa fa-clock-o"></i> Scheduler</a></li>
|
||||
<li><a href="settings-view.html"><i class="fa fa-cog"></i> Settings</a></li>
|
||||
<li class="disabled">
|
||||
<a>
|
||||
<i class="fa fa-plus-circle" style="color:#5cb85c"></i>
|
||||
Add server
|
||||
</a>
|
||||
</li>
|
||||
<li class="disabled">
|
||||
<a>
|
||||
<i class="fa fa-clock-o"></i>
|
||||
Scheduler
|
||||
</a>
|
||||
</li>
|
||||
<li class="disabled">
|
||||
<a href="settings-view.html">
|
||||
<i class="fa fa-cog"></i>
|
||||
Settings
|
||||
</a>
|
||||
</li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="#"><i class="fa fa-info-circle" style="color:#5bc0de"></i> About</a></li>
|
||||
<li class="disabled">
|
||||
<a>
|
||||
<i class="fa fa-info-circle" style="color:#5bc0de"></i>
|
||||
About
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- /Main menu. -->
|
||||
|
||||
<!-- Displayed only when the user is connected. -->
|
||||
<li ng-if="!!user"><a><i class="fa fa-user"></i> {{user}}</a></li>
|
||||
<li ng-if="!!user"><a><i class="fa fa-sign-out"></i></a></li>
|
||||
<!-- /When user is connected. -->
|
||||
|
||||
<!-- Displayed only when the user is not connected. -->
|
||||
<li ng-if="!user"><a>@todo</a></li>
|
||||
<!-- /When user is not connected. -->
|
||||
|
||||
</ul>
|
||||
</div><!-- /.navbar-collapse -->
|
||||
<!-- /Right items. -->
|
||||
|
||||
</div>
|
||||
<!-- /Navbar items. -->
|
||||
|
||||
</nav>
|
||||
<!-- /Navbar. -->
|
||||
|
||||
Reference in New Issue
Block a user