Commit 031ae7756e11f3aa3c53b81b408abdd762eef42a

Authored by Dmitriy Zaporozhets
1 parent 51f174b9

Refactored navigation

app/assets/images/ajax_loader.gif

7.37 KB | W: | H:

7.74 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
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
... ...