cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use list-inline to achieve spacing between elements on a line

Browse source 
This is a better solution than spans and margins. Additionally, rework
to use mb-* instead of my-* (bootstrap advises against using margin-top)
and get rid of <br>s by using paragraphs instead.
This commit is contained in:
Andy Allan 2021-03-17 18:57:36 +00:00
parent 8e5deafd85
commit a08fe1c291
2 changed files with 21 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

39
app/views/traces/_trace.html.erb
View file

@ -9,24 +9,26 @@
<% end %>
</td>
<td>
<span class="mr-2">
<%= link_to trace.name, :controller => "traces", :action => "show", :display_name => trace.user.display_name, :id => trace.id %>
</span>
<ul class="list-inline mb-0">
<li class="list-inline-item">
<%= link_to trace.name, :controller => "traces", :action => "show", :display_name => trace.user.display_name, :id => trace.id %>
</li>
<% if trace.inserted? %>
<span class="mr-2">
<%= t ".count_points", :count => trace.size %>
</span>
<% end %>
<% if trace.inserted? %>
<li class="list-inline-item">
<%= t ".count_points", :count => trace.size %>
</li>
<% end %>
<% badge_class = case trace.visibility
when "public", "identifiable" then "success"
else "danger"
end %>
<span class="badge badge-<%= badge_class %> text-white"><%= t(".#{trace.visibility}") %></span>
<br />
<span class="text-muted">
<li class="list-inline-item">
<% badge_class = case trace.visibility
when "public", "identifiable" then "success"
else "danger"
end %>
<span class="badge badge-<%= badge_class %> text-white"><%= t(".#{trace.visibility}") %></span>
</li>
</ul>
<p class="text-muted mb-0">
<span title="<%= trace.timestamp %>">
<%= time_ago_in_words(trace.timestamp, :scope => :'datetime.distance_in_words_ago') %>
</span>
@ -35,9 +37,8 @@
<%= t ".in" %>
<%= safe_join(trace.tags.collect { |tag| link_to_tag tag.tag }, ", ") %>
<% end %>
</span>
<br />
<p class="font-italic my-1">
</p>
<p class="font-italic mb-0">
<%= trace.description %>
</p>
</td>