Andreas/tracks
1
0
Fork 0
mirror of https://github.com/TracksApp/tracks.git synced 2025-12-18 16:20:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #1993 from dnrce/nav-redesign

Browse source 
Update the navbar design
This commit is contained in:
Matt Rogers 2016-05-17 20:17:35 -05:00
commit 018d901b4d
13 changed files with 99 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

1
Gemfile
View file

@ -45,6 +45,7 @@ gem 'bcrypt', '~> 3.1.7'
# gem 'jbuilder', '~> 1.2' # gem 'jbuilder', '~> 1.2'
gem "bootstrap-sass", "3.3.3" gem "bootstrap-sass", "3.3.3"
gem "font-awesome-sass", "~> 4.5.0"
group :development do group :development do
gem "spring" gem "spring"

3
Gemfile.lock
View file

@ -98,6 +98,8 @@ GEM
factory_girl (~> 4.5.0) factory_girl (~> 4.5.0)
railties (>= 3.0.0) railties (>= 3.0.0)
ffi (1.9.6) ffi (1.9.6)
font-awesome-sass (4.5.0)
sass (>= 3.2)
gherkin (2.12.2) gherkin (2.12.2)
multi_json (~> 1.3) multi_json (~> 1.3)
hike (1.2.3) hike (1.2.3)
@ -251,6 +253,7 @@ DEPENDENCIES
cucumber-rails cucumber-rails
database_cleaner database_cleaner
factory_girl_rails factory_girl_rails
font-awesome-sass (~> 4.5.0)
htmlentities htmlentities
jquery-rails jquery-rails
jquery-ui-rails jquery-ui-rails

BIN
app/assets/images/system-search.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 935 B

2
app/assets/stylesheets/application.css.scss
View file

@ -18,6 +18,8 @@
@import "jquery-ui/dialog"; @import "jquery-ui/dialog";
@import "jquery-ui/sortable"; @import "jquery-ui/sortable";
@import "icons";
.legacy-ui { .legacy-ui {
@import "../../../vendor/assets/stylesheets/superfish-navbar"; @import "../../../vendor/assets/stylesheets/superfish-navbar";
@import "../../../vendor/assets/stylesheets/superfish-vertical"; @import "../../../vendor/assets/stylesheets/superfish-vertical";

2
app/assets/stylesheets/icons.scss Normal file
View file

@ -0,0 +1,2 @@
@import "font-awesome-sprockets";
@import "font-awesome";

4
app/assets/stylesheets/tracks.css.scss
View file

@ -9,6 +9,10 @@
height:26px; height:26px;
border-radius: 2px; border-radius: 2px;
} }
.fa {
line-height: inherit;
}
} }
.footer { .footer {

4
app/helpers/application_helper.rb
View file

@ -22,10 +22,6 @@ module ApplicationHelper
{:class => "container_toggle", :id => id} ) {:class => "container_toggle", :id => id} )
end end
def navigation_link(name, options = {}, html_options = nil, *parameters_for_method_reference)
link_to name, options, html_options
end
# Check due date in comparison to today's date Flag up date appropriately with # Check due date in comparison to today's date Flag up date appropriately with
# a 'traffic light' colour code # a 'traffic light' colour code
# #

15
app/helpers/icon_helper.rb Normal file
View file

@ -0,0 +1,15 @@
module IconHelper
include FontAwesome::Sass::Rails::ViewHelpers
def icon_fw(icon, text = nil, html_options = {})
text, html_options = nil, text if text.is_a?(Hash)
if html_options.key?(:class)
html_options[:class] = "fa-fw #{html_options[:class]}"
else
html_options[:class] = "fa-fw"
end
icon(icon, text, html_options)
end
end

66
app/views/shared/_navbar.html.erb
View file

@ -11,24 +11,24 @@
<% if @count -%> <% if @count -%>
<span id="badge_count" class="badge"><%= @count %></span> <span id="badge_count" class="badge"><%= @count %></span>
<% end -%> <% end -%>
<%= l(Time.zone.today, :format => current_user.prefs.title_date_format) %> <%= content_tag :span, l(Time.zone.today, format: current_user.prefs.title_date_format), class: 'visible-lg-inline' %>
</div> </div>
</div> </div>
<div id="navbar" class="navbar-collapse collapse"> <div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
<li><%= navigation_link(t('layouts.navigation.home'), root_path, {:accesskey => "t", :title => t('layouts.navigation.home_title')} ) %></li> <li><%= link_to t('layouts.navigation.home'), root_path, accesskey: 't', title: t('layouts.navigation.home_title') %></li>
<li><%= navigation_link(t('layouts.navigation.starred'), tag_path("starred"), :title => t('layouts.navigation.starred_title')) %></li> <li><%= link_to t('layouts.navigation.starred'), tag_path('starred'), title: t('layouts.navigation.starred_title') %></li>
<li><%= navigation_link(t('common.projects'), projects_path, {:accesskey=>"p", :title=>t('layouts.navigation.projects_title')} ) %></li> <li><%= link_to t('common.projects'), projects_path, accesskey: 'p', title: t('layouts.navigation.projects_title') %></li>
<li><%= navigation_link(t('layouts.navigation.tickler'), tickler_path, {:accesskey =>"k", :title => t('layouts.navigation.tickler_title')} ) %></li> <li><%= link_to t('layouts.navigation.tickler'), tickler_path, accesskey: 'k', title: t('layouts.navigation.tickler_title') %></li>
<li class="dropdown"> <li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<%= t('layouts.navigation.organize') %> <span class="caret"></span> <%= t('layouts.navigation.organize') %> <span class="caret"></span>
</a> </a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><%= navigation_link( t('common.contexts'), contexts_path, {:accesskey=>"c", :title=>t('layouts.navigation.contexts_title')} ) %></li> <li><%= link_to t('common.contexts'), contexts_path, accesskey: 'c', title: t('layouts.navigation.contexts_title') %></li>
<li><%= navigation_link( t('common.notes'), notes_path, {:accesskey => "o", :title => t('layouts.navigation.notes_title')} ) %></li> <li><%= link_to t('common.notes'), notes_path, accesskey: 'o', title: t('layouts.navigation.notes_title') %></li>
<li><%= navigation_link( t('common.review'), review_path, {:accesskey => "r", :title => t('layouts.navigation.review_title')} ) %></li> <li><%= link_to t('common.review'), review_path, accesskey: 'r', title: t('layouts.navigation.review_title') %></li>
<li><%= navigation_link( t('layouts.navigation.recurring_todos'), {:controller => "recurring_todos", :action => "index"}, :title => t('layouts.navigation.recurring_todos_title')) %></li> <li><%= link_to t('layouts.navigation.recurring_todos'), controller: 'recurring_todos', action: 'index', title: t('layouts.navigation.recurring_todos_title') %></li>
</ul> </ul>
</li> </li>
<li class="dropdown"> <li class="dropdown">
@ -36,29 +36,16 @@
<%= t('layouts.navigation.view') %> <span class="caret"></span> <%= t('layouts.navigation.view') %> <span class="caret"></span>
</a> </a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><%= navigation_link( t('layouts.navigation.calendar'), calendar_path, :title => t('layouts.navigation.calendar_title')) %></li> <li><%= link_to t('layouts.navigation.calendar'), calendar_path, title: t('layouts.navigation.calendar_title') %></li>
<li><%= navigation_link( t('layouts.navigation.completed_tasks'), done_overview_path, {:accesskey=>"d", :title=>t('layouts.navigation.completed_tasks_title')} ) %></li> <li><%= link_to t('layouts.navigation.completed_tasks'), done_overview_path, accesskey: 'd', title: t('layouts.navigation.completed_tasks_title') %></li>
<li><%= navigation_link( t('layouts.navigation.feeds'), feeds_path, :title => t('layouts.navigation.feeds_title')) %></li> <li><%= link_to t('layouts.navigation.feeds'), feeds_path, title: t('layouts.navigation.feeds_title') %></li>
<li><%= navigation_link( t('layouts.navigation.stats'), stats_path, :title => t('layouts.navigation.stats_title')) %></li> <li><%= link_to t('layouts.navigation.stats'), stats_path, title: t('layouts.navigation.stats_title') %></li>
<li class="divider"></li> <li class="divider"></li>
<li id="menu_view_toggle_contexts"><%= link_to(t('layouts.toggle_contexts'), "#", {:title => t('layouts.toggle_contexts_title'), :id => "toggle-contexts-nav"}) %></li> <li id="menu_view_toggle_contexts"><%= link_to(t('layouts.toggle_contexts'), "#", {:title => t('layouts.toggle_contexts_title'), :id => "toggle-contexts-nav"}) %></li>
<li><%= link_to(t('layouts.toggle_notes'), "#", {:accesskey => "S", :title => t('layouts.toggle_notes_title'), :id => "toggle-notes-nav"}) %></li> <li><%= link_to(t('layouts.toggle_notes'), "#", {:accesskey => "S", :title => t('layouts.toggle_notes_title'), :id => "toggle-notes-nav"}) %></li>
<%= group_view_by_menu_entry %> <%= group_view_by_menu_entry %>
</ul> </ul>
</li> </li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<%= t('layouts.navigation.admin') %> <span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><%= navigation_link( t('layouts.navigation.preferences'), preferences_path, {:accesskey => "u", :title => t('layouts.navigation.preferences_title')} ) %></li>
<li><%= navigation_link( t('layouts.navigation.export'), data_path, {:accesskey => "e", :title => t('layouts.navigation.export_title')} ) %></li>
<li><%= navigation_link( t('layouts.navigation.import'), import_data_path, {:accesskey => "i", :title => t('layouts.navigation.import_title')} ) %></li>
<% if current_user.is_admin? -%>
<li><%= navigation_link(t('layouts.navigation.manage_users'), users_path, {:accesskey => "a", :title => t('layouts.navigation.manage_users_title')} ) %></li>
<% end -%>
</ul>
</li>
<li class="dropdown"> <li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<%= t('layouts.navigation.help') %> <span class="caret"></span> <%= t('layouts.navigation.help') %> <span class="caret"></span>
@ -68,11 +55,32 @@
<li><%= link_to t('layouts.navigation.api_docs'), rest_api_docs_path %></li> <li><%= link_to t('layouts.navigation.api_docs'), rest_api_docs_path %></li>
</ul> </ul>
</li> </li>
<li><%= navigation_link(image_tag("system-search.png", :size => "16X16", :border => 0), search_path, :title => t('layouts.navigation.search')) %></li> <li>
<%= link_to search_path, title: t('layouts.navigation.search') do %>
<%= icon('search', class: 'hidden-xs') %>
<%= content_tag :span, t('layouts.navigation.search'), class: 'visible-xs-inline' %>
<% end %>
</li>
</ul> </ul>
<ul class="nav navbar-nav navbar-right"> <ul class="nav navbar-nav navbar-right">
<li> <li class="dropdown">
<%= link_to("#{t('common.logout')} (#{current_user.display_name}) &raquo;".html_safe, logout_path) %> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<%= icon('cog', class: 'hidden-xs') %>
<%= content_tag :span, t('layouts.navigation.options'), class: 'visible-xs-inline' %>
</a>
<ul class="dropdown-menu">
<li><%= link_to icon_fw('sign-out', t('common.logout')), logout_path %></li>
<li class="divider"></li>
<li class="dropdown-header"><%= current_user.display_name %></li>
<li><%= link_to icon_fw('wrench', t('layouts.navigation.preferences')), preferences_path, accesskey: 'u', title: t('layouts.navigation.preferences_title') %></li>
<li><%= link_to icon_fw('download', t('layouts.navigation.export')), data_path, accesskey: 'e', title: t('layouts.navigation.export_title') %></li>
<li><%= link_to icon_fw('upload', t('layouts.navigation.import')), import_data_path, accesskey: 'i', title: t('layouts.navigation.import_title') %></li>
<% if current_user.is_admin? %>
<li class="divider"></li>
<li class="dropdown-header"><%= t('layouts.navigation.admin') %></li>
<li><%= link_to icon_fw('users', t('layouts.navigation.manage_users')), users_path, accesskey: 'a', title: t('layouts.navigation.manage_users_title') %></li>
<% end %>
</ul>
</li> </li>
</ul> </ul>
</div> </div>

1
config/locales/en.yml
View file

@ -428,6 +428,7 @@ en:
show_empty_containers_project: "Show empty projects" show_empty_containers_project: "Show empty projects"
show_empty_containers_context: "Show empty contexts" show_empty_containers_context: "Show empty contexts"
show_empty_containers_title: "Show or hide the empty projects or contexts" show_empty_containers_title: "Show or hide the empty projects or contexts"
options: Options
footer: footer:
send_feedback: Send feedback on %{version} send_feedback: Send feedback on %{version}
sidebar: sidebar:

34
features/logging_in.feature
View file

@ -31,24 +31,24 @@ Feature: Existing user logging in
Examples: Examples:
| page | next page | logout | | page | next page | logout |
| home page | home page | Logout (Test User) | | home page | home page | Logout |
| contexts page | contexts page | Logout (Test User) | | contexts page | contexts page | Logout |
| projects page | projects page | Logout (Test User) | | projects page | projects page | Logout |
| notes page | notes page | Logout (Test User) | | notes page | notes page | Logout |
| recurring todos page | recurring todos page | Logout (Test User) | | recurring todos page | recurring todos page | Logout |
| statistics page | statistics page | Logout (Test User) | | statistics page | statistics page | Logout |
| manage users page | manage users page | 401 Unauthorized | | manage users page | manage users page | 401 Unauthorized |
| integrations page | integrations page | Logout (Test User) | | integrations page | integrations page | Logout |
| starred page | starred page | Logout (Test User) | | starred page | starred page | Logout |
| tickler page | tickler page | Logout (Test User) | | tickler page | tickler page | Logout |
| calendar page | calendar page | Logout (Test User) | | calendar page | calendar page | Logout |
| feeds page | feeds page | Logout (Test User) | | feeds page | feeds page | Logout |
| preference page | preference page | Logout (Test User) | | preference page | preference page | Logout |
| export page | export page | Logout (Test User) | | export page | export page | Logout |
| rest api docs page | rest api docs page | Logout (Test User) | | rest api docs page | rest api docs page | Logout |
| search page | search page | Logout (Test User) | | search page | search page | Logout |
| "top secret" project for user "testuser" | "top secret" project for user "testuser" | Logout (Test User) | | "top secret" project for user "testuser" | "top secret" project for user "testuser" | Logout |
| context page for "@secret location" for user "testuser" | context page for "@secret location" for user "testuser" | Logout (Test User) | | context page for "@secret location" for user "testuser" | context page for "@secret location" for user "testuser" | Logout |
@javascript @javascript
Scenario: When session expires, you should be logged out Scenario: When session expires, you should be logged out

4
features/preferences.feature
View file

@ -36,6 +36,6 @@ Feature: Manage preferences
Scenario: I can edit preferences Scenario: I can edit preferences
When I go to the preferences page When I go to the preferences page
Then I should see "Logout (testuser)" Then I should see "testuser Preferences"
When I edit my last name to "Tester" When I edit my last name to "Tester"
Then I should see "Logout (Tester)" Then I should see "Tester Preferences"

13
test/helpers/icon_helper_test.rb Normal file
View file

@ -0,0 +1,13 @@
require 'test_helper'
class IconHelperTest < ActionView::TestCase
include IconHelper
test 'icon_fw generates fixed-width class' do
assert_equal '<i class="fa fa-gear fa-fw"></i>', icon_fw('gear')
end
test 'icon_fw accepts an additional class' do
assert_equal '<i class="fa fa-gear fa-fw myclass"></i>', icon_fw('gear', class: 'myclass')
end
end