{% if post.date %}
  {% if post.taxonomies.people %}
    {% set people = get_section(path="people/_index.md") %}
    {% set pages_str = people.pages | json_encode() | as_str %}
    {% if pages_str is containing(post.taxonomies.people[0]) %}
      {% set author_path = 'people/' ~ post.taxonomies.people[0] ~ '/index.md' %}
      {% set author = get_page(path=author_path) %}
    {% endif %}
  {% endif %}

  <div class="flex flex-col rounded-lg shadow-lg overflow-hidden bg-white">
    {% if post.extra.imgPath %}
      {% set img_url = get_url(path='/' ~ post.relative_path | replace(from='_', to='-') | replace(from='index.md', to=post.extra.imgPath)) %}
      <div class="flex-shrink-0">
        <img class="h-30 w-full object-cover" src="{{ img_url }}" alt="{{ post.title ~ ' Picture' }}" />
      </div>
    {% endif %}

    <div class="flex-1 p-6 flex flex-col">
      <h3 class="text-base text-left font-medium text-gray-900 mb-2">
        {{ post.title }}
      </h3>

      {% if post.description %}
        <p class="text-sm text-left text-gray-500 mb-3">
          {{ post.description }}
        </p>
      {% endif %}

      <div class="article hidden">
        {{ post.content | safe }}
      </div>

      <div class="mt-auto py-3">
        <div class="flex items-center">
          <div class="flex-shrink-0">
            {% if author %}
              {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') | replace(from='index.md', to=author.extra.imgPath)) %}
              <img alt="{{ author.title }}" src="{{ author_img }}" class="w-8 h-8 rounded-full border-2 border-white bg-gray-200" />
            {% endif %}
          </div>
          <div class="ml-3 text-gray-700 text-xs flex flex-col">
            {% if author %}
              <p class="uppercase">{{ author.title }}</p>
            {% endif %}
            <p>
              <time class="text-xs" datetime="{{ post.date }}">
                {{ post.date | date(format="%B %e, %Y", timezone="America/Chicago") }}
              </time>
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>

{% endif %}