modified hostel table

Pancham1603 · Dec 25, 2023 · 1d3613b · 1d3613b
1 parent 94b6ca4
commit 1d3613b
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 36 deletions.
diff --git a/apps/nightpass/static/styles.css b/apps/nightpass/static/styles.css
@@ -278,6 +278,17 @@ footer {
 .badge {
     color: white;
     padding: 5px 10px;
+    border-radius: 5px;
+}
+
+.table-container {
+    max-width: 800px; /* Adjust the maximum width as needed */
+    margin: 10px auto; /* Center the container horizontally */
+    padding: 20px; /* Add some padding for spacing */
+    overflow-x: auto; /* Add horizontal scrolling for small screens */
+    background-color: #fff;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+
 }
 
 @media (max-width: 768px) {

diff --git a/apps/nightpass/templates/caretaker.html b/apps/nightpass/templates/caretaker.html
@@ -1,45 +1,41 @@
 {% extends 'base.html' %}
 
 {% block content %}
-<div class="table-responsive">
-    <table class="custom-table">
-        <thead>
-            <tr>
-                <th>Roll Number</th>
-                <th>Name</th>
-                <th>Room Number</th>
-                <th>Mobile Number</th>
-                <th>Status</th>
-                <th>Action</th>
-            </tr>
-        </thead>
-        <tbody>
-            {% for pass in hostel_passes %}
-            <tr>
-                <td>{{ pass.user.student.registration_number }}</td>
-                <td>{{ pass.user.student.name }}</td>
-                <td>{{ pass.user.student.room_number }}</td>
-                <td>{{ pass.user.student.contact_number }}</td>
-
-                {% if pass.user.student.is_checked_in  %}
-                    <td><span class="badge green">Inside Hostel {{ pass.user.student.hostel }}</span></td>
-                {% else %}
-                    {% if pass %}
-                        {% if pass.check_in and not pass.check_out %}
-                            <td><span class="badge yellow">In {{ pass.campus_resource }}</span></td>
+<div class="table-container">
+    <div class="table-responsive">
+        <table class="custom-table">
+            <thead>
+                <tr>
+                    <th>Name</th>
+                    <th>Room No</th>
+                    <th>Status</th>
+                    <th>Action</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for pass in hostel_passes %}
+                <tr>
+                    <td>{{ pass.user.student.name }}</td>
+                    <td>{{ pass.user.student.room_number }}</td>
+                    {% if pass.user.student.is_checked_in  %}
+                        <td><span class="badge green">Checked In</span></td>
+                    {% else %}
+                        {% if pass %}
+                            {% if pass.check_in and not pass.check_out %}
+                                <td><span class="badge yellow">{{ pass.campus_resource }}</span></td>
+                            {% else %}
+                                <td><span class="badge red">Outside</span></td>
+                            {% endif %}
                         {% else %}
-                            <td><span class="badge red">Outside Hostel</span></td>
+                            <td><span class="badge red">Outside</span></td>
                         {% endif %}
-                    {% else %}
-                        <td><span class="badge red">Outside Hostel</span></td>
                     {% endif %}
-                {% endif %}
-                <td><button>Details</button></td>
-            </tr>
-            {% endfor %}
-        </tbody>
-    </table>
+                    <td><a href="tel:{{ pass.user.student.contact_number }}"><button>Call</button></td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
 
+    </div>
 </div>
-
 {% endblock %}