From 9209f43b32e6dd2083c568954c8f5ca1daeaf94d Mon Sep 17 00:00:00 2001
From: Darby <darbsies@gmail.com>
Date: Fri, 19 Jun 2015 09:54:26 -0700
Subject: [PATCH 1/2] Edited the CSS of header and sidebar; added a new class
 of logo-container to the html to make things easier

---
 app/assets/stylesheets/generic/header.scss  | 28 +++++++++++++--------
 app/assets/stylesheets/generic/sidebar.scss | 18 ++++++++++---
 app/views/layouts/header/_default.html.haml |  3 ++-
 app/views/layouts/header/_public.html.haml  |  3 ++-
 4 files changed, 36 insertions(+), 16 deletions(-)

diff --git a/app/assets/stylesheets/generic/header.scss b/app/assets/stylesheets/generic/header.scss
index 8f17232592e..47a9fa24d79 100644
--- a/app/assets/stylesheets/generic/header.scss
+++ b/app/assets/stylesheets/generic/header.scss
@@ -3,6 +3,8 @@
  *
  */
 header {
+  transition-duration: .3s;
+
   &.navbar-empty {
     background: #FFF;
     border-bottom: 1px solid #EEE;
@@ -63,28 +65,34 @@ header {
     float: left;
     height: $header-height;
     width: $sidebar_width;
+    transition-duration: .3s;
 
     a {
       float: left;
       height: $header-height;
       width: 100%;
       padding: ($header-height - 36 ) / 2 8px;
-
-      h3 {
-        width: 158px;
-        float: left;
-        margin: 0;
-        margin-left: 14px;
-        font-size: 18px;
-        line-height: $header-height - 14;
-        font-weight: normal;
-      }
+      overflow: hidden;
 
       img {
         width: 36px;
         height: 36px;
         float: left;
       }
+
+      .gitlab-text-container {
+        width: 230px;
+
+        h3 {
+          width: 158px;
+          float: left;
+          margin: 0;
+          margin-left: 14px;
+          font-size: 18px;
+          line-height: $header-height - 14;
+          font-weight: normal;
+        }
+      }
     }
 
     &:hover {
diff --git a/app/assets/stylesheets/generic/sidebar.scss b/app/assets/stylesheets/generic/sidebar.scss
index 65e06e14c73..cce933beeb6 100644
--- a/app/assets/stylesheets/generic/sidebar.scss
+++ b/app/assets/stylesheets/generic/sidebar.scss
@@ -4,12 +4,14 @@
     top: 0;
     left: 0;
     height: 100%;
+    transition-duration: .3s;
   }
 }
 
 .sidebar-wrapper {
   z-index: 99;
   background: $background-color;
+  transition-duration: .3s;
 }
 
 .content-wrapper {
@@ -19,8 +21,10 @@
 }
 
 .nav-sidebar {
+  transition-duration: .3s;
   margin: 0;
   list-style: none;
+  overflow: hidden;
 
   &.navbar-collapse {
     padding: 0px !important;
@@ -34,9 +38,6 @@
   @include border-radius(6px);
 }
 
-.nav-sidebar li {
-}
-
 .nav-sidebar li {
   &.separate-item {
     padding-top: 10px;
@@ -79,6 +80,7 @@
 
 @mixin expanded-sidebar {
   padding-left: $sidebar_width;
+  transition-duration: .3s;
 
   .sidebar-wrapper {
     width: $sidebar_width;
@@ -89,6 +91,10 @@
       top: $header-height;
       width: $sidebar_width;
     }
+
+    .nav-sidebar li a{
+      width: 230px;
+    }
   }
 
   .content-wrapper {
@@ -98,6 +104,7 @@
 
 @mixin folded-sidebar {
   padding-left: 50px;
+  transition-duration: .3s;
 
   .sidebar-wrapper {
     width: $sidebar_collapsed_width;
@@ -112,7 +119,7 @@
         padding-left: 18px;
         font-size: 14px;
         padding: 8px 15px;
-        text-align: center;
+        text-align: left;
 
 
         & > span {
@@ -144,6 +151,7 @@
   height: 28px;
   text-align: center;
   line-height: 28px;
+  transition-duration: .3s;
 }
 
 .collapse-nav a:hover {
@@ -180,8 +188,10 @@
   bottom: 0;
   width: 100%;
   padding: 10px;
+  overflow: hidden;
 
   .username {
     margin-top: 5px;
+    width: 230px;
   }
 }
diff --git a/app/views/layouts/header/_default.html.haml b/app/views/layouts/header/_default.html.haml
index 1403b86f377..b3cd7b0e37b 100644
--- a/app/views/layouts/header/_default.html.haml
+++ b/app/views/layouts/header/_default.html.haml
@@ -3,7 +3,8 @@
     .header-logo
       = link_to root_path, class: 'home', title: 'Dashboard', id: 'js-shortcuts-home', data: {toggle: 'tooltip', placement: 'bottom'} do
         = brand_header_logo
-        %h3 GitLab
+        .gitlab-text-container
+          %h3 GitLab
     .header-content
       %button.navbar-toggle{type: 'button'}
         %span.sr-only Toggle navigation
diff --git a/app/views/layouts/header/_public.html.haml b/app/views/layouts/header/_public.html.haml
index 2c5884a5b6d..15c2e292be3 100644
--- a/app/views/layouts/header/_public.html.haml
+++ b/app/views/layouts/header/_public.html.haml
@@ -3,7 +3,8 @@
     .header-logo
       = link_to explore_root_path, class: "home" do
         = brand_header_logo
-        %h3 GitLab
+        .gitlab-text-container
+          %h3 GitLab
     .header-content
       - unless current_controller?('sessions')
         .pull-right

From 95e2ca76309bab95384e502ca6b9e4f20711e5f0 Mon Sep 17 00:00:00 2001
From: Darby <darbsies@gmail.com>
Date: Mon, 22 Jun 2015 12:03:16 -0700
Subject: [PATCH 2/2] fixed the resizing icon issue

---
 app/assets/stylesheets/generic/sidebar.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/generic/sidebar.scss b/app/assets/stylesheets/generic/sidebar.scss
index cce933beeb6..add0d1b04ad 100644
--- a/app/assets/stylesheets/generic/sidebar.scss
+++ b/app/assets/stylesheets/generic/sidebar.scss
@@ -49,7 +49,7 @@
     display: block;
     text-decoration: none;
     padding: 8px 15px;
-    font-size: 13px;
+    font-size: 14px;
     line-height: 20px;
     padding-left: 16px;
 
@@ -116,10 +116,10 @@
       width: $sidebar_collapsed_width;
 
       li a {
-        padding-left: 18px;
         font-size: 14px;
         padding: 8px 15px;
         text-align: left;
+        padding-left: 16px;
 
 
         & > span {