{% extends 'base.html' %}
{% load static %}

{% block title %}
  User List
{% endblock %}

{% block extra_css %}
      <link rel="stylesheet" href="{% static 'CSS/user_list.css' %}">
{% endblock %}

{% block head %}
  User List
{% endblock %}

{% block header %}
  User List - User Profiles
{% endblock %}

{% block content %}
<div class="user_list_container">
    <table border="1" cellpadding="4" style="border-collapse: collapse; width:80%; table-layout:auto; background:white; color:black;">
    <thead style="background:#e3e3e3; font-weight:bold;">
      <tr>
        <th>Username</th>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Email</th>
        <th>Phone</th>
        <th>last login</th>
        <th>date join</th>
      </tr>
    </thead>
    <tbody>
      {% for profile in profiles %}
        <tr>
          <td>{{ profile.user.username }}</td>
          <td>{{ profile.user.first_name }}</td>
          <td>{{ profile.user.last_name }}</td>
          <td>{{ profile.user.email }}</td>
          <td>{{ profile.phone }}</td>
          <td>{{ profile.user.last_login }}</td>
          <td>{{ profile.user.date_joined }}</td>
        </tr>
      {% empty %}
        <tr>
          <td colspan="5">No users found.</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
</div>
  
{% endblock %}