{% extends "base.html" %}

{% block content %}

<h2 class="text-xl font-semibold mb-4">Log files</h2>

<div class="space-y-2 mx-5">
  {% for f in files %}
    <div class="flex items-center justify-between rounded-lg border border-gray-200 bg-white px-4 py-3 shadow-sm hover:bg-gray-50">
      
      <!-- File info -->
      <div>
        <a
          href="{% url 'log_detail' f.name %}"
          class="font-medium text-blue-600 hover:underline"
        >
          {{ f.name }}
        </a>

        <div class="mt-1 text-sm text-gray-500">
          <span>{{ f.size|filesizeformat }}</span>
          <span class="mx-2">•</span>
          <span>Modified {{ f.mtime|date:"Y-m-d H:i" }}</span>
        </div>
      </div>

      <!-- Action -->
      <div>
        <a
          href="{% url 'log_detail' f.name %}"
          class="inline-flex items-center rounded-md bg-blue-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-blue-700"
        >
          View
        </a>
      </div>

    </div>
  {% empty %}
    <p class="text-gray-500">No log files found.</p>
  {% endfor %}
</div>

{% endblock %}
