{% extends 'layouts/base.html' %}
{% load i18n %}
{% load pyaa %}

{% block content %}

<div class="container mx-auto px-4 py-8">
    <h1 class="text-2xl font-bold text-center mb-6">
        {{ category.name }}
    </h1>

    {% if page_obj %}
    <div class="flex flex-wrap justify-center gap-6">
        {% for content in page_obj %}
        <div class="w-full max-w-sm bg-base-200 rounded-lg p-5">
            <h2 class="font-semibold text-lg mb-2">{{ content.title }}</h2>
            <p class="text-sm text-base-content/60 mb-3">{{ content.published_at|date:"M d, Y" }}</p>
            <p class="text-base-content/80 mb-4">{{ content.content|striptags|truncatewords:30 }}</p>
            <a href="{% url 'content_by_id' content.id %}" class="btn btn-primary btn-sm">
                {% trans "button.continue-reading" %} &rarr;
            </a>
        </div>
        {% endfor %}
    </div>

    {% include 'partials/paginator.html' %}
    {% else %}
    {% include 'partials/empty_data.html' %}
    {% endif %}
</div>

{% endblock content %}