---
title:
  type: 'string'
created_at:
  type: 'string'
image:
  type: 'hash'
content:
  type: 'string'
url:
  type: 'string'
---

<div class="card mb-3">
  <div class="row g-0">
    <div class="col-md-4">
      {% render 'sutty/picture.html', 
        image:,
        img_class: 'w-100 rounded-3'
      %}
    </div>
    <div class="col-md-8 ps-3">
      <div class="card-body d-flex flex-column h-100 justify-content-between">
        <a class="fs-3 fw-bold card-title text-monospace" href="{{ url }}">{{- title -}}</a>
        <p class="fs-4 card-text text-monospace">
          {{ content | truncatewords: 15 }}
          {% assign words = content | number_of_words %}
          {% if words > 15 %}
            <a href="{{ url }}">(read more)</a>
          {% endif %}
        </p>
        <div class="d-flex align-items-center justify-content-between">
          <p class="card-text fst-italic">{{ created_at | date: "%B %d, %Y" }}</p>
          <div class="w-35px">{% render 'svg/share.svg', class: 'primary' %}</div>
        </div>
      </div>
    </div>
  </div>
</div>