{% if posts or title or text %}
  {% set archiveLink = fn.get_permalink(fn.get_option('page_for_posts')) %}
  <section class="m_panel" m-pack="basic">
    {% include 'm_components/widgets/headline.twig' with {
      title : title,
      text: text
    }
    only %}

    {% if posts %}

      <div class="grid">
        {% for item in posts %}

          {% set related_title = item.post_title %}
          {% set terms = fn.wp_get_post_terms(item.ID, 'category', {'fields': 'names'} ) %}
          {% set related_content = item.post_excerpt
            ? item.post_excerpt
            : fn.wp_trim_words(item.post_content, 18, '...') %}
          {% set related_date = item.post_date | date('F d, Y') %}
          {% set related_time = item.post_date|date('Y-m-d') %}

          {% set image = fn.get_post_thumbnail_id(item.ID) %}

          <a href="{{fn.get_the_permalink(item.ID)}}" class="m_panel__block">
            <div class="m_panel__image">
              {% include 'm_components/widgets/picture.twig' with {image: image, title: title} only %}
            </div>
            <div class="m_panel__content">
              <small>
                <time datetime="{{related_time}}">{{ related_date }}</time>
                {% if terms %}
                  <span class="separator">|</span>
                  {{terms|join(', ')}}
                {% endif %}
              </small>

              <h2 class="h4">{{related_title}}</h2>
              {% if related_content %}
                <p>{{related_content|striptags}}</p>
              {% endif %}
              <span class="btn__arrow btn__arrow--right">Read more</span>
            </div>
          </a>

        {% endfor %}
      </div>

    {% endif %}

    {% if archive %}
      {% include 'm_components/widgets/link.twig' with {
        textBtn : "View more",
        link: archiveLink
      }
    only %}
    {% endif %}
  </section>
{% endif %}
