github
/
AdminLTE
mirror of https://github.com/ColorlibHQ/AdminLTE
1
0
Fork 0
Code Issues Releases Wiki Activity

.left-side is now deprecated in favor of .main-sidebar. This will allow us to add support for rtl in the future.

pull/229/head
almasaeed2010 2015-02-02 12:39:29 -05:00
parent 87adc23aa8
commit 748b5b5a08
35 changed files with 116 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
build/less/core.less
View File

@ -10,7 +10,7 @@ body {
}
}
body {
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
@ -85,7 +85,9 @@ body {
/* Fixed layout */
.fixed {
.main-header, .left-side {
.main-header,
.main-sidebar,
.left-side {
position: fixed;
}
.main-header {
@ -160,7 +162,10 @@ a:hover, a:active, a:focus {
}
//Elements that we want to hide when printing
.left-side, .header, .content-header {
.main-sidebar,
.left-side,
.header,
.content-header {
display: none;
}
//This is the only element that should appear, so let's remove the margins

6
build/less/header.less
View File

@ -180,9 +180,9 @@
float: right;
}
}
.main-sidebar,
.left-side {
padding-top: 0!important;
margin-top: 50px!important;
padding-top: 50px!important;
margin-top: 0!important;
}
}

4
build/less/sidebar.less
View File

@ -2,6 +2,10 @@
* Component: Sidebar
* ------------------
*/
//Main Sidebar
// ``` .left-side has been deprecated in favor of .main-sidebar ```
.main-sidebar,
.left-side {
position: absolute;
top: 50px;

1
build/less/skins/skin-black.less
View File

@ -67,6 +67,7 @@
}
//Sidebar & Treeview
// Sidebar color
.main-sidebar,
.left-side,
.wrapper {
background: #222;

8
build/less/skins/skin-blue.less
View File

@ -78,14 +78,10 @@
}
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color)
.wrapper {
background: @skin-blue-sidebar-bg;
}
.wrapper ,
.main-sidebar,
.left-side {
background: @skin-blue-sidebar-bg;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.sidebar a {

8
build/less/skins/skin-green.less
View File

@ -78,14 +78,10 @@
}
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color)
.wrapper {
background: @skin-blue-sidebar-bg;
}
.wrapper ,
.main-sidebar,
.left-side {
background: @skin-blue-sidebar-bg;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.sidebar a {

8
build/less/skins/skin-purple.less
View File

@ -78,14 +78,10 @@
}
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color)
.wrapper {
background: @skin-blue-sidebar-bg;
}
.wrapper ,
.main-sidebar,
.left-side {
background: @skin-blue-sidebar-bg;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.sidebar a {

8
build/less/skins/skin-red.less
View File

@ -78,14 +78,10 @@
}
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color)
.wrapper {
background: @skin-blue-sidebar-bg;
}
.wrapper ,
.main-sidebar,
.left-side {
background: @skin-blue-sidebar-bg;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.sidebar a {

8
build/less/skins/skin-yellow.less
View File

@ -78,14 +78,10 @@
}
// Sidebar color (Both .wrapper and .left-side are responsible for sidebar bg color)
.wrapper {
background: @skin-blue-sidebar-bg;
}
.wrapper ,
.main-sidebar,
.left-side {
background: @skin-blue-sidebar-bg;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.sidebar a {

52
dist/css/AdminLTE.css vendored
View File

@ -111,6 +111,7 @@ body {
}
/* Fixed layout */
.fixed .main-header,
.fixed .main-sidebar,
.fixed .left-side {
position: fixed;
}
@ -182,6 +183,7 @@ a:focus {
.no-print {
display: none;
}
.main-sidebar,
.left-side,
.header,
.content-header {
@ -356,15 +358,17 @@ a:focus {
.main-header .navbar-custom-menu {
float: right;
}
.main-sidebar,
.left-side {
padding-top: 0!important;
margin-top: 50px!important;
padding-top: 50px!important;
margin-top: 0!important;
}
}
/*
* Component: Sidebar
* ------------------
*/
.main-sidebar,
.left-side {
position: absolute;
top: 50px;
@ -376,6 +380,7 @@ a:focus {
transition: transform 0.3s ease;
}
@media (max-width: 767px) {
.main-sidebar,
.left-side {
-webkit-transform: translate(-230px, 0);
-ms-transform: translate(-230px, 0);
@ -384,6 +389,7 @@ a:focus {
}
}
@media (min-width: 768px) {
.sidebar-collapse .main-sidebar,
.sidebar-collapse .left-side {
-webkit-transform: translate(-230px, 0);
-ms-transform: translate(-230px, 0);
@ -392,6 +398,7 @@ a:focus {
}
}
@media (max-width: 767px) {
.sidebar-open .main-sidebar,
.sidebar-open .left-side {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
@ -2820,14 +2827,10 @@ table.text-center th {
margin: 0 1px;
background: #2c3b41;
}
.skin-blue .wrapper {
background: #222d32;
}
.skin-blue .wrapper,
.skin-blue .main-sidebar,
.skin-blue .left-side {
background: #222d32;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.skin-blue .sidebar a {
color: #b8c7ce;
@ -2969,6 +2972,7 @@ table.text-center th {
.skin-black .user-panel > .info > a {
color: #eee;
}
.skin-black .main-sidebar,
.skin-black .left-side,
.skin-black .wrapper {
background: #222;
@ -3125,14 +3129,10 @@ table.text-center th {
margin: 0 1px;
background: #2c3b41;
}
.skin-red .wrapper {
background: #222d32;
}
.skin-red .wrapper,
.skin-red .main-sidebar,
.skin-red .left-side {
background: #222d32;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.skin-red .sidebar a {
color: #b8c7ce;
@ -3269,14 +3269,10 @@ table.text-center th {
margin: 0 1px;
background: #2c3b41;
}
.skin-green .wrapper {
background: #222d32;
}
.skin-green .wrapper,
.skin-green .main-sidebar,
.skin-green .left-side {
background: #222d32;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.skin-green .sidebar a {
color: #b8c7ce;
@ -3413,14 +3409,10 @@ table.text-center th {
margin: 0 1px;
background: #2c3b41;
}
.skin-yellow .wrapper {
background: #222d32;
}
.skin-yellow .wrapper,
.skin-yellow .main-sidebar,
.skin-yellow .left-side {
background: #222d32;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.skin-yellow .sidebar a {
color: #b8c7ce;
@ -3557,14 +3549,10 @@ table.text-center th {
margin: 0 1px;
background: #2c3b41;
}
.skin-purple .wrapper {
background: #222d32;
}
.skin-purple .wrapper,
.skin-purple .main-sidebar,
.skin-purple .left-side {
background: #222d32;
/* -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
-moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.7);
box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);*/
}
.skin-purple .sidebar a {
color: #b8c7ce;

2
dist/css/AdminLTE.min.css vendored
View File

File diff suppressed because one or more lines are too long

71
documentation/index.html
View File

@ -24,22 +24,22 @@
font-weight: 500;
}
.right-side {
background: #f9f9f9;
background: #f9f9f9;
}
.page-header {
border: 0;
margin: 20px 0;
padding: 0;
padding: 0;
position: relative;
z-index: 1;
z-index: 1;
}
.page-header span {
.page-header span {
z-index: 5;
display: inline-block;
background-color: #f9f9f9;
padding: 10px 10px 10px 0;
font-size: 25px;
line-height: 1;
line-height: 1;
border-radius: 3px;
}
.page-header::before {
@ -51,11 +51,11 @@
position: absolute;
top: 50%;
margin-top: 2px;
z-index: -1;
z-index: -1;
}
.lead {
font-size: 16px;
font-weight: 400;
font-weight: 400;
}
.content {
padding: 10px 25px;
@ -124,12 +124,12 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<section class="sidebar" id="scrollspy">
<!-- sidebar menu: : style can be found in sidebar.less -->
<ul class="sidebar-menu" id="scrollspy">
<ul class="nav sidebar-menu">
<li class="header">TABLE OF CONTENTS</li>
<li class='active'><a href="#introduction"><i class='fa fa-circle-o'></i> Introduction</a></li>
<li><a href="#download"><i class='fa fa-circle-o'></i> Download</a></li>
@ -137,6 +137,8 @@
<li><a href="#advice"><i class='fa fa-circle-o'></i> Advice</a></li>
<li><a href="#layout"><i class='fa fa-circle-o'></i> Layout</a></li>
<li><a href="#components"><i class='fa fa-circle-o'></i> Components</a></li>
<li><a href="#browsers"><i class='fa fa-circle-o'></i> Browser Support</a></li>
<li><a href="#upgrade"><i class='fa fa-circle-o'></i> Upgrade Guide</a></li>
</ul>
</section>
<!-- /.sidebar -->
@ -222,10 +224,10 @@ AdminLTE/
├── All the customized plugins CSS and JS files</code></pre>
</section>
<section id="dependencies">
<h2 class="page-header"><span>Dependencies</span></h2>
<p class="lead">AdminLTE depends on two main frameworks.
<h2 class="page-header"><span>Dependencies</span></h2>
<p class="lead">AdminLTE depends on two main frameworks.
The downloadable package contains both of these libraries, so you don't have to manually download them.</p>
<ul class="lead">
<ul class="lead">
<li><a href="http://getbootstrap.com" target="_blank">Bootstrap 3</a></li>
<li><a href="http://jquery.com/" target="_blank">jQuery 1.11+</a></li>
</ul>
@ -254,8 +256,8 @@ AdminLTE/
<ul class='lead'>
<li>Wrapper <code>.wrapper</code></li>
<li>Main Header <code>.main-header</code></li>
<li>Sidebar <code>.left-side</code></li>
<li>Content <code>.right-side</code></li>
<li>Sidebar <code>.sidebar-wrapper</code></li>
<li>Content <code>.content-wrapper</code></li>
</ul>
<pre class='prettyprint'>
&LT;!DOCTYPE html>
@ -298,7 +300,7 @@ AdminLTE/
&LT;!-- =============================================== -->
&LT;!-- Left side column. contains the sidebar -->
&LT;aside class="left-side">
&LT;aside class="main-sidebar">
&LT;!-- sidebar: style can be found in sidebar.less -->
&LT;section class="sidebar">
&LT;!-- sidebar menu: : style can be found in sidebar.less -->
@ -342,14 +344,26 @@ AdminLTE/
</section>
<section id='components'>
<h2 class='page-header'><span>Components</span></h2>
<p class="lead">Content</p>
</section>
<section id='browsers'>
<h2 class='page-header'><span>Browser Support</span></h2>
<p>Text will go here</p>
<p class="lead">AdminLTE supports the following browsers:</p>
<ul>
<li>IE9+</li>
<li>FireFox (latest)</li>
<li>Safari (latest)</li>
<li>Chrome (latest)</li>
<li>Opera (latest)</li>
</ul>
</section>
<section id='browsers'>
<section id='upgrade'>
<h2 class='page-header'><span>Upgrade Guide</span></h2>
<p class="lead">Content</p>
</section>
<section id='faq'>
<h2 class='page-header'><span>FAQ</span></h2>
<p>Text will go here</p>
<p class="lead">Content</p>
</section>
<div class='box'>
<div class='box-header with-border'>
@ -369,9 +383,6 @@ AdminLTE/
</div><!-- ./wrapper -->
<!-- Pace 1.0.0 --
<script src="js/plugins/pace/pace.js" type="text/javascript"></script-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js" type="text/javascript"></script>
@ -381,9 +392,19 @@ AdminLTE/
<script src="../plugins/slimScroll/jquery.slimscroll.min.js" type="text/javascript"></script>
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>
<script src="//use.typekit.net/yvy0plb.js"></script>
<script>try {
<script>
try {
Typekit.load();
} catch (e) {
}</script>
}
</script>
<script>
$(function(){
$(".sidebar-menu li a").click(function(){
$(this).parents("ul").find(".active").removeClass("active");
$(this).parent('li').addClass('active');
});
});
</script>
</body>
</html>
</html>

2
index.html
View File

@ -277,7 +277,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
index2.html
View File

@ -270,7 +270,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/UI/buttons.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/UI/general.html
View File

@ -285,7 +285,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/UI/icons.html
View File

@ -314,7 +314,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/UI/modals.html
View File

@ -282,7 +282,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/UI/sliders.html
View File

@ -274,7 +274,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/UI/timeline.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/calendar.html
View File

@ -271,7 +271,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/charts/flot.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/charts/inline.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/charts/morris.html
View File

@ -270,7 +270,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/examples/404.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/examples/500.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/examples/blank.html
View File

@ -164,7 +164,7 @@
<!-- =============================================== -->
<!-- Left side column. contains the sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/examples/invoice.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/forms/advanced.html
View File

@ -278,7 +278,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/forms/editors.html
View File

@ -270,7 +270,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/forms/general.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/mailbox.html
View File

@ -272,7 +272,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/tables/data.html
View File

@ -270,7 +270,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/tables/simple.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->

2
pages/widgets.html
View File

@ -268,7 +268,7 @@
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="left-side">
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel -->