acp menu - theming completified

v1.18.x
psychobunny 10 years ago
parent 2f6a123d32
commit c60cbce14a

@ -30,13 +30,13 @@
.sidebar-nav { .sidebar-nav {
margin-top: 1px; margin-top: 1px;
overflow: hidden; overflow: hidden;
.transition(.4s ease-in-out height); .transition(.4s ease-in-out max-height);
height: 250px;
max-height: 100%; max-height: 100%;
cursor: pointer; cursor: pointer;
max-height: 38px;
&.closed {
height: 38px; &.open {
max-height: 500px;
} }
.nav-header { .nav-header {
@ -46,6 +46,7 @@
background-color: #272727; background-color: #272727;
text-shadow: 0px 0px 2px #111; text-shadow: 0px 0px 2px #111;
padding: 10px; padding: 10px;
.user-select(none);
} }
.nav-list { .nav-list {

@ -31,8 +31,8 @@ define('forum/admin/footer', ['forum/admin/settings'], function(Settings) {
}); });
function setupMainMenu() { function setupMainMenu() {
$('.sidebar-nav').on('click', function() { $('.sidebar-nav .nav-header').on('click', function() {
$(this).toggleClass('closed'); $(this).toggleClass('open');
}); });
} }

@ -103,33 +103,57 @@
<div id="main-menu"> <div id="main-menu">
<div class="sidebar-nav"> <div class="sidebar-nav">
<ul class="nav nav-list"> <ul class="nav nav-list">
<li class="nav-header">NodeBB</li> <li class="nav-header">General</li>
<li class="active"><a href="{relative_path}/admin/index"><i class="fa fa-fw fa-home"></i> Home</a></li> <li class="active"><a href="{relative_path}/admin/index"><i class="fa fa-fw fa-home"></i> Home</a></li>
<li><a href="{relative_path}/admin/languages"><i class="fa fa-fw fa-language"></i> Languages</a></li>
<li><a href="{relative_path}/admin/settings/general"><i class="fa fa-fw fa-cogs"></i> Settings</a></li>
<li><a href="{relative_path}/admin/sounds"><i class="fa fa-fw fa-volume-up"></i> Sounds</a></li>
</ul>
</div>
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Manage</li>
<li><a href="{relative_path}/admin/categories/active"><i class="fa fa-fw fa-folder"></i> Categories</a></li> <li><a href="{relative_path}/admin/categories/active"><i class="fa fa-fw fa-folder"></i> Categories</a></li>
<li><a href="{relative_path}/admin/tags"><i class="fa fa-fw fa-tags"></i> Tags</a></li> <li><a href="{relative_path}/admin/tags"><i class="fa fa-fw fa-tags"></i> Tags</a></li>
<li><a href="{relative_path}/admin/users/latest"><i class="fa fa-fw fa-user"></i> Users</a></li> <li><a href="{relative_path}/admin/users/latest"><i class="fa fa-fw fa-user"></i> Users</a></li>
<li><a href="{relative_path}/admin/groups"><i class="fa fa-fw fa-group"></i> Groups</a></li> <li><a href="{relative_path}/admin/groups"><i class="fa fa-fw fa-group"></i> Groups</a></li>
<li><a href="{relative_path}/admin/settings/general"><i class="fa fa-fw fa-cogs"></i> Settings</a></li> </ul>
<li><a href="{relative_path}/admin/appearance/themes"><i class="fa fa-fw fa-th"></i> Appearance</a></li> </div>
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Appearance</li>
<li><a href="{relative_path}/admin/appearance/themes"><i class="fa fa-fw fa-th"></i> Themes</a></li>
<li><a href="{relative_path}/admin/appearance/skins"><i class="fa fa-fw fa-th"></i> Skins</a></li>
<li><a href="{relative_path}/admin/appearance/customise"><i class="fa fa-fw fa-th"></i> Custom HTML & CSS</a></li>
</ul>
</div>
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Extend</li>
<li><a href="{relative_path}/admin/plugins"><i class="fa fa-fw fa-code-fork"></i> Plugins</a></li> <li><a href="{relative_path}/admin/plugins"><i class="fa fa-fw fa-code-fork"></i> Plugins</a></li>
<li><a href="{relative_path}/admin/languages"><i class="fa fa-fw fa-language"></i> Languages</a></li> <li><a href="{relative_path}/admin/appearance/widgets"><i class="fa fa-fw fa-th"></i> Widgets</a></li>
<li><a href="{relative_path}/admin/sounds"><i class="fa fa-fw fa-volume-up"></i> Sounds</a></li> </ul>
</div>
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Advanced</li>
<li><a href="{relative_path}/admin/database"><i class="fa fa-fw fa-hdd-o"></i> Database</a></li> <li><a href="{relative_path}/admin/database"><i class="fa fa-fw fa-hdd-o"></i> Database</a></li>
<li><a href="{relative_path}/admin/events"><i class="fa fa-fw fa-calendar-o"></i> Events</a></li> <li><a href="{relative_path}/admin/events"><i class="fa fa-fw fa-calendar-o"></i> Events</a></li>
</ul> </ul>
</div> </div>
<!-- IF authentication.length -->
<div class="sidebar-nav"> <div class="sidebar-nav">
<ul class="nav nav-list"> <ul class="nav nav-list">
<li class="nav-header">Social Authentication</li> <li class="nav-header">Social Authentication</li>
<!-- BEGIN authentication --> <!-- IF !authentication.length -->
<li> <li><a href="{relative_path}/admin/plugins"><i class="fa fa-fw fa-code-fork"></i> Install SSO Plugins</a></li>
<a href="{relative_path}/admin{authentication.route}"><i class="fa fa-fw {authentication.icon}"></i> {authentication.name}</a> <!-- ENDIF !authentication.length -->
</li> <!-- BEGIN authentication -->
<!-- END authentication --> <li>
<a href="{relative_path}/admin{authentication.route}"><i class="fa fa-fw {authentication.icon}"></i> {authentication.name}</a>
</li>
<!-- END authentication -->
</ul> </ul>
</div> </div>
<!-- ENDIF authentication.length -->
<div class="sidebar-nav"> <div class="sidebar-nav">
<ul class="nav nav-list"> <ul class="nav nav-list">
<li class="nav-header">Plugins</li> <li class="nav-header">Plugins</li>

Loading…
Cancel
Save