code refactor

This commit is contained in:
MaysWind 2017-05-14 23:42:54 +08:00
parent 18baa83906
commit 79c323c50a
3 changed files with 79 additions and 39 deletions

View file

@ -242,36 +242,46 @@
</div>
<footer class="main-footer">
<a class="sidebar-toggle" data-toggle="offcanvas" role="button" title="{{'Toggle Navigation' | translate}}"></a>
<nav class="navbar" role="navigation">
<div class="navbar-toolbar">
<ul class="nav navbar-nav">
<li>
<a data-toggle="offcanvas" role="button" title="{{'Toggle Navigation' | translate}}">
<i class="fa fa-bars"></i>
</a>
</li>
<li class="divider"></li>
<li class="dropup">
<a class="dropdown-toggle" data-toggle="dropdown" role="button" title="{{'Quick Setting' | translate}}">
<i class="fa fa-wrench"></i>
<span translate>Quick Setting</span>
<i class="fa fa-caret-right fa-right-bottom fa-rotate-45 fa-half" aria-hidden="true"></i>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a class="pointer-cursor" ng-click="showQuickSettingDialog('globalSpeedLimit', 'Global Speed Limit')">
<span translate>Global Speed Limit</span>
</a>
</li>
</ul>
</li>
</ul>
</div>
<div class="toolbar dropup">
<a class="dropdown-toggle" data-toggle="dropdown" role="button" title="{{'Quick Setting' | translate}}">
<i class="fa fa-wrench"></i>
<span translate>Quick Setting</span>
<i class="fa fa-caret-right fa-right-bottom fa-rotate-45 fa-half" aria-hidden="true"></i>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a class="pointer-cursor" ng-click="showQuickSettingDialog('globalSpeedLimit', 'Global Speed Limit')">
<span translate>Global Speed Limit</span>
</a>
</li>
</ul>
</div>
<div class="pull-right ng-cloak" ng-if="globalStatusContext.isEnabled">
<a class="global-status" title="{{('Click to pin' | translate)}}" ng-pop-chart ng-data="globalStatusContext.data"
ng-container="body" ng-placement="top" ng-trigger="click hover" ng-popover-class="global-status-chart">
<div class="pull-right ng-cloak" ng-if="globalStatusContext.isEnabled">
<a class="global-status" title="{{('Click to pin' | translate)}}" ng-pop-chart ng-data="globalStatusContext.data"
ng-container="body" ng-placement="top" ng-trigger="click hover" ng-popover-class="global-status-chart">
<span class="realtime-speed">
<i class="icon-download fa fa-arrow-down"></i>
<span ng-bind="(globalStat.downloadSpeed | readableVolume) + '/s'"></span>
</span>
<span class="realtime-speed">
<span class="realtime-speed">
<i class="icon-upload fa fa-arrow-up"></i>
<span ng-bind="(globalStat.uploadSpeed | readableVolume) + '/s'"></span>
</span>
</a>
</div>
</a>
</div>
</nav>
</footer>
<ng-setting-dialog setting="quickSettingContext"></ng-setting-dialog>

View file

@ -69,8 +69,27 @@ td {
overflow-y: scroll;
}
.main-footer .toolbar {
.main-footer > .navbar {
margin-bottom: 0;
min-height: inherit;
}
.main-footer > .navbar > .navbar-toolbar > .nav {
float: left;
margin: 0;
}
.main-footer > .navbar > .navbar-toolbar > .nav > li {
display: inline-block;
float: left;
}
.main-footer > .navbar > .navbar-toolbar > .nav > li > a {
padding: 0 10px 0 10px;
}
.main-footer > .navbar > .navbar-toolbar > .nav > li:first-child > a {
padding-left: 0;
}
.dropdown-menu.right-align {
@ -103,6 +122,11 @@ td {
border: 1px solid #eee;
background-color: #fff;
}
.main-footer > .navbar > .navbar-toolbar > .nav > li > a {
padding-left: 8px;
padding-right: 8px;
}
}
/* toolbar */

View file

@ -40,14 +40,6 @@
top: 15px;
}
.skin-aria-ng .main-header .navbar .sidebar-toggle, .skin-aria-ng .main-footer .sidebar-toggle, .skin-aria-ng .main-footer .toolbar > a {
color: #707070;
}
.skin-aria-ng .main-header .navbar .sidebar-toggle:hover, .skin-aria-ng .main-footer .sidebar-toggle:hover, .skin-aria-ng .main-footer .toolbar > a:hover, .skin-aria-ng .main-footer .toolbar.open > a {
color: #0080ff;
}
.skin-aria-ng .main-header .navbar .navbar-searchbar .form-control-icon {
color: #999999;
}
@ -210,16 +202,30 @@
font-size: 12px;
}
.skin-aria-ng .main-footer .sidebar-toggle {
float: left;
background-color: transparent;
background-image: none;
padding: 0 15px 0 0;
font-family: fontAwesome;
.skin-aria-ng .main-footer > .navbar {
border: 0;
}
.skin-aria-ng .main-footer .sidebar-toggle:before {
content: "\f0c9";
.skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li.divider {
padding-top: 16px;
margin-left: 4px;
margin-right: 4px;
border-right: 1px solid #ccc;
position: relative;
top: 0;
}
.skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li > a {
color: #707070;
line-height: 17px;
}
.skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li > a:hover,
.skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li > a:active,
.skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li > a:focus,
.skin-aria-ng .main-footer > .navbar > .navbar-toolbar > .nav > li.open > a {
color: #0080ff;
background: none;
}
.skin-aria-ng .global-status {