{% load wagtailimages_tags %}
<div class="row">
  {% if page.cover_image %}
  {% image page.cover_image fill-800x450 format-webp as cover_image %}
  <div class="col-4 col-md-3 col-lg-2">
    <a href="{{page.url}}" title="{{page.title}}">
      <img src="{{cover_image.url}}" class="w-100" alt="{{page.title}}">
    </a>
  </div>
  {% endif %}
  <div class="col">
    <div class="d-flex align-items-center">
      <h4><a href="{{page.url}}">{{page.title}}</a></h4>
      {% if page.content_type.model_class in pagetypes %}<small class="ms-3 badge badge-secondary">{{page.search_name}}</small>{% endif %}
    </div>
    {% if page.caption %}
    <p class="lead">{{page.caption}}</p>
    {% endif %}
    <p class="text-muted">
      <span class="article-author">{{page.seo_author}}</span>
      <span class="mx-2">&bull;</span>
      <span class="article-date">{{ page.seo_published_at }}</span>
    </p>
    {% if page.search_description %}
    <p>{{page.search_description|safe}}</p>
    {% elif page.body_preview %}
    <p>{{page.body_preview}}</p>
    {% endif %}
  </div>
</div>
