Commit 031ae7756e11f3aa3c53b81b408abdd762eef42a
1 parent
51f174b9
Exists in
master
and in
4 other branches
Refactored navigation
Showing
9 changed files
with
152 additions
and
72 deletions
Show diff stats
app/assets/images/ajax_loader.gif
app/assets/stylesheets/header.scss
| ... | ... | @@ -74,7 +74,7 @@ header { |
| 74 | 74 | font-size:24px; |
| 75 | 75 | line-height:36px; |
| 76 | 76 | font-weight:500; |
| 77 | - color:#567; | |
| 77 | + color:$style_color; | |
| 78 | 78 | text-shadow: 0 1px 1px #FFF; |
| 79 | 79 | } |
| 80 | 80 | |
| ... | ... | @@ -82,7 +82,9 @@ header { |
| 82 | 82 | float: right; |
| 83 | 83 | margin-right:10px; |
| 84 | 84 | .btn { |
| 85 | - margin-left:8px; | |
| 85 | + margin-left:7px; | |
| 86 | + background: #F1F1F1; | |
| 87 | + border: 1px solid #CCC; | |
| 86 | 88 | } |
| 87 | 89 | } |
| 88 | 90 | |
| ... | ... | @@ -96,8 +98,8 @@ header { |
| 96 | 98 | float: right; |
| 97 | 99 | margin-right: 55px; |
| 98 | 100 | |
| 99 | - .search-input { | |
| 100 | - width:130px; | |
| 101 | + .search-input { | |
| 102 | + @extend .span2; | |
| 101 | 103 | background-image: url("icon-search.png"); |
| 102 | 104 | background-repeat: no-repeat; |
| 103 | 105 | background-position: 10px; | ... | ... |
app/assets/stylesheets/nav.scss
| ... | ... | @@ -2,7 +2,7 @@ |
| 2 | 2 | * Main Menu of Application |
| 3 | 3 | * |
| 4 | 4 | */ |
| 5 | -nav.main_menu { | |
| 5 | +ul.main_menu { | |
| 6 | 6 | border-radius: 4px; |
| 7 | 7 | margin: auto; |
| 8 | 8 | margin:30px 0; |
| ... | ... | @@ -13,9 +13,7 @@ nav.main_menu { |
| 13 | 13 | background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf); |
| 14 | 14 | background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf); |
| 15 | 15 | background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf); |
| 16 | - display:table; | |
| 17 | - table-layout:fixed; | |
| 18 | - width:100%; | |
| 16 | + position:relative; | |
| 19 | 17 | @include shade; |
| 20 | 18 | .count { |
| 21 | 19 | position: relative; |
| ... | ... | @@ -39,10 +37,14 @@ nav.main_menu { |
| 39 | 37 | text-shadow:none; |
| 40 | 38 | color:$style_color; |
| 41 | 39 | } |
| 42 | - a { | |
| 43 | - display:table-cell; | |
| 44 | - text-align:center; | |
| 45 | - font-weight:bold; | |
| 40 | + li { | |
| 41 | + list-style-type: none; | |
| 42 | + margin: 0; | |
| 43 | + display: table-cell; | |
| 44 | + width: 1%; | |
| 45 | + border-right: 1px solid #DDD; | |
| 46 | + border-left: 1px solid #EEE; | |
| 47 | + | |
| 46 | 48 | &:first-child{ |
| 47 | 49 | -webkit-border-top-left-radius: 4px; |
| 48 | 50 | -webkit-border-bottom-left-radius: 4px; |
| ... | ... | @@ -52,22 +54,7 @@ nav.main_menu { |
| 52 | 54 | border-bottom-left-radius: 4px; |
| 53 | 55 | border-left: 0; |
| 54 | 56 | } |
| 55 | - padding: 9px 2px; | |
| 56 | - color: $style_color; | |
| 57 | - position: relative; | |
| 58 | - margin: 0; | |
| 59 | - text-shadow:0 1px 1px white; | |
| 60 | - border-right: 1px solid #DDD; | |
| 61 | - border-left: 1px solid #EEE; | |
| 62 | 57 | |
| 63 | - &.home { | |
| 64 | - background: url(home_icon.PNG) no-repeat center center; | |
| 65 | - text-indent:-9999px; | |
| 66 | - img { | |
| 67 | - position:relative; | |
| 68 | - top:4px; | |
| 69 | - } | |
| 70 | - } | |
| 71 | 58 | &.current { |
| 72 | 59 | background-color:#D5D5D5; |
| 73 | 60 | border-bottom: 1px solid #567; |
| ... | ... | @@ -80,11 +67,28 @@ nav.main_menu { |
| 80 | 67 | } |
| 81 | 68 | } |
| 82 | 69 | |
| 83 | - &.wide { | |
| 84 | - width:185px; | |
| 85 | - @media (min-width: 1080px) and (max-width: 1200px) { width:160px; } | |
| 70 | + &.home { | |
| 71 | + a { | |
| 72 | + background: url(home_icon.PNG) no-repeat center center; | |
| 73 | + text-indent:-9999px; | |
| 74 | + min-width:20px; | |
| 75 | + img { | |
| 76 | + position:relative; | |
| 77 | + top:4px; | |
| 78 | + } | |
| 79 | + } | |
| 86 | 80 | } |
| 87 | 81 | } |
| 82 | + a { | |
| 83 | + display: block; | |
| 84 | + text-align: center; | |
| 85 | + font-weight:bold; | |
| 86 | + height:35px; | |
| 87 | + line-height:36px; | |
| 88 | + color: $style_color; | |
| 89 | + text-shadow:0 1px 1px white; | |
| 90 | + | |
| 91 | + } | |
| 88 | 92 | } |
| 89 | 93 | /* |
| 90 | 94 | * End of Main Menu | ... | ... |
app/assets/stylesheets/themes/ui_modern.scss
| ... | ... | @@ -9,19 +9,21 @@ |
| 9 | 9 | * |
| 10 | 10 | */ |
| 11 | 11 | .ui_modern { |
| 12 | - nav.main_menu { | |
| 12 | + ul.main_menu { | |
| 13 | 13 | background:none; |
| 14 | 14 | box-shadow:none; |
| 15 | 15 | @include border-radius(0px); |
| 16 | 16 | border:none; |
| 17 | 17 | border-bottom:2px solid #456; |
| 18 | 18 | |
| 19 | - a { | |
| 19 | + li { | |
| 20 | 20 | border:none; |
| 21 | 21 | |
| 22 | 22 | &.current { |
| 23 | 23 | border-bottom:2px solid #f90; |
| 24 | 24 | background-color:#fff; |
| 25 | + position:relative; | |
| 26 | + top:1px; | |
| 25 | 27 | } |
| 26 | 28 | } |
| 27 | 29 | } | ... | ... |
app/helpers/application_helper.rb
| ... | ... | @@ -96,4 +96,41 @@ module ApplicationHelper |
| 96 | 96 | event.project && |
| 97 | 97 | event.project.merge_requests_enabled |
| 98 | 98 | end |
| 99 | + | |
| 100 | + def tab_class(tab_key) | |
| 101 | + active = case tab_key | |
| 102 | + | |
| 103 | + # Project Area | |
| 104 | + when :wall; wall_tab? | |
| 105 | + when :wiki; controller.controller_name == "wikis" | |
| 106 | + when :issues; issues_tab? | |
| 107 | + when :network; current_page?(:controller => "projects", :action => "graph", :id => @project) | |
| 108 | + when :merge_requests; controller.controller_name == "merge_requests" | |
| 109 | + | |
| 110 | + # Dashboard Area | |
| 111 | + when :help; controller.controller_name == "help" | |
| 112 | + when :search; current_page?(search_path) | |
| 113 | + when :dash_issues; current_page?(dashboard_issues_path) | |
| 114 | + when :dash_mr; current_page?(dashboard_merge_requests_path) | |
| 115 | + when :root; current_page?(dashboard_path) || current_page?(root_path) | |
| 116 | + | |
| 117 | + # Profile Area | |
| 118 | + when :profile; current_page?(:controller => "profile", :action => :show) | |
| 119 | + when :password; current_page?(:controller => "profile", :action => :password) | |
| 120 | + when :token; current_page?(:controller => "profile", :action => :token) | |
| 121 | + when :design; current_page?(:controller => "profile", :action => :design) | |
| 122 | + when :ssh_keys; controller.controller_name == "keys" | |
| 123 | + | |
| 124 | + # Admin Area | |
| 125 | + when :admin_root; controller.controller_name == "dashboard" | |
| 126 | + when :admin_users; controller.controller_name == 'users' | |
| 127 | + when :admin_projects; controller.controller_name == "projects" | |
| 128 | + when :admin_emails; controller.controller_name == 'mailer' | |
| 129 | + when :admin_resque; controller.controller_name == 'resque' | |
| 130 | + | |
| 131 | + else | |
| 132 | + false | |
| 133 | + end | |
| 134 | + active ? "current" : nil | |
| 135 | + end | |
| 99 | 136 | end | ... | ... |
app/views/layouts/_app_menu.html.haml
| 1 | -%nav.main_menu | |
| 2 | - = link_to "Home", root_path, :class => "home #{"current" if current_page?(dashboard_path) || current_page?(root_path)}", :title => "Home" | |
| 3 | - = link_to dashboard_issues_path, :class => "#{"current" if current_page?(dashboard_issues_path)}", :id => "issues_slide" do | |
| 4 | - Issues | |
| 5 | - %span.count= current_user.assigned_issues.opened.count | |
| 6 | - = link_to dashboard_merge_requests_path, :class => "#{"current" if current_page?(dashboard_merge_requests_path)}", :id => "merge_requests_slide" do | |
| 7 | - Requests | |
| 8 | - %span.count= current_user.cared_merge_requests.count | |
| 9 | - = link_to search_path, :class => "#{"current" if current_page?(search_path)}" do | |
| 10 | - Search | |
| 11 | - = link_to "Help", help_path, :class => "#{"current" if controller.controller_name == "help"}" | |
| 1 | +%ul.main_menu | |
| 2 | + %li.home{:class => tab_class(:root)} | |
| 3 | + = link_to "Home", root_path, :title => "Home" | |
| 4 | + | |
| 5 | + %li{:class => tab_class(:dash_issues)} | |
| 6 | + = link_to dashboard_issues_path do | |
| 7 | + Issues | |
| 8 | + %span.count= current_user.assigned_issues.opened.count | |
| 9 | + | |
| 10 | + %li{:class => tab_class(:dash_mr)} | |
| 11 | + = link_to dashboard_merge_requests_path do | |
| 12 | + Merge Requests | |
| 13 | + %span.count= current_user.cared_merge_requests.count | |
| 14 | + | |
| 15 | + %li{:class => tab_class(:search)} | |
| 16 | + = link_to "Search", search_path | |
| 17 | + | |
| 18 | + %li{:class => tab_class(:help)} | |
| 19 | + = link_to "Help", help_path | ... | ... |
app/views/layouts/_project_menu.html.haml
| 1 | -%nav.main_menu | |
| 2 | - = link_to @project.code, project_path(@project), :class => "home #{project_tab_class}", :title => "Project" | |
| 1 | +%ul.main_menu | |
| 2 | + %li.home{:class => project_tab_class} | |
| 3 | + = link_to @project.code, project_path(@project), :title => "Project" | |
| 4 | + | |
| 3 | 5 | - if @project.repo_exists? |
| 4 | 6 | - if can? current_user, :download_code, @project |
| 5 | - = link_to tree_project_ref_path(@project, @project.root_ref), :class => tree_tab_class do | |
| 6 | - Files | |
| 7 | - = link_to "Commits", project_commits_path(@project), :class => commit_tab_class | |
| 7 | + %li{:class => tree_tab_class} | |
| 8 | + = link_to tree_project_ref_path(@project, @project.root_ref) do | |
| 9 | + Files | |
| 10 | + %li{:class => commit_tab_class} | |
| 11 | + = link_to "Commits", project_commits_path(@project) | |
| 12 | + | |
| 13 | + %li{:class => tab_class(:network)} | |
| 14 | + = link_to "Network", graph_project_path(@project) | |
| 8 | 15 | |
| 9 | - = link_to "Network", graph_project_path(@project), :class => current_page?(:controller => "projects", :action => "graph", :id => @project) ? "current" : nil | |
| 10 | 16 | - if @project.issues_enabled |
| 11 | - = link_to project_issues_filter_path(@project), :class => issues_tab? ? "current" : nil do | |
| 12 | - Issues | |
| 13 | - %span.count= @project.issues.opened.count | |
| 17 | + %li{:class => tab_class(:issues)} | |
| 18 | + = link_to project_issues_filter_path(@project) do | |
| 19 | + Issues | |
| 20 | + %span.count= @project.issues.opened.count | |
| 21 | + | |
| 14 | 22 | - if @project.merge_requests_enabled |
| 15 | - = link_to project_merge_requests_path(@project), :class => (controller.controller_name == "merge_requests") ? "current wide" : "wide" do | |
| 16 | - Merge Requests | |
| 17 | - %span.count= @project.merge_requests.opened.count | |
| 23 | + %li{:class => tab_class(:merge_requests)} | |
| 24 | + = link_to project_merge_requests_path(@project) do | |
| 25 | + Merge Requests | |
| 26 | + %span.count= @project.merge_requests.opened.count | |
| 18 | 27 | |
| 19 | 28 | - if @project.wall_enabled |
| 20 | - = link_to wall_project_path(@project), :class => wall_tab? ? "current" : nil do | |
| 21 | - Wall | |
| 29 | + %li{:class => tab_class(:wall)} | |
| 30 | + = link_to wall_project_path(@project) do | |
| 31 | + Wall | |
| 22 | 32 | |
| 23 | 33 | - if @project.wiki_enabled |
| 24 | - = link_to project_wiki_path(@project, :index), :class => (controller.controller_name == "wikis") ? "current" : nil do | |
| 25 | - Wiki | |
| 34 | + %li{:class => tab_class(:wiki)} | |
| 35 | + = link_to project_wiki_path(@project, :index) do | |
| 36 | + Wiki | ... | ... |
app/views/layouts/admin.html.haml
| ... | ... | @@ -5,11 +5,16 @@ |
| 5 | 5 | = render "layouts/flash" |
| 6 | 6 | = render "layouts/head_panel", :title => "Admin area" |
| 7 | 7 | .container |
| 8 | - %nav.main_menu | |
| 9 | - = link_to "Stats", admin_root_path, :class => "home #{'current' if controller.controller_name == "dashboard"}" | |
| 10 | - = link_to "Projects", admin_projects_path, :class => ('current' if controller.controller_name == "projects") | |
| 11 | - = link_to "Users", admin_users_path, :class => ('current' if controller.controller_name == 'users') | |
| 12 | - = link_to "Emails", admin_emails_path, :class => ('current' if controller.controller_name == 'mailer') | |
| 13 | - = link_to "Resque", admin_resque_path, :class => ('current' if controller.controller_name == 'resque') | |
| 8 | + %ul.main_menu | |
| 9 | + %li.home{:class => tab_class(:admin_root)} | |
| 10 | + = link_to "Stats", admin_root_path | |
| 11 | + %li{:class => tab_class(:admin_projects)} | |
| 12 | + = link_to "Projects", admin_projects_path | |
| 13 | + %li{:class => tab_class(:admin_users)} | |
| 14 | + = link_to "Users", admin_users_path | |
| 15 | + %li{:class => tab_class(:admin_emails)} | |
| 16 | + = link_to "Emails", admin_emails_path | |
| 17 | + %li{:class => tab_class(:admin_resque)} | |
| 18 | + = link_to "Resque", admin_resque_path | |
| 14 | 19 | |
| 15 | 20 | .content= yield | ... | ... |
app/views/layouts/profile.html.haml
| ... | ... | @@ -5,12 +5,23 @@ |
| 5 | 5 | = render "layouts/flash" |
| 6 | 6 | = render "layouts/head_panel", :title => "Profile" |
| 7 | 7 | .container |
| 8 | - %nav.main_menu | |
| 9 | - = link_to "Profile", profile_path, :class => "home #{current_page?(:controller => "profile", :action => :show) ? "current" : nil}" | |
| 10 | - = link_to "Password", profile_password_path, :class => current_page?(:controller => "profile", :action => :password) ? "current" : nil | |
| 11 | - = link_to "Token", profile_token_path, :class => current_page?(:controller => "profile", :action => :token) ? "current" : nil | |
| 12 | - = link_to "Design", profile_design_path, :class => current_page?(:controller => "profile", :action => :design) ? "current" : nil | |
| 13 | - = link_to keys_path, :class => controller.controller_name == "keys" ? "current" : nil do | |
| 14 | - SSH Keys | |
| 8 | + %ul.main_menu | |
| 9 | + %li.home{:class => tab_class(:profile)} | |
| 10 | + = link_to "Profile", profile_path | |
| 11 | + | |
| 12 | + %li{:class => tab_class(:password)} | |
| 13 | + = link_to "Password", profile_password_path | |
| 14 | + | |
| 15 | + %li{:class => tab_class(:token)} | |
| 16 | + = link_to "Token", profile_token_path | |
| 17 | + | |
| 18 | + %li{:class => tab_class(:design)} | |
| 19 | + = link_to "Design", profile_design_path | |
| 20 | + | |
| 21 | + %li{:class => tab_class(:ssh_keys)} | |
| 22 | + = link_to keys_path do | |
| 23 | + SSH Keys | |
| 24 | + %span.count= current_user.keys.count | |
| 25 | + | |
| 15 | 26 | .content |
| 16 | 27 | = yield | ... | ... |