{% extends "base.html" %}
{% block title %}Index_Root{% endblock title %}
{% block static %}
{% load static %}
<link rel="stylesheet" href="{% static 'root/style.css' %}">
<script type="text/javascript" src="{% static 'root/script.js' %}"></script>
{% endblock static %}
{% block content %}
<div class="main">
    <div id="std">
        <div class="mainInfo">
            <h1>Student</h1>
            <a href="{% url 'hstl:new_student' %}">➕</a>
        </div>
        
        {% if student %}
			<div class="table-container">
            <table>
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Name</th>
                        <th>Mobile</th>
                        <th>Info</th>
                    </tr>
                </thead>
                <tbody>
                    {% for s in student %}
                    <tr>
                        <td>{{ forloop.counter }}</td>
                        <td><strong>{{ s.name }}</strong></td>
                        <td>{{ s.mobile }}</td>
                        <td><a href="{% url 'hstl:info_student' s.id %}">ℹ️</a></td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
			</div>
        {% else %}
            <h3>No Students found. Click ➕ to add.</h3>
        {% endif %}
    </div>

    <div id="stf">
        <div class="mainInfo">
            <h1>Staff</h1>
            <a href="{% url 'hstl:new_staff' %}">➕</a>
        </div>

        {% if staff %}
			<div class="table-container">
            <table>
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Name</th>
                        <th>Mobile</th>
                        <th>Info</th>
                    </tr>
                </thead>
                <tbody>
                    {% for s in staff %}
                    <tr>
                        <td>{{ forloop.counter }}</td>
                        <td><strong>{{ s.name }}</strong></td>
                        <td>{{ s.mobile }}</td>
                        <td><a href="{% url 'hstl:info_staff' s.id %}">ℹ️</a></td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
			</div>
        {% else %}
            <h3>No Staff found. Click ➕ to add.</h3>
        {% endif %}
    </div>
</div>
<!-- Admin div -->
<div class="admin">
	<div>
		<h1>Admin task</h1>
	</div>
</div>
{% endblock content %}