remove superfluous "collapsed" class and rename header classes for clarity

This commit is contained in:
Mike Greiling 2016-09-02 10:34:04 -05:00
parent b2f8ebbb42
commit a510fe1102
5 changed files with 8 additions and 34 deletions

View file

@ -14,11 +14,9 @@
const pinnedPageClass = 'page-sidebar-pinned';
const expandedPageClass = 'page-sidebar-expanded';
const collapsedPageClass = 'page-sidebar-collapsed';
const pinnedNavbarClass = 'header-pinned-nav';
const expandedNavbarClass = 'header-expanded';
const collapsedNavbarClass = 'header-collapsed';
const pinnedNavbarClass = 'header-sidebar-pinned';
const expandedNavbarClass = 'header-sidebar-expanded';
class Sidebar {
constructor() {
@ -75,12 +73,10 @@
renderState() {
$(pageSelector)
.toggleClass(pinnedPageClass, this.isPinned && this.isExpanded)
.toggleClass(expandedPageClass, this.isExpanded)
.toggleClass(collapsedPageClass, !this.isExpanded);
.toggleClass(expandedPageClass, this.isExpanded);
$(navbarSelector)
.toggleClass(pinnedNavbarClass, this.isPinned && this.isExpanded)
.toggleClass(expandedNavbarClass, this.isExpanded)
.toggleClass(collapsedNavbarClass, !this.isExpanded);
.toggleClass(expandedNavbarClass, this.isExpanded);
const $pinnedToggle = $(pinnedToggleSelector);
const tooltipText = this.isPinned ? 'Unpin navigation' : 'Pin navigation';

View file

@ -77,10 +77,6 @@ header {
}
}
&.header-collapsed {
padding: 0 16px;
}
.side-nav-toggle {
position: absolute;
left: -10px;

View file

@ -1,6 +1,5 @@
.page-with-sidebar {
padding-top: $header-height;
padding-bottom: 25px;
padding: $header-height 0 25px;
transition: padding $sidebar-transition-duration;
&.page-sidebar-pinned {
@ -15,6 +14,7 @@
bottom: 0;
left: 0;
height: 100%;
width: 0;
overflow: hidden;
transition: width $sidebar-transition-duration;
@include box-shadow(2px 0 16px 0 $black-transparent);
@ -150,14 +150,6 @@
}
}
.page-sidebar-collapsed {
padding-left: 0;
.sidebar-wrapper {
width: 0;
}
}
.page-sidebar-expanded {
.sidebar-wrapper {
width: $sidebar_width;
@ -173,7 +165,7 @@
}
}
header.header-pinned-nav {
header.header-sidebar-pinned {
@media (min-width: $sidebar-breakpoint) {
padding-left: ($sidebar_width + $gl-padding);

View file

@ -48,12 +48,6 @@
margin-bottom: 10px;
}
}
.page-sidebar-collapsed {
.scroll-controls {
left: 70px;
}
}
}
.build-header {

View file

@ -14,8 +14,6 @@ module NavHelper
def page_sidebar_class
if pinned_nav?
"page-sidebar-expanded page-sidebar-pinned"
else
"page-sidebar-collapsed"
end
end
@ -43,9 +41,7 @@ module NavHelper
class_name << " with-horizontal-nav" if defined?(nav) && nav
if pinned_nav?
class_name << " header-expanded header-pinned-nav"
else
class_name << " header-collapsed"
class_name << " header-sidebar-expanded header-sidebar-pinned"
end
class_name