From 00464099704ec16ad64faa3fe8c19d931ee7037a Mon Sep 17 00:00:00 2001 From: Dmitriy Zaporozhets Date: Wed, 21 Nov 2012 08:14:05 +0300 Subject: [PATCH] I prefer icons on header --- app/assets/javascripts/main.js.coffee | 4 ++ app/assets/stylesheets/sections/header.scss | 58 +++++++++++++++++--- app/assets/stylesheets/themes/ui_basic.scss | 18 ++++++ app/assets/stylesheets/themes/ui_color.scss | 47 +--------------- app/assets/stylesheets/themes/ui_gray.scss | 47 +--------------- app/assets/stylesheets/themes/ui_modern.scss | 47 +--------------- app/views/layouts/_head_panel.html.haml | 12 ++-- 7 files changed, 81 insertions(+), 152 deletions(-) diff --git a/app/assets/javascripts/main.js.coffee b/app/assets/javascripts/main.js.coffee index b41651bf77b..3f4b0f61dc4 100644 --- a/app/assets/javascripts/main.js.coffee +++ b/app/assets/javascripts/main.js.coffee @@ -30,6 +30,10 @@ $ -> # Initialize tooltips $('.has_tooltip').tooltip() + # Bottom tooltip + $('.has_bottom_tooltip').tooltip(placement: 'bottom') + + # Disable form buttons while a form is submitting $('body').on 'ajax:complete, ajax:beforeSend, submit', 'form', (e) -> buttons = $('[type="submit"]', @) diff --git a/app/assets/stylesheets/sections/header.scss b/app/assets/stylesheets/sections/header.scss index 32f6d8552e8..0db40ec9ac7 100644 --- a/app/assets/stylesheets/sections/header.scss +++ b/app/assets/stylesheets/sections/header.scss @@ -12,6 +12,8 @@ header { .nav > li > a { color: $style_color; text-shadow: 0 1px 0 #fff; + font-size: 18px; + padding: 11px; } /** NAV block with links and profile **/ @@ -51,15 +53,6 @@ header { height:40px; font-family: 'Korolev', sans-serif; } - - } - .separator { - float: left; - height: 60px; - width: 1px; - background: white; - border-left: 1px solid #DDD; - margin-top: -10px; } } @@ -218,5 +211,52 @@ header { border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom: 0; } } + + + + /* + * Dark header + * + */ + &.header-dark { + &.navbar-gitlab { + .navbar-inner { + background: #708090; + border-bottom: 1px solid #AAA; + + .nav > li > a { + color: #fff; + text-shadow: 0 1px 0 #111; + } + } + } + + .search { + .search-input { + background-color: #D2D5DA; + background-color: rgba(255, 255, 255, 0.5); + + &:focus { + background-color: white; + } + } + } + .search-input::-webkit-input-placeholder { + color: #666; + } + .app_logo { + a { + h1 { + background: url('logo_white.png') no-repeat 0px 2px; + color:#fff; + text-shadow: 0 1px 1px #111; + } + } + } + .project_name { + color:#fff; + text-shadow: 0 1px 1px #111; + } + } } diff --git a/app/assets/stylesheets/themes/ui_basic.scss b/app/assets/stylesheets/themes/ui_basic.scss index 09ff0747470..1f3d3d3d389 100644 --- a/app/assets/stylesheets/themes/ui_basic.scss +++ b/app/assets/stylesheets/themes/ui_basic.scss @@ -15,4 +15,22 @@ color: $blue_link; } } + + .app_logo { + .separator { + margin-left: 0; + margin-right: 0; + } + } + + .separator { + float: left; + height: 60px; + width: 1px; + background: white; + border-left: 1px solid #DDD; + margin-top: -10px; + margin-left: 10px; + margin-right: 10px; + } } diff --git a/app/assets/stylesheets/themes/ui_color.scss b/app/assets/stylesheets/themes/ui_color.scss index 4497892daa7..8c60fabb3a7 100644 --- a/app/assets/stylesheets/themes/ui_color.scss +++ b/app/assets/stylesheets/themes/ui_color.scss @@ -8,61 +8,16 @@ * */ .ui_color { - /* * Application Header * */ header { - + @extend .header-dark; &.navbar-gitlab { .navbar-inner { background: #657; - border-bottom: 1px solid #AAA; - - .nav > li > a { - color: #fff; - text-shadow: 0 1px 0 #111; - } } } - - .search { - float: right; - margin-right: 45px; - .search-input { - border: 1px solid #aaa; - background-color: #D2D5DA; - background-color: rgba(255, 255, 255, 0.5); - - &:focus { - background-color: white; - } - } - } - .search-input::-webkit-input-placeholder { - color: #666; - } - .app_logo { - a { - h1 { - background: url('logo_white.png') no-repeat 0px 2px; - color:#fff; - text-shadow: 0 1px 1px #111; - } - } - .separator { - display:none; - } - - } - .project_name { - color:#fff; - text-shadow: 0 1px 1px #111; - } } - /* - * End of Application Header - * - */ } diff --git a/app/assets/stylesheets/themes/ui_gray.scss b/app/assets/stylesheets/themes/ui_gray.scss index 5ee2b0ddfe3..e80137a69c8 100644 --- a/app/assets/stylesheets/themes/ui_gray.scss +++ b/app/assets/stylesheets/themes/ui_gray.scss @@ -8,61 +8,16 @@ * */ .ui_gray { - /* * Application Header * */ header { - + @extend .header-dark; &.navbar-gitlab { .navbar-inner { background: #708090; - border-bottom: 1px solid #AAA; - - .nav > li > a { - color: #fff; - text-shadow: 0 1px 0 #111; - } } } - - .search { - float: right; - margin-right: 45px; - .search-input { - border: 1px solid #aaa; - background-color: #D2D5DA; - background-color: rgba(255, 255, 255, 0.5); - - &:focus { - background-color: white; - } - } - } - .search-input::-webkit-input-placeholder { - color: #666; - } - .app_logo { - a { - h1 { - background: url('logo_white.png') no-repeat 0px 2px; - color:#fff; - text-shadow: 0 1px 1px #111; - } - } - .separator { - display:none; - } - - } - .project_name { - color:#fff; - text-shadow: 0 1px 1px #111; - } } - /* - * End of Application Header - * - */ } diff --git a/app/assets/stylesheets/themes/ui_modern.scss b/app/assets/stylesheets/themes/ui_modern.scss index 0bb14cdd7d7..32b5ad7d968 100644 --- a/app/assets/stylesheets/themes/ui_modern.scss +++ b/app/assets/stylesheets/themes/ui_modern.scss @@ -8,61 +8,16 @@ * */ .ui_modern { - /* * Application Header * */ header { - + @extend .header-dark; &.navbar-gitlab { .navbar-inner { background: #567; - border-bottom: 1px solid #AAA; - - .nav > li > a { - color: #fff; - text-shadow: 0 1px 0 #111; - } } } - - .search { - float: right; - margin-right: 45px; - .search-input { - border: 1px solid #aaa; - background-color: #D2D5DA; - background-color: rgba(255, 255, 255, 0.5); - - &:focus { - background-color: white; - } - } - } - .search-input::-webkit-input-placeholder { - color: #666; - } - .app_logo { - a { - h1 { - background: url('logo_white.png') no-repeat 0px 2px; - color:#fff; - text-shadow: 0 1px 1px #111; - } - } - .separator { - display:none; - } - - } - .project_name { - color:#fff; - text-shadow: 0 1px 1px #111; - } } - /* - * End of Application Header - * - */ } diff --git a/app/views/layouts/_head_panel.html.haml b/app/views/layouts/_head_panel.html.haml index dd7cba22884..38e1d7f0597 100644 --- a/app/views/layouts/_head_panel.html.haml +++ b/app/views/layouts/_head_panel.html.haml @@ -9,14 +9,16 @@ %ul.nav - if current_user.is_admin? %li - = link_to admin_root_path, title: "Admin area" do - %i.icon-cog - Admin + = link_to admin_root_path, title: "Admin area", class: 'has_bottom_tooltip', 'data-original-title' => 'Admin area' do + %i.icon-cogs - if current_user.can_create_project? %li - = link_to new_project_path, title: "Create New Project" do + = link_to new_project_path, title: "Create New Project", class: 'has_bottom_tooltip', 'data-original-title' => 'New project' do %i.icon-plus - Project + %li + = link_to profile_path, title: "Your Profile", class: 'has_bottom_tooltip', 'data-original-title' => 'Your profile' do + %i.icon-user + %span.separator %li = render "layouts/search" %li