Files
grecia/app/components/shared/recommended_index_component.html.erb
Javi Martín 4e129e7d9c Use grid instead of equalizer in recommendations
It's August 2025 and support for grid layout has been available in about
99% of the browsers for some time now. All major browsers added support
for grid layouts in 2017, which means our rule to support browsers that
are 7 years old allows us to start using `display: grid`.

Using a grid layout allows displaying a dynamic number of rows while
keepin all of them the same height, the same foundation's equalizer
does, by setting `grid-auto-rows: 1fr`.

And the `grid-template-columns` property lets us use dynamic columns for
all screen sizes, always filling the available space. No need to use
breakpoints.
2025-08-27 17:38:37 +02:00

31 lines
1.2 KiB
Plaintext

<div class="recommended-index">
<h2 class="show-for-sr"><%= t("shared.recommended_index.title") %></h2>
<div id="recommendations" data-toggler=".hide">
<%= button_to disable_recommendations_path, title: t("shared.recommended_index.hide"),
class: "hide-recommendations",
data: {
toggle: "recommendations",
confirm: t("#{namespace}.index.recommendations.disable")
},
method: :put do %>
<span class="icon-x"></span>
<span class="show-for-sr"><%= t("shared.recommended_index.hide") %></span>
<% end %>
<ul>
<% recommendations.each do |recommendation| %>
<li>
<%= link_to recommendation.title, polymorphic_path(recommendation), class: "recommendation" %>
</li>
<% end %>
</ul>
<div>
<%= link_to t("shared.recommended_index.see_more"),
current_path_with_query_params(order: "recommendations"),
class: "small" %>
</div>
</div>
</div>