modify style

This commit is contained in:
MaysWind 2016-06-29 23:22:42 +08:00
parent 3090b587fd
commit 754580db42
4 changed files with 75 additions and 27 deletions

View file

@ -151,13 +151,13 @@
<ul id="siderbar-menu" class="sidebar-menu"> <ul id="siderbar-menu" class="sidebar-menu">
<li class="header" translate>Download</li> <li class="header" translate>Download</li>
<li data-href-match="/downloading"> <li data-href-match="/downloading">
<a href="#/downloading"><i class="fa fa-arrow-down"></i> <span ng-bind="('Downloading' | translate) + (globalStat && globalStat.numActive > 0 ? ' (' + globalStat.numActive + ')' : '')">Downloading</span></a> <a href="#/downloading"><i class="fa fa-arrow-circle-o-down"></i> <span ng-bind="('Downloading' | translate) + (globalStat && globalStat.numActive > 0 ? ' (' + globalStat.numActive + ')' : '')">Downloading</span></a>
</li> </li>
<li data-href-match="/waiting"> <li data-href-match="/waiting">
<a href="#/waiting"><i class="fa fa-hourglass-half"></i> <span ng-bind="('Waiting' | translate) + (globalStat && globalStat.numWaiting > 0 ? ' (' + globalStat.numWaiting + ')' : '')">Scheduling</span></a> <a href="#/waiting"><i class="fa fa-clock-o"></i> <span ng-bind="('Waiting' | translate) + (globalStat && globalStat.numWaiting > 0 ? ' (' + globalStat.numWaiting + ')' : '')">Scheduling</span></a>
</li> </li>
<li data-href-match="/stopped"> <li data-href-match="/stopped">
<a href="#/stopped"><i class="fa fa-stop-circle-o"></i> <span ng-bind="('Downloaded / Stopped' | translate) + (globalStat && globalStat.numStopped > 0 ? ' (' + globalStat.numStopped + ')' : '')">Downloaded / Stopped</span></a> <a href="#/stopped"><i class="fa fa-check-circle-o"></i> <span ng-bind="('Downloaded / Stopped' | translate) + (globalStat && globalStat.numStopped > 0 ? ' (' + globalStat.numStopped + ')' : '')">Downloaded / Stopped</span></a>
</li> </li>
<li class="header" translate>Settings</li> <li class="header" translate>Settings</li>
<li data-href-match="/settings/ariang"> <li data-href-match="/settings/ariang">
@ -171,28 +171,28 @@
</a> </a>
<ul class="treeview-menu"> <ul class="treeview-menu">
<li data-href-match="/settings/aria2/basic"> <li data-href-match="/settings/aria2/basic">
<a href="#/settings/aria2/basic"><i class="fa fa-circle-o"></i> <span translate>Basic Settings</span></a> <a href="#/settings/aria2/basic"> <span translate>Basic Settings</span></a>
</li> </li>
<li data-href-match="/settings/aria2/http-ftp-sftp"> <li data-href-match="/settings/aria2/http-ftp-sftp">
<a href="#/settings/aria2/http-ftp-sftp"><i class="fa fa-circle-o"></i> <span translate>HTTP/FTP/SFTP Settings</span></a> <a href="#/settings/aria2/http-ftp-sftp"> <span translate>HTTP/FTP/SFTP Settings</span></a>
</li> </li>
<li data-href-match="/settings/aria2/http"> <li data-href-match="/settings/aria2/http">
<a href="#/settings/aria2/http"><i class="fa fa-circle-o"></i> <span translate>HTTP Settings</span></a> <a href="#/settings/aria2/http"> <span translate>HTTP Settings</span></a>
</li> </li>
<li data-href-match="/settings/aria2/ftp-sftp"> <li data-href-match="/settings/aria2/ftp-sftp">
<a href="#/settings/aria2/ftp-sftp"><i class="fa fa-circle-o"></i> <span translate>FTP/SFTP Settings</span></a> <a href="#/settings/aria2/ftp-sftp"> <span translate>FTP/SFTP Settings</span></a>
</li> </li>
<li data-href-match="/settings/aria2/bt"> <li data-href-match="/settings/aria2/bt">
<a href="#/settings/aria2/bt"><i class="fa fa-circle-o"></i> <span translate>BitTorrent Settings</span></a> <a href="#/settings/aria2/bt"> <span translate>BitTorrent Settings</span></a>
</li> </li>
<li data-href-match="/settings/aria2/metalink"> <li data-href-match="/settings/aria2/metalink">
<a href="#/settings/aria2/metalink"><i class="fa fa-circle-o"></i> <span translate>Metalink Settings</span></a> <a href="#/settings/aria2/metalink"> <span translate>Metalink Settings</span></a>
</li> </li>
<li data-href-match="/settings/aria2/rpc"> <li data-href-match="/settings/aria2/rpc">
<a href="#/settings/aria2/rpc"><i class="fa fa-circle-o"></i> <span translate>RPC Settings</span></a> <a href="#/settings/aria2/rpc"> <span translate>RPC Settings</span></a>
</li> </li>
<li data-href-match="/settings/aria2/advanced"> <li data-href-match="/settings/aria2/advanced">
<a href="#/settings/aria2/advanced"><i class="fa fa-circle-o"></i> <span translate>Advanced Settings</span></a> <a href="#/settings/aria2/advanced"> <span translate>Advanced Settings</span></a>
</li> </li>
</ul> </ul>
</li> </li>
@ -272,6 +272,7 @@
<!-- endbuild --> <!-- endbuild -->
<!-- build:js js/aria-ng.min.js --> <!-- build:js js/aria-ng.min.js -->
<script src="scripts/core/__core.js"></script> <script src="scripts/core/__core.js"></script>
<script src="scripts/core/__config.js"></script>
<script src="scripts/core/__fix.js"></script> <script src="scripts/core/__fix.js"></script>
<script src="scripts/core/app.js"></script> <script src="scripts/core/app.js"></script>
<script src="scripts/core/router.js"></script> <script src="scripts/core/router.js"></script>

View file

@ -0,0 +1,6 @@
(function () {
'use strict';
//override AdminLTE options
$.AdminLTE.options.animationSpeed = 300;
})();

View file

@ -22,6 +22,18 @@
return false; return false;
}; };
var initNavbar = function () {
angular.element('section.sidebar > ul > li[data-href-match] > a').click(function () {
angular.element('section.sidebar > ul li').removeClass('active');
angular.element(this).parent().addClass('active');
});
angular.element('section.sidebar > ul > li.treeview > ul.treeview-menu > li[data-href-match] > a').click(function () {
angular.element('section.sidebar > ul li').removeClass('active');
angular.element(this).parent().addClass('active').parent().parent().addClass('active');
});
};
var setNavbarSelected = function (location) { var setNavbarSelected = function (location) {
angular.element('section.sidebar > ul li').removeClass('active'); angular.element('section.sidebar > ul li').removeClass('active');
angular.element('section.sidebar > ul > li[data-href-match]').each(function (index, element) { angular.element('section.sidebar > ul > li[data-href-match]').each(function (index, element) {
@ -179,5 +191,7 @@
setNavbarSelected(location); setNavbarSelected(location);
$document.unbind('keypress'); $document.unbind('keypress');
}); });
initNavbar();
}]); }]);
})(); })();

View file

@ -238,14 +238,18 @@ td {
.skin-aria-ng .sidebar-menu > li.header { .skin-aria-ng .sidebar-menu > li.header {
color: #707070; color: #707070;
background-color: #2e343c; background-color: #2e343c;
padding-top: 3px;
padding-bottom: 3px;
} }
.skin-aria-ng .sidebar-menu > li > a { .skin-aria-ng .sidebar-menu > li > a {
border-left: 3px solid transparent; border-left: 3px solid transparent;
padding-top: 9px;
padding-bottom: 9px;
} }
.skin-aria-ng .sidebar-menu > li:hover > a { .skin-aria-ng .sidebar-menu > li:hover > a {
color: #f8f8f8; color: #dfdfdf;
background-color: #313a42; background-color: #313a42;
} }
@ -254,9 +258,44 @@ td {
background-color: #252c30; background-color: #252c30;
} }
.skin-aria-ng .sidebar-menu > li > .treeview-menu { .skin-aria-ng .sidebar-menu > li.treeview:hover > a {
margin: 0 1px; color: #a2b5b9;
background-color: #2a343b; background-color: #3c4852;
}
.skin-aria-ng .sidebar-menu > li.treeview.active > a, .skin-aria-ng .sidebar-menu > li.treeview.active:hover > a {
color: #5399e8;
background-color: #3c4852;
}
.skin-aria-ng .sidebar-menu > li.treeview > a:hover {
color: #dfdfdf;
background-color: #313a42;
}
.skin-aria-ng .sidebar-menu > li.treeview > ul.treeview-menu {
margin: 0;
padding: 0;
background-color: #3c4852;
}
.skin-aria-ng .sidebar-menu > li.treeview > ul.treeview-menu > li > a {
color: #8aa4af;
padding: 6px 5px 6px 41px;
}
.skin-aria-ng .sidebar-menu > li.treeview > ul.treeview-menu > li > a:hover {
color: #dfdfdf;
background-color: #313a42;
}
.skin-aria-ng .sidebar-menu > li.treeview > ul.treeview-menu > li.active > a {
color: #5399e8;
background-color: #252c30;
}
.skin-aria-ng .sidebar-menu i.fa {
font-size: 16px;
} }
.skin-aria-ng .sidebar a { .skin-aria-ng .sidebar a {
@ -273,18 +312,6 @@ td {
} }
} }
.skin-aria-ng .treeview-menu > li > a {
color: #8aa4af;
}
.skin-aria-ng .treeview-menu > li > a:hover {
color: #fefefe;
}
.skin-aria-ng .treeview-menu > li.active > a {
color: #0080ff;
}
.skin-aria-ng .content-wrapper, .right-side { .skin-aria-ng .content-wrapper, .right-side {
background-color: #fff; background-color: #fff;
} }