home_finished.html

{% extends "layout.html" %}
{% block content %}
  {% for post in posts %}
    <article class="content-section py-3 px-4 mb-4">
      <div class="d-flex align-items-start gap-4">
        <img class="rounded-circle article-img flex-shrink-0"
             src="/static/profile_pics/default.jpg"
             alt="{{ post.author }}'s profile picture"
             width="64"
             height="64"
             loading="lazy">
        <div class="flex-grow-1">
          <div class="article-metadata mb-2">
            <a class="me-2" href="#">{{ post.author }}</a>
            <small class="text-body-secondary">{{ post.date_posted }}</small>
          </div>
          <h2>
            <a class="article-title" href="#">{{ post.title }}</a>
          </h2>
          <p class="article-content">{{ post.content }}</p>
        </div>
      </div>
    </article>
  {% endfor %}
{% endblock content %}