{% extends "base.html" %} {% block content %}
<article
  class="aero-gradient-glass rounded-lg p-4 flex flex-col border-midnight-light border w-full"
>
  <section
    class="aero-gradient-dark p-2 rounded-lg border-midnight border prose-sm prose-p:m-1 w-full text-white flex flex-col"
  >
    <h6
      class="aero-gradient text-white p-2 border border-midnight rounded-lg w-full items-center flex justify-center"
    >
      {{ section.title | default(value="Projects") }}
    </h6>

    <section>
      <p>{{ section.description | safe }}</p>

      <ul class="list-none p-0">
        {% for page in section.pages %}
        <li class="mb-2">
          <a href="{{ page.permalink }}" class="text-blue-400 hover:underline"
            >{{ page.title }}</a
          >
        </li>
        {% endfor %}
      </ul>
    </section>
  </section>
</article>
{% endblock %}