Commit 8e7fe1a5e88ad525a33ee884a62a2934a8552271
1 parent
894e8962
Exists in
master
and in
29 other branches
Improved layout for categories selection
(ActionItem2928)
Showing
4 changed files
with
19 additions
and
20 deletions
Show diff stats
app/helpers/categories_helper.rb
... | ... | @@ -50,7 +50,10 @@ module CategoriesHelper |
50 | 50 | |
51 | 51 | #FIXME make this test |
52 | 52 | def selected_category_link(cat) |
53 | - link_to_function(cat.full_name, nil, :id => "remove-selected-category-#{cat.id}-button", :class => 'select-subcategory-link') {|page| page["selected-category-#{cat.id}"].remove} | |
53 | + content_tag('div', button_to_function_without_text(:remove, _('Remove'), nil) {|page| page["selected-category-#{cat.id}"].remove} + | |
54 | + link_to_function(cat.full_name(' → '), nil, :id => "remove-selected-category-#{cat.id}-button", :class => 'select-subcategory-link') {|page| page["selected-category-#{cat.id}"].remove}, | |
55 | + :class => 'selected-category' | |
56 | + ) | |
54 | 57 | end |
55 | 58 | |
56 | 59 | end | ... | ... |
app/views/shared/_select_categories.rhtml
... | ... | @@ -3,7 +3,6 @@ |
3 | 3 | <% categories_for_selection = @categories.select{|i| !@object.respond_to?(:accept_category?) || @object.accept_category?(i)} %> |
4 | 4 | |
5 | 5 | <% if !@current_category.nil? %> |
6 | - <div class="category-helper-label"><%= _('Selected:') %></div> | |
7 | 6 | <%= hidden_field_tag "#{object_name}[#{object_name}_category_id]", @current_category.id unless multiple %> |
8 | 7 | <%= hidden_field_tag "#{object_name}[category_ids][]", @current_category.id if multiple %> |
9 | 8 | <%= button_to_remote_without_text(:back, _('Back'), |
... | ... | @@ -17,14 +16,14 @@ |
17 | 16 | categories.push(@current_category) while @current_category = @current_category.parent |
18 | 17 | %> |
19 | 18 | <%= categories.compact.reverse.map{|i| |
20 | - link_to_remote(i.name, | |
19 | + link_to_remote(i.name, | |
21 | 20 | :update => "select-categories", |
22 | 21 | :url => { :action => 'update_categories', :category_id => i.id, :id => @object }, |
23 | 22 | :loaded => visual_effect(:highlight, "select-categories"), |
24 | 23 | :class => 'select-current-category-link')}.join(' → ') |
25 | 24 | %> |
26 | 25 | <%= button_to_function_without_text(:add, _('Add'), nil, :id => 'save-category-button') do |page| |
27 | - page.insert_html :bottom, 'selected-categories', content_tag('span', | |
26 | + page.insert_html :bottom, 'selected-categories', content_tag('div', | |
28 | 27 | hidden_field_tag("#{object_name}[category_ids][]", categories.first.id) + |
29 | 28 | selected_category_link(categories.first), :id => "selected-category-#{categories.first.id}") |
30 | 29 | end if multiple %> | ... | ... |
app/views/shared/_select_categories_top.rhtml
... | ... | @@ -8,21 +8,19 @@ |
8 | 8 | <%= hidden_field_tag "#{object_name}[category_ids][]", nil %> |
9 | 9 | |
10 | 10 | <div id="category-ajax-selector"> |
11 | -<div id="select-categories"> | |
12 | - <%= render :partial => 'shared/select_categories', :locals => {:object_name => object_name, :multiple => true, :categories_selected => categories_selected }, :layout => false %> | |
13 | -</div> | |
14 | - | |
15 | 11 | <% unless categories_selected.nil? %> |
16 | -<hr> | |
17 | 12 | <div id="selected-categories"> |
18 | - <span class="label"><%= _('Selected categories:') %></span> | |
13 | + <div class="label"><%= _('Selected categories:') %></div> | |
19 | 14 | <% categories_selected.each do |cat| %> |
20 | - <span id="selected-category-<%= cat.id %>"> | |
15 | + <div id="selected-category-<%= cat.id %>"> | |
21 | 16 | <%= hidden_field_tag("#{object_name}[category_ids][]", cat.id) %> |
22 | 17 | <%= selected_category_link(cat) %> |
23 | - </span> | |
18 | + </div> | |
24 | 19 | <% end %> |
25 | 20 | </div> |
26 | -<div style="clear: both;"></div> | |
27 | 21 | <% end %> |
22 | +<div id="select-categories"> | |
23 | + <%= render :partial => 'shared/select_categories', :locals => {:object_name => object_name, :multiple => true, :categories_selected => categories_selected }, :layout => false %> | |
24 | +</div> | |
25 | + | |
28 | 26 | </div> | ... | ... |
public/stylesheets/application.css
... | ... | @@ -360,11 +360,15 @@ div.pending-tasks { |
360 | 360 | #category-ajax-selector a { |
361 | 361 | font-size: 12px; |
362 | 362 | } |
363 | -#selected-categories span { | |
364 | - float: left; | |
363 | +#selected-categories { | |
364 | + padding-bottom: 5px; | |
365 | 365 | } |
366 | 366 | #selected-categories .label { |
367 | 367 | font-weight: bold; |
368 | + margin-bottom: 10px; | |
369 | +} | |
370 | +.selected-category { | |
371 | + padding: 2px 0; | |
368 | 372 | } |
369 | 373 | #category-ajax-selector .box-title { |
370 | 374 | position: absolute; |
... | ... | @@ -398,11 +402,6 @@ div.pending-tasks { |
398 | 402 | top: 4px; |
399 | 403 | right: 2px; |
400 | 404 | } |
401 | -#category-ajax-selector .icon-add { | |
402 | - right: 25px; | |
403 | - display: block; | |
404 | - position: absolute; | |
405 | -} | |
406 | 405 | #profile-header, #profile-footer { |
407 | 406 | clear: both; |
408 | 407 | max-height: 150px; | ... | ... |