<% preview = local_assigns.has_key? :url %>

<% if preview %>
  <div class="flex flex-v-center flex-h-between">
    <h2><%= title %></h2>
    <%= link_to t('global.button.all'), url, title: t('global.button.all'), class: 'button--all' %>
  </div>
<% end %>

<div class="cards--search-results-areas <%= preview ? 'preview' : '' %>">
  <% cards.each do |card| %>
    <%= link_to protected_area_path(card.wdpa_id), title: "View more about the site: #{ card.name }", class: "card__link" do %>

      <div v-lazy-container="{ selector: 'img' }">
        <%= protected_area_cover(card) %>
      </div>

      <div class="card__content">
        <h3 class="card__title"><%= card.name %></h3>
      </div>
    <% end %>
  <% end %>
</div>

<% preview = local_assigns.has_key? :url %>

<% if preview %>
  <div class="flex flex-v-center flex-h-between">
    <h2><%= title %></h2>
    <%= link_to t('global.button.all'), url, title: t('global.button.all'), class: 'button--all' %>
  </div>
<% end %>

<div class="cards--search-results-areas <%= preview ? 'preview' : '' %>">
  <% cards.each do |card| %>
    <%= link_to protected_area_path(card.wdpa_id), title: "View more about the site: #{ card.name }", class: "card__link" do %>

      <div class="card__image-placeholder">
        <div alt="title" class="card__image" style="background-image: url(<%= protected_area_cover(card, with_tag: false) %>)"></div>
      </div>

      <div class="card__content">
        <h3 class="card__title"><%= card.name %></h3>
      </div>
    <% end %>
  <% end %>
</div>

Replace lazy loader for sites images in site page
Replace lazy loader for sites images in site page
