acp - nanoscroller ftw

v1.18.x
psychobunny 11 years ago
parent bc574b0e2b
commit 06b4e84fc1

@ -39,6 +39,10 @@
z-index: 1;
overflow-y: auto;
.nano-content {
top: 11px;
}
.sidebar-nav {
margin-top: 1px;
overflow: hidden;

@ -34,6 +34,8 @@ define('forum/admin/footer', ['forum/admin/settings'], function(Settings) {
$('.sidebar-nav .nav-header').on('click', function() {
$(this).parents('.sidebar-nav').toggleClass('open');
});
$('.nano').nanoScroller();
}
function setupPills() {

@ -0,0 +1,54 @@
/** initial setup **/
.nano {
position : relative;
width : 100%;
height : 100%;
overflow : hidden;
}
.nano > .nano-content {
position : absolute;
overflow : scroll;
overflow-x : hidden;
top : 0;
right : 0;
bottom : 0;
left : 0;
}
.nano > .nano-content:focus {
outline: thin dotted;
}
.nano > .nano-content::-webkit-scrollbar {
display: none;
}
.has-scrollbar > .nano-content::-webkit-scrollbar {
display: block;
}
.nano > .nano-pane {
background : rgba(0,0,0,.25);
position : absolute;
width : 10px;
right : 0;
top : 0;
bottom : 0;
visibility : hidden\9; /* Target only IE7 and IE8 with this hack */
opacity : .01;
-webkit-transition : .2s;
-moz-transition : .2s;
-o-transition : .2s;
transition : .2s;
-moz-border-radius : 5px;
-webkit-border-radius : 5px;
border-radius : 5px;
}
.nano > .nano-pane > .nano-slider {
background: rgba(255, 255, 255, 0.3);
position : relative;
margin : 0 1px;
-moz-border-radius : 3px;
-webkit-border-radius : 3px;
border-radius : 3px;
}
.nano:hover > .nano-pane, .nano-pane.active, .nano-pane.flashed {
visibility : visible\9; /* Target only IE7 and IE8 with this hack */
opacity : 0.99;
}

File diff suppressed because one or more lines are too long

@ -6,6 +6,7 @@
<link rel="stylesheet" href="{relative_path}/vendor/jquery/css/smoothness/jquery-ui-1.10.4.custom.min.css">
<link rel="stylesheet" type="text/css" href="{relative_path}/vendor/colorpicker/colorpicker.css">
<link rel="stylesheet" type="text/css" href="{relative_path}/vendor/nanoscroller/nanoscroller.css">
<link rel="stylesheet" type="text/css" href="{relative_path}/admin.css?{cache-buster}" />
<script>
@ -24,6 +25,7 @@
<script type="text/javascript" src="{relative_path}/vendor/colorpicker/colorpicker.js"></script>
<script type="text/javascript" src="{relative_path}/src/admin.js?{cache-buster}"></script>
<script type="text/javascript" src="{relative_path}/vendor/ace/ace.js"></script>
<script type="text/javascript" src="{relative_path}/vendor/nanoscroller/nanoscroller.min.js"></script>
<script>
require.config({
@ -91,77 +93,79 @@
</div>
<div class="wrapper">
<div id="main-menu">
<div class="sidebar-nav">
<ul class="nav nav-list">
<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><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/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/groups"><i class="fa fa-fw fa-group"></i> Groups</a></li>
</ul>
</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/appearance/widgets"><i class="fa fa-fw fa-th"></i> Widgets</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/events"><i class="fa fa-fw fa-calendar-o"></i> Events</a></li>
</ul>
</div>
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Social Authentication</li>
<!-- IF !authentication.length -->
<li><a href="{relative_path}/admin/plugins"><i class="fa fa-fw fa-code-fork"></i> Install SSO Plugins</a></li>
<!-- ENDIF !authentication.length -->
<!-- BEGIN authentication -->
<li>
<a href="{relative_path}/admin{authentication.route}"><i class="fa fa-fw {authentication.icon}"></i> {authentication.name}</a>
</li>
<!-- END authentication -->
</ul>
</div>
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Plugins</li>
<!-- BEGIN plugins -->
<li>
<a href="{relative_path}/admin{plugins.route}"><i class="fa fa-fw {plugins.icon}"></i> {plugins.name}</a>
</li>
<!-- END plugins -->
</ul>
</div>
<!-- IF env -->
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Development</li>
<li><a href="{relative_path}/admin/logger"><i class="fa fa-fw fa-th"></i> Logger</a></li>
</ul>
<div id="main-menu" class="nano">
<div class="nano-content">
<div class="sidebar-nav">
<ul class="nav nav-list">
<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><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/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/groups"><i class="fa fa-fw fa-group"></i> Groups</a></li>
</ul>
</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/appearance/widgets"><i class="fa fa-fw fa-th"></i> Widgets</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/events"><i class="fa fa-fw fa-calendar-o"></i> Events</a></li>
</ul>
</div>
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Social Authentication</li>
<!-- IF !authentication.length -->
<li><a href="{relative_path}/admin/plugins"><i class="fa fa-fw fa-code-fork"></i> Install SSO Plugins</a></li>
<!-- ENDIF !authentication.length -->
<!-- BEGIN authentication -->
<li>
<a href="{relative_path}/admin{authentication.route}"><i class="fa fa-fw {authentication.icon}"></i> {authentication.name}</a>
</li>
<!-- END authentication -->
</ul>
</div>
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Plugins</li>
<!-- BEGIN plugins -->
<li>
<a href="{relative_path}/admin{plugins.route}"><i class="fa fa-fw {plugins.icon}"></i> {plugins.name}</a>
</li>
<!-- END plugins -->
</ul>
</div>
<!-- IF env -->
<div class="sidebar-nav">
<ul class="nav nav-list">
<li class="nav-header">Development</li>
<li><a href="{relative_path}/admin/logger"><i class="fa fa-fw fa-th"></i> Logger</a></li>
</ul>
</div>
<!-- ENDIF env -->
</div>
<!-- ENDIF env -->
</div>
<div class="col-sm-12" id="content">
Loading…
Cancel
Save