Use a list of links to display recommendations

We were using an <h3> tag with no content associated to it. This is like
having a chapter in a book with only the title.
This commit is contained in:
Javi Martín
2024-10-23 01:42:14 +02:00
parent 054fbf585e
commit 34d87dff98
2 changed files with 15 additions and 12 deletions

View File

@@ -16,9 +16,14 @@
text-transform: uppercase;
}
h3 {
font-size: $base-font-size;
margin-bottom: 0;
ul {
font-weight: bold;
list-style: none;
margin: 0;
> li {
margin-bottom: calc($line-height / 4);
}
}
a {
@@ -29,11 +34,9 @@
}
.recommendation {
@include card;
background: $body-background;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15);
display: block;
margin-bottom: calc($line-height / 4);
padding: calc($line-height / 2);
z-index: 1;

View File

@@ -16,13 +16,13 @@
<span class="show-for-sr"><%= t("shared.recommended_index.hide") %></span>
<% end %>
<ul>
<% recommendations.each do |recommendation| %>
<div class="small-12 medium-6 large-4 column end">
<div class="recommendation" data-equalizer-watch>
<h3><%= link_to recommendation.title, polymorphic_path(recommendation) %></h3>
</div>
</div>
<li class="small-12 medium-6 large-4 column end">
<%= link_to recommendation.title, polymorphic_path(recommendation), class: "recommendation", "data-equalizer-watch": true %>
</li>
<% end %>
</ul>
<div class="small-12 column">
<%= link_to t("shared.recommended_index.see_more"),