From 2449bea2c46f44ef09122856363beb955c853c1f Mon Sep 17 00:00:00 2001
From: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Date: Fri, 15 Mar 2013 15:39:47 +0200
Subject: [PATCH] restyle header a bit

---
 app/assets/stylesheets/sections/header.scss | 120 ++------------------
 app/views/layouts/_head_panel.html.haml     |  19 ++--
 2 files changed, 17 insertions(+), 122 deletions(-)

diff --git a/app/assets/stylesheets/sections/header.scss b/app/assets/stylesheets/sections/header.scss
index 8f6727016d4..14e4cef011f 100644
--- a/app/assets/stylesheets/sections/header.scss
+++ b/app/assets/stylesheets/sections/header.scss
@@ -72,13 +72,22 @@ header {
     @include header-font;
   }
 
+  .profile-pic {
+    position: relative;
+    top: -4px;
+    img {
+      width: 26px;
+      @include border-radius(4px);
+    }
+  }
+
   /**
    *
    * Search box
    *
    */
   .search {
-    margin-right: 45px;
+    margin-right: 10px;
     margin-left: 10px;
 
     .search-input {
@@ -98,115 +107,6 @@ header {
     }
   }
 
-  /**
-   *
-   * Account box
-   *
-   */
-  .account-box {
-    position: absolute;
-    right: 0;
-    top: 4px;
-    z-index: 10000;
-    width: 128px;
-    font-size: 11px;
-    float: right;
-    display: block;
-    cursor: pointer;
-    img {
-      @include border-radius(3px);
-      right: 5px;
-      position: absolute;
-      width: 28px;
-      height: 28px;
-      display: block;
-      top: 1px;
-      &:after {
-        content: " ";
-        display: block;
-        position: absolute;
-        top: 0;
-        right: 0;
-        left: 0;
-        bottom: 0;
-        float: right;
-        @include border-radius(5px);
-        border: 1px solid rgba(255, 255, 255, 0.1);
-        border-bottom: 0;
-        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0.15)), to(rgba(0, 0, 0, 0.25))),
-                    -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, 0.1)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0)));
-        background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)),
-                    -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
-        background: linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)),
-                    linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
-        -webkit-background-origin: border-box;
-        -moz-background-origin: border;
-  background-origin: border-box; } } }
-
-  .account-box {
-    &.hover {
-    height: 138px; }
-    &:hover > .account-links {
-  display: block; } }
-
-  .account-links {
-    @include border-radius(5px);
-    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-    position: relative;
-    &:before {
-      content: ".";
-      width: 0;
-      height: 0;
-      position: absolute;
-      border: 5px solid transparent;
-      border-color: rgba(255, 255, 255, 0);
-      border-bottom-color: #555;
-      text-indent: -9999px;
-      top: -10px;
-      line-height: 0;
-      right: 10px;
-    z-index: 10; }
-    background: #555;
-    display: none;
-    z-index: 100000;
-    @include border-radius(4px);
-    width: 130px;
-    position: absolute;
-    right: 5px;
-    top: 38px;
-    margin-top: 0;
-    float: right;
-    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
-    a {
-      color: #fff;
-      padding: 12px 15px;
-      display: block;
-      text-shadow: none;
-      border-bottom: 1px solid #666;
-      font-size: 12px;
-      &:hover {
-        color: #fff;
-        background: #333;
-      }
-    }
-  }
-
-  .account-box.hover .arrow-up {
-    top: 41px;
-    right: 6px;
-    position: absolute; }
-
-  .account-links a {
-    &:first-child {
-      @include border-radius(5px 5px 0 0);
-    }
-    &:last-child {
-      @include border-radius(0 0 5px 5px);
-      border-bottom: 0;
-    }
-  }
-
-
 
   /*
    * Dark header
diff --git a/app/views/layouts/_head_panel.html.haml b/app/views/layouts/_head_panel.html.haml
index 1f3ce2f40ef..5ab2112f514 100644
--- a/app/views/layouts/_head_panel.html.haml
+++ b/app/views/layouts/_head_panel.html.haml
@@ -8,6 +8,9 @@
         %span.separator
       %h1.project_name= title
       %ul.nav
+        %li
+          = render "layouts/search"
+        %li.separator
         %li
           = link_to public_root_path, title: "Public area", class: 'has_bottom_tooltip', 'data-original-title' => 'Public area' do
             %i.icon-globe
@@ -22,20 +25,12 @@
         %li
           = link_to profile_path, title: "My Profile", class: 'has_bottom_tooltip', 'data-original-title' => 'Your profile'  do
             %i.icon-user
-        %li.separator
         %li
-          = render "layouts/search"
+          = link_to destroy_user_session_path, class: "logout", method: :delete, title: "Logout", class: 'has_bottom_tooltip', 'data-original-title' => 'Logout'  do
+            %i.icon-signout
         %li
-          .account-box
-            = link_to profile_path, class: "pic" do
-              = image_tag gravatar_icon(current_user.email)
-            .account-links
-              = link_to profile_path, class: "username" do
-                %i.icon-user.icon-white
-                My profile
-              = link_to destroy_user_session_path, class: "logout", method: :delete do
-                %i.icon-signout.icon-white
-                Logout
+          = link_to current_user, class: "profile-pic" do
+            = image_tag gravatar_icon(current_user.email, 26)
 
 
 = render "layouts/init_auto_complete"
-- 
GitLab