Skip to content

Commit

Permalink
Improve behaviour of secondary action lists when wrapping
Browse files Browse the repository at this point in the history 
Based on https://stackoverflow.com/a/31732902 this ensure that when
a secondary action list wraps the additional lines don't start with
an item delimiter by pushing it to the left, outside of a parent nav
element which then hides it.
  • Loading branch information
@tomhughes
tomhughes committed Aug 21, 2021
1 parent 3f8cf32 commit 29e9857
Show file tree
Hide file tree
Showing 10 changed files with 244 additions and 220 deletions.
42 changes: 21 additions & 21 deletions app/assets/stylesheets/common.scss
View file
Expand Up @@ -1474,28 +1474,28 @@ abbr.geo {

/* General styles for action lists / subnavs / pager navs */

ul.secondary-actions {
font-style: normal;
margin-bottom: 0;
margin-left: 0;
padding: 0;
&.pager {
display: inline-block;
margin-right: 60px;
}
> li {
display: block;
float: left;
list-style: none;
border-left: 1px solid $grey;
padding-left: $lineheight/2;
margin-right: $lineheight/2;
&:first-child {
border-left: 0;
padding-left: 0;

nav.secondary-actions {
margin-left: -11px;
overflow: hidden;
> ul {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-bottom: 0;
margin-left: -1px;
padding: 0;
&.pager {
display: inline-block;
margin-right: 60px;
}
&:last-child {
margin-right: 0px;
> li {
flex-basis: auto;
list-style: none;
border-left: 1px solid $grey;
padding-left: $lineheight/2;
margin-right: $lineheight/2;
margin-bottom: $lineheight/8;
}
}
}
Expand Down
22 changes: 12 additions & 10 deletions app/views/dashboards/_contact.html.erb
View file
Expand Up @@ -31,15 +31,17 @@
<% end %>
</p>

<ul class='secondary-actions clearfix text-muted'>
<li><%= link_to t("users.show.send message"), new_message_path(contact) %></li>
<li>
<% if current_user.is_friends_with?(contact) %>
<%= link_to t("users.show.remove as friend"), remove_friend_path(:display_name => contact.display_name, :referer => request.fullpath), :method => :post %>
<% else %>
<%= link_to t("users.show.add as friend"), make_friend_path(:display_name => contact.display_name, :referer => request.fullpath), :method => :post %>
<% end %>
</li>
</ul>
<nav class='secondary-actions'>
<ul class='clearfix text-muted'>
<li><%= link_to t("users.show.send message"), new_message_path(contact) %></li>
<li>
<% if current_user.is_friends_with?(contact) %>
<%= link_to t("users.show.remove as friend"), remove_friend_path(:display_name => contact.display_name, :referer => request.fullpath), :method => :post %>
<% else %>
<%= link_to t("users.show.add as friend"), make_friend_path(:display_name => contact.display_name, :referer => request.fullpath), :method => :post %>
<% end %>
</li>
</ul>
</nav>
</div>
<% end %>
20 changes: 12 additions & 8 deletions app/views/dashboards/show.html.erb
View file
Expand Up @@ -32,10 +32,12 @@
<% if friends.empty? %>
<%= t ".no friends" %>
<% else %>
<ul class='secondary-actions clearfix'>
<li><%= link_to t(".friends_changesets"), friend_changesets_path %></li>
<li><%= link_to t(".friends_diaries"), friends_diary_entries_path %></li>
</ul>
<nav class='secondary-actions'>
<ul class='clearfix'>
<li><%= link_to t(".friends_changesets"), friend_changesets_path %></li>
<li><%= link_to t(".friends_diaries"), friends_diary_entries_path %></li>
</ul>
</nav>
<div id="friends-container">
<%= render :partial => "contact", :collection => friends, :locals => { :type => "friend" } %>
</div>
Expand All @@ -48,10 +50,12 @@
<% if nearby.empty? %>
<%= t ".no nearby users" %>
<% else %>
<ul class='secondary-actions clearfix'>
<li><%= link_to t(".nearby_changesets"), nearby_changesets_path %></li>
<li><%= link_to t(".nearby_diaries"), nearby_diary_entries_path %></li>
</ul>
<nav class='secondary-actions'>
<ul class='clearfix'>
<li><%= link_to t(".nearby_changesets"), nearby_changesets_path %></li>
<li><%= link_to t(".nearby_diaries"), nearby_diary_entries_path %></li>
</ul>
</nav>
<div id="nearbyusers">
<%= render :partial => "contact", :collection => nearby, :locals => { :type => "nearby mapper" } %>
</div>
Expand Down
50 changes: 26 additions & 24 deletions app/views/diary_entries/_diary_entry.html.erb
View file
Expand Up @@ -23,31 +23,33 @@
<%= render :partial => "location", :object => diary_entry %>
<% end %>

<ul class='secondary-actions clearfix'>
<% if params[:action] == 'index' %>
<li><%= link_to t(".comment_link"), diary_entry_path(diary_entry.user, diary_entry, :anchor => "newcomment") %></li>
<li><%= link_to t(".reply_link"), new_message_path(diary_entry.user, :message => { :title => "Re: #{diary_entry.title}" }) %></li>
<li><%= link_to t(".comment_count", :count => diary_entry.visible_comments.count), diary_entry_path(diary_entry.user, diary_entry, :anchor => "comments") %></li>
<% end %>
<nav class='secondary-actions'>
<ul class='clearfix'>
<% if params[:action] == 'index' %>
<li><%= link_to t(".comment_link"), diary_entry_path(diary_entry.user, diary_entry, :anchor => "newcomment") %></li>
<li><%= link_to t(".reply_link"), new_message_path(diary_entry.user, :message => { :title => "Re: #{diary_entry.title}" }) %></li>
<li><%= link_to t(".comment_count", :count => diary_entry.visible_comments.count), diary_entry_path(diary_entry.user, diary_entry, :anchor => "comments") %></li>
<% end %>
<% if current_user && current_user == diary_entry.user %>
<li><%= link_to t(".edit_link"), :action => "edit", :display_name => diary_entry.user.display_name, :id => diary_entry.id %></li>
<% end %>
<% if current_user && current_user == diary_entry.user %>
<li><%= link_to t(".edit_link"), :action => "edit", :display_name => diary_entry.user.display_name, :id => diary_entry.id %></li>
<% end %>
<% if current_user and diary_entry.user != current_user %>
<li>
<%= report_link(t(".report"), diary_entry) %>
</li>
<% end %>
<% if current_user and diary_entry.user != current_user %>
<li>
<%= report_link(t(".report"), diary_entry) %>
</li>
<% end %>
<% if can? :hide, DiaryEntry %>
<li>
<% if diary_entry.visible %>
<%= link_to t(".hide_link"), hide_diary_entry_path(:display_name => diary_entry.user.display_name, :id => diary_entry.id), :method => :post, :data => { :confirm => t(".confirm") } %>
<% else %>
<%= link_to t(".unhide_link"), unhide_diary_entry_path(:display_name => diary_entry.user.display_name, :id => diary_entry.id), :method => :post, :data => { :confirm => t(".confirm") } %>
<% end %>
</li>
<% end %>
</ul>
<% if can? :hide, DiaryEntry %>
<li>
<% if diary_entry.visible %>
<%= link_to t(".hide_link"), hide_diary_entry_path(:display_name => diary_entry.user.display_name, :id => diary_entry.id), :method => :post, :data => { :confirm => t(".confirm") } %>
<% else %>
<%= link_to t(".unhide_link"), unhide_diary_entry_path(:display_name => diary_entry.user.display_name, :id => diary_entry.id), :method => :post, :data => { :confirm => t(".confirm") } %>
<% end %>
</li>
<% end %>
</ul>
</nav>
</div>
28 changes: 15 additions & 13 deletions app/views/diary_entries/index.html.erb
View file
Expand Up @@ -6,19 +6,21 @@
<% end %>
<h1><%= @title %></h1>

<ul class="secondary-actions clearfix">
<% unless params[:friends] or params[:nearby] -%>
<li><%= rss_link_to :action => "rss", :language => params[:language] %></li>
<% end -%>
<% if @user && @user == current_user || !@user && current_user %>
<li><%= link_to image_tag("new.png", :class => "small_icon") + t(".new"), new_diary_entry_path, :title => t(".new_title") %></li>
<% end %>
<% if !@user && current_user %>
<li><%= link_to t(".my_diary"), :controller => "diary_entries", :action => "index", :display_name => current_user.display_name %></li>
<% end %>
</ul>
<nav class="secondary-actions">
<ul class="clearfix">
<% unless params[:friends] or params[:nearby] -%>
<li><%= rss_link_to :action => "rss", :language => params[:language] %></li>
<% end -%>
<% if @user && @user == current_user || !@user && current_user %>
<li><%= link_to image_tag("new.png", :class => "small_icon") + t(".new"), new_diary_entry_path, :title => t(".new_title") %></li>
<% end %>
<% if !@user && current_user %>
<li><%= link_to t(".my_diary"), :controller => "diary_entries", :action => "index", :display_name => current_user.display_name %></li>
<% end %>
</ul>
</nav>
</div>
<% end %>
Expand Down
18 changes: 10 additions & 8 deletions app/views/traces/_trace.html.erb
View file
Expand Up @@ -44,14 +44,16 @@
</td>
<td>
<% if trace.inserted? %>
<ul class="secondary-actions">
<li>
<%= link_to t(".view_map"), { :controller => "site", :action => "index", :mlat => trace.latitude, :mlon => trace.longitude, :anchor => "map=14/#{trace.latitude}/#{trace.longitude}" } %>
</li>
<li>
<%= link_to t(".edit_map"), { :controller => "site", :action => "edit", :gpx => trace.id } %>
</li>
</ul>
<nav class="secondary-actions">
<ul>
<li>
<%= link_to t(".view_map"), { :controller => "site", :action => "index", :mlat => trace.latitude, :mlon => trace.longitude, :anchor => "map=14/#{trace.latitude}/#{trace.longitude}" } %>
</li>
<li>
<%= link_to t(".edit_map"), { :controller => "site", :action => "edit", :gpx => trace.id } %>
</li>
</ul>
</nav>
<% end %>
</td>
</tr>
28 changes: 15 additions & 13 deletions app/views/user_blocks/_blocks.html.erb
View file
Expand Up @@ -20,18 +20,20 @@
<%= render :partial => "block", :locals => { :show_revoke_link => show_revoke_link, :show_user_name => show_user_name, :show_creator_name => show_creator_name }, :collection => @user_blocks %>
</table>

<ul class='secondary-actions'>
<% if @user_blocks_pages.current_page.number > 1 -%>
<li><%= link_to t(".previous"), @params.merge(:page => @user_blocks_pages.current_page.number - 1) %></li>
<% else -%>
<li><%= t(".previous") %></li>
<% end -%>
<nav class='secondary-actions'>
<ul>
<% if @user_blocks_pages.current_page.number > 1 -%>
<li><%= link_to t(".previous"), @params.merge(:page => @user_blocks_pages.current_page.number - 1) %></li>
<% else -%>
<li><%= t(".previous") %></li>
<% end -%>

<li><%= t(".showing_page", :page => @user_blocks_pages.current_page.number) %></li>
<li><%= t(".showing_page", :page => @user_blocks_pages.current_page.number) %></li>

<% if @user_blocks_pages.current_page.number < @user_blocks_pages.page_count -%>
<li><%= link_to t(".next"), @params.merge(:page => @user_blocks_pages.current_page.number + 1) %></li>
<% else -%>
<li><%= t(".next") %></li>
<% end -%>
</ul>
<% if @user_blocks_pages.current_page.number < @user_blocks_pages.page_count -%>
<li><%= link_to t(".next"), @params.merge(:page => @user_blocks_pages.current_page.number + 1) %></li>
<% else -%>
<li><%= t(".next") %></li>
<% end -%>
</ul>
</nav>
10 changes: 6 additions & 4 deletions app/views/user_blocks/edit.html.erb
View file
Expand Up @@ -3,10 +3,12 @@
<h1><%= t(".heading_html",
:name => link_to(@user_block.user.display_name,
user_path(@user_block.user))) %></h1>
<ul class='secondary-actions clearfix'>
<li><%= link_to t(".show"), @user_block %></li>
<li><%= link_to t(".back"), user_blocks_path %></li>
</ul>
<nav class='secondary-actions'>
<ul class='clearfix'>
<li><%= link_to t(".show"), @user_block %></li>
<li><%= link_to t(".back"), user_blocks_path %></li>
</ul>
</nav>
<% end %>
<%= bootstrap_form_for(@user_block) do |f| %>
Expand Down
24 changes: 13 additions & 11 deletions app/views/user_blocks/show.html.erb
View file
Expand Up @@ -8,17 +8,19 @@
user_path(@user_block.user)),
:block_by => link_to(@user_block.creator.display_name,
user_path(@user_block.creator))) %></h1>
<ul class='secondary-actions clearfix'>
<% if @user_block.ends_at > Time.now.getutc %>
<% if current_user and current_user.id == @user_block.creator_id %>
<li><%= link_to t(".edit"), edit_user_block_path(@user_block) %></li>
<% end %>
<% if can?(:revoke, UserBlock) %>
<li><%= link_to t(".revoke"), revoke_user_block_path(@user_block) %></li>
<% end %>
<% end %>
<li><%= link_to t(".back"), user_blocks_path %></li>
</ul>
<nav class='secondary-actions'>
<ul class='clearfix'>
<% if @user_block.ends_at > Time.now.getutc %>
<% if current_user and current_user.id == @user_block.creator_id %>
<li><%= link_to t(".edit"), edit_user_block_path(@user_block) %></li>
<% end %>
<% if can?(:revoke, UserBlock) %>
<li><%= link_to t(".revoke"), revoke_user_block_path(@user_block) %></li>
<% end %>
<% end %>
<li><%= link_to t(".back"), user_blocks_path %></li>
</ul>
</nav>
<% end %>

<dl class="row">
Expand Down

0 comments on commit 29e9857

Please sign in to comment.