index.html

---
layout: default
title: "Blog"
---

<section>
  {% for post in site.posts %}
    <article class="bg-gray-800 p-6 rounded-lg shadow-md mb-6">
      <div class="text-center text-gray-400 text-xs sm:text-base mb-2">February 5, 2024</div>
      <h2 class="text-xl sm:text-2xl lg:text-3xl font-bold text-white mb-4">{{ forloop.index | prepend: '0' | slice: -2, 2 }}. {{ post.title }}</h2>
      <p class="text-sm sm:text-base text-gray-300">One of the reasons I think AI is going to have a hard time...</p>
      <div class="text-center mt-4">
        <a href="#" class="inline-block text-xs text-white border border-gray-100 border-opacity-50 rounded-full px-2 py-1 m-2 shadow-md">Read more</a>
      </div>
    </article>
  {% endfor %}

  <div class="text-center mt-8">
    <a href="#" class="inline-block text-sm text-white border border-gray-100 rounded-full px-4 py-1 m-2 shadow-md">See more posts »</a>
  </div>
</section>