This commit is contained in:
Abdullah Almsaeed 2017-06-25 09:33:22 -04:00
parent 4b0d73bab9
commit fbbc450c41
8 changed files with 46 additions and 41 deletions

View file

@ -26,7 +26,8 @@
sidebar : '.sidebar',
controlSidebar: '.control-sidebar',
fixed : '.fixed',
sidebarMenu : '.sidebar-menu'
sidebarMenu : '.sidebar-menu',
logo : '.main-header .logo'
}
var ClassName = {
@ -57,7 +58,13 @@
$(window).resize(function () {
this.fix()
this.fixSidebar()
$(Selector.logo + ', ' + Selector.sidebar).one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function () {
this.fix()
this.fixSidebar()
}.bind(this))
}.bind(this))
this.bindedResize = true
}
@ -82,25 +89,25 @@
var windowHeight = $(window).height()
var sidebarHeight = $(Selector.sidebar).height() || 0
// Set the min-height of the content and sidebar based on the
// Set the min-height of the content and sidebar based on
// the height of the document.
if ($('body').hasClass(ClassName.fixed)) {
$(Selector.contentWrapper).css('min-height', windowHeight - footerHeight)
} else {
var postSetWidth
var postSetHeight
if (windowHeight >= sidebarHeight) {
$(Selector.contentWrapper).css('min-height', windowHeight - neg)
postSetWidth = windowHeight - neg
postSetHeight = windowHeight - neg
} else {
$(Selector.contentWrapper).css('min-height', sidebarHeight)
postSetWidth = sidebarHeight
postSetHeight = sidebarHeight
}
// Fix for the control sidebar height
var $controlSidebar = $(Selector.controlSidebar)
if (typeof $controlSidebar !== 'undefined') {
if ($controlSidebar.height() > postSetWidth)
if ($controlSidebar.height() > postSetHeight)
$(Selector.contentWrapper).css('min-height', $controlSidebar.height())
}
}

View file

@ -2,11 +2,8 @@
* Component: Sidebar
* ------------------
*/
//Main Sidebar
// ``` .left-side has been deprecated as of 2.0.0 in favor of .main-sidebar ```
.main-sidebar,
.left-side {
// Main Sidebar
.main-sidebar {
position: absolute;
top: 0;
left: 0;
@ -14,21 +11,25 @@
min-height: 100%;
width: @sidebar-width;
z-index: 810;
//Using disposable variable to join statements with a comma
@transition-rule: @transition-speed @transition-fn,
width @transition-speed @transition-fn;
// Using disposable variable to join statements with a comma
@transition-rule: @transition-speed @transition-fn, width @transition-speed @transition-fn;
.transition-transform(@transition-rule);
@media (max-width: @screen-header-collapse) {
padding-top: 100px;
}
@media (max-width: @screen-xs-max) {
.translate(-@sidebar-width, 0);
}
.sidebar-collapse & {
@media (min-width: @screen-sm) {
.translate(-@sidebar-width, 0);
}
}
.sidebar-open & {
@media (max-width: @screen-xs-max) {
.translate(0, 0);
@ -40,14 +41,14 @@
padding-bottom: 10px;
}
// remove border from form
// Remove border from form
.sidebar-form {
input:focus {
border-color: transparent;
}
}
//Sidebar user panel
// Sidebar user panel
.user-panel {
position: relative;
width: 100%;

15
dist/css/AdminLTE.css vendored
View file

@ -415,8 +415,7 @@ a:focus {
* Component: Sidebar
* ------------------
*/
.main-sidebar,
.left-side {
.main-sidebar {
position: absolute;
top: 0;
left: 0;
@ -430,14 +429,12 @@ a:focus {
transition: transform 0.3s ease-in-out, width 0.3s ease-in-out;
}
@media (max-width: 767px) {
.main-sidebar,
.left-side {
.main-sidebar {
padding-top: 100px;
}
}
@media (max-width: 767px) {
.main-sidebar,
.left-side {
.main-sidebar {
-webkit-transform: translate(-230px, 0);
-ms-transform: translate(-230px, 0);
-o-transform: translate(-230px, 0);
@ -445,8 +442,7 @@ a:focus {
}
}
@media (min-width: 768px) {
.sidebar-collapse .main-sidebar,
.sidebar-collapse .left-side {
.sidebar-collapse .main-sidebar {
-webkit-transform: translate(-230px, 0);
-ms-transform: translate(-230px, 0);
-o-transform: translate(-230px, 0);
@ -454,8 +450,7 @@ a:focus {
}
}
@media (max-width: 767px) {
.sidebar-open .main-sidebar,
.sidebar-open .left-side {
.sidebar-open .main-sidebar {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
-o-transform: translate(0, 0);

File diff suppressed because one or more lines are too long

View file

@ -416,8 +416,7 @@ a:focus {
* Component: Sidebar
* ------------------
*/
.main-sidebar,
.left-side {
.main-sidebar {
position: absolute;
top: 0;
left: 0;
@ -431,14 +430,12 @@ a:focus {
transition: transform 0.3s ease-in-out, width 0.3s ease-in-out;
}
@media (max-width: 767px) {
.main-sidebar,
.left-side {
.main-sidebar {
padding-top: 100px;
}
}
@media (max-width: 767px) {
.main-sidebar,
.left-side {
.main-sidebar {
-webkit-transform: translate(-230px, 0);
-ms-transform: translate(-230px, 0);
-o-transform: translate(-230px, 0);
@ -446,8 +443,7 @@ a:focus {
}
}
@media (min-width: 768px) {
.sidebar-collapse .main-sidebar,
.sidebar-collapse .left-side {
.sidebar-collapse .main-sidebar {
-webkit-transform: translate(-230px, 0);
-ms-transform: translate(-230px, 0);
-o-transform: translate(-230px, 0);
@ -455,8 +451,7 @@ a:focus {
}
}
@media (max-width: 767px) {
.sidebar-open .main-sidebar,
.sidebar-open .left-side {
.sidebar-open .main-sidebar {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
-o-transform: translate(0, 0);

File diff suppressed because one or more lines are too long

11
dist/js/adminlte.js vendored
View file

@ -45,7 +45,8 @@ throw new Error('AdminLTE requires jQuery')
sidebar : '.sidebar',
controlSidebar: '.control-sidebar',
fixed : '.fixed',
sidebarMenu : '.sidebar-menu'
sidebarMenu : '.sidebar-menu',
logo : '.main-header .logo'
}
var ClassName = {
@ -76,7 +77,13 @@ throw new Error('AdminLTE requires jQuery')
$(window).resize(function () {
this.fix()
this.fixSidebar()
$(Selector.logo + ', ' + Selector.sidebar).one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function () {
this.fix()
this.fixSidebar()
}.bind(this))
}.bind(this))
this.bindedResize = true
}
@ -101,7 +108,7 @@ throw new Error('AdminLTE requires jQuery')
var windowHeight = $(window).height()
var sidebarHeight = $(Selector.sidebar).height() || 0
// Set the min-height of the content and sidebar based on the
// Set the min-height of the content and sidebar based on
// the height of the document.
if ($('body').hasClass(ClassName.fixed)) {
$(Selector.contentWrapper).css('min-height', windowHeight - footerHeight)

File diff suppressed because one or more lines are too long