From a510fe11026ddfd264b9cc4627541b6dac0c38c7 Mon Sep 17 00:00:00 2001
From: Mike Greiling <mike@pixelcog.com>
Date: Fri, 2 Sep 2016 10:34:04 -0500
Subject: [PATCH] remove superfluous "collapsed" class and rename header
classes for clarity
---
app/assets/javascripts/sidebar.js.es6 | 12 ++++--------
app/assets/stylesheets/framework/header.scss | 4 ----
app/assets/stylesheets/framework/sidebar.scss | 14 +++-----------
app/assets/stylesheets/pages/builds.scss | 6 ------
app/helpers/nav_helper.rb | 6 +-----
5 files changed, 8 insertions(+), 34 deletions(-)
diff --git a/app/assets/javascripts/sidebar.js.es6 b/app/assets/javascripts/sidebar.js.es6
index 737f343ed0d..0cd6f946f61 100644
--- a/app/assets/javascripts/sidebar.js.es6
+++ b/app/assets/javascripts/sidebar.js.es6
@@ -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';
diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss
index 1036219172e..d4a030f7f7a 100644
--- a/app/assets/stylesheets/framework/header.scss
+++ b/app/assets/stylesheets/framework/header.scss
@@ -77,10 +77,6 @@ header {
}
}
- &.header-collapsed {
- padding: 0 16px;
- }
-
.side-nav-toggle {
position: absolute;
left: -10px;
diff --git a/app/assets/stylesheets/framework/sidebar.scss b/app/assets/stylesheets/framework/sidebar.scss
index 558a5fb5d25..3b7de4b57bb 100644
--- a/app/assets/stylesheets/framework/sidebar.scss
+++ b/app/assets/stylesheets/framework/sidebar.scss
@@ -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);
diff --git a/app/assets/stylesheets/pages/builds.scss b/app/assets/stylesheets/pages/builds.scss
index 614405aa5c1..c879074c7fe 100644
--- a/app/assets/stylesheets/pages/builds.scss
+++ b/app/assets/stylesheets/pages/builds.scss
@@ -48,12 +48,6 @@
margin-bottom: 10px;
}
}
-
- .page-sidebar-collapsed {
- .scroll-controls {
- left: 70px;
- }
- }
}
.build-header {
diff --git a/app/helpers/nav_helper.rb b/app/helpers/nav_helper.rb
index 2b0ff6c0d00..99e39eb442a 100644
--- a/app/helpers/nav_helper.rb
+++ b/app/helpers/nav_helper.rb
@@ -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
--
GitLab