{% assign posts1 = “” | split: “” %} {% assign posts2 = “” | split: “” %} {% for post in include.posts %}

{% if post.pin %}
  {% assign posts1 = posts1 | push: post %}
{% else %}
  {% assign posts2 = posts2 | push: post %}
{% endif %}

{% endfor %} {% assign posts = posts1 | concat: posts2 %}

{% if page.type == “home” %}

{% assign offset = paginator.page | minus: 1 | times: paginator.per_page %}
{% assign count = paginator.posts | size | minus: 1 %}
{% assign minIndex = offset %}
{% assign maxIndex = offset | plus: count %}

{% else %}

{% assign minIndex = 0 %}
{% assign maxIndex = posts.size | minus: 1 %}

{% endif %}

{% for index in (minIndex..maxIndex) %}{% assign post = posts %} <div class=“relative p-3 pb-1 rounded-lg flex flex-col justify-between bg-{{ color }}-50 bg-opacity-75 text-black”>

<!-- post.pin -->
{% if post.pin %}
  {% capture class %}{{ "absolute -left-2 -top-2 text-color-600" | replace: "color", color }}{% endcapture %}
  {% include svg-pin.html class=class %}
{% endif %}
<!-- post.title -->
<a class="block text-3xl font-serif font-medium" href="{{ post.id | relative_url }}">
  {{ post.title | default: "NO_TITLE" | escape }}
</a>
<!-- post.description -->
<span class="block p-1 text-sm font-extralight">
  {{ post.description | default: post.excerpt | strip_html }}
</span>
<div class="flex flex-wrap select-none">
  <div class="flex-grow">
    <!-- post.date -->
    {% include chip.html type="date" text=post.date width=4 %}
  </div>
  <div class="flex flex-wrap">
    <!-- post.categories -->
    {% for category in post.categories %}
      {% include chip.html type="category" text=category width=4 %}
    {% endfor %}
    <!-- post.tags -->
    {% for tag in post.tags %}
      {% include chip.html type="tag" text=tag width=4 %}
    {% endfor %}
  </div>
</div>

</div> {% endfor %}