ImperialCollegeLondon · cc-a · Oct 31, 2024 · Oct 24, 2024 · Oct 24, 2024 · Oct 24, 2024
diff --git a/main/templates/main/base.html b/main/templates/main/base.html
@@ -24,7 +24,8 @@
   </head>
   <body>
     {% include "main/navbar.html" %}
-    <div class="container py-3">
+    <div class="container-fluid py-3">
+      <!-- Changed to container-fluid for full width -->
       {% block content %}
       {% endblock content %}
     </div>

diff --git a/main/templates/main/navbar.html b/main/templates/main/navbar.html
@@ -1,7 +1,7 @@
 <!--Navbar-->
 {% load static %}
 <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
-  <div class="container">
+  <div class="container-fluid">
     <a class="navbar-brand" href="{% url 'main:index' %}">
       <img src="{% static 'main/images/DUNElogo_white.png' %}"
            alt="DUNE Run Control"

diff --git a/process_manager/tables.py b/process_manager/tables.py
@@ -1,10 +1,13 @@
-"""Tables for the process_manager app."""
+"""Defines the ProcessTable for displaying process data in a structured table format."""
+
+from typing import ClassVar
 
 import django_tables2 as tables
 from django.utils.safestring import mark_safe
 
 logs_column_template = (
-    "<a href=\"{% url 'process_manager:logs' record.uuid %}\">LOGS</a>"
+    "<a href=\"{% url 'process_manager:logs' record.uuid %}\" "
+    'class="btn btn-sm btn-primary text-white" title="View logs">LOGS</a>'
 )
 
 header_checkbox_hyperscript = """
@@ -21,18 +24,55 @@
 
 
 class ProcessTable(tables.Table):
-    """Defines and Process Table for the data from the Process Manager."""
-
-    class Meta:  # noqa: D106
-        orderable = False
-
-    uuid = tables.Column(verbose_name="UUID")
-    name = tables.Column(verbose_name="Name")
-    user = tables.Column(verbose_name="User")
-    session = tables.Column(verbose_name="Session")
-    status_code = tables.Column(verbose_name="Status Code")
-    exit_code = tables.Column(verbose_name="Exit Code")
-    logs = tables.TemplateColumn(logs_column_template, verbose_name="Logs")
+    """Defines a Process Table for the data from the Process Manager."""
+
+    uuid = tables.Column(
+        verbose_name="UUID",
+        attrs={"td": {"class": "fw-bold text-break text-start"}},
+    )
+    name = tables.Column(
+        verbose_name="Process Name",
+        attrs={
+            "td": {"class": "fw-bold text-primary text-center"},
+            "th": {"class": "text-center header-style"},
+        },
+    )
+    user = tables.Column(
+        verbose_name="User",
+        attrs={
+            "td": {"class": "text-secondary text-center"},
+            "th": {"class": "text-center header-style"},
+        },
+    )
+    session = tables.Column(
+        verbose_name="Session",
+        attrs={
+            "td": {"class": "text-secondary text-center"},
+            "th": {"class": "text-center header-style"},
+        },
+    )
+    status_code = tables.Column(
+        verbose_name="Status",
+        attrs={
+            "td": {"class": "fw-bold text-center"},
+            "th": {"class": "text-center header-style"},
+        },
+    )
+    exit_code = tables.Column(
+        verbose_name="Exit Code",
+        attrs={
+            "td": {"class": "text-center"},
+            "th": {"class": "text-center header-style"},
+        },
+    )
+    logs = tables.TemplateColumn(
+        logs_column_template,
+        verbose_name="Logs",
+        attrs={
+            "td": {"class": "text-center"},
+            "th": {"class": "text-center header-style"},
+        },
+    )
     select = tables.CheckBoxColumn(
         accessor="uuid",
         verbose_name="Select",
@@ -41,23 +81,39 @@ class Meta:  # noqa: D106
                 "id": "header-checkbox",
                 "hx-preserve": "true",
                 "_": header_checkbox_hyperscript,
-            }
+                "class": "form-check-input form-check-input-lg",
+            },
+            "td__input": {
+                "class": "form-check-input form-check-input-lg text-center",
+            },
         },
     )
 
-    def render_select(self, value: str) -> str:
-        """Customise behaviour of checkboxes in the select column.
+    class Meta:
+        """Table meta options for rendering behavior and styling."""
 
-        Overriding the default render method for this column is required as the
-        hx-preserve attitribute requires all elements to have unique id values. We also
-        need to add the hyperscript required for the header checkbox behaviour.
+        orderable: ClassVar[bool] = False
+        attrs: ClassVar[dict[str, str]] = {
+            "class": "table table-striped table-hover table-responsive",
+        }
 
-        Called during table rendering.
+    def render_status_code(self, value: str) -> str:
+        """Render the status_code with custom badge classes."""
+        if value == "DEAD":
+            return mark_safe('<span class="badge badge-dead">DEAD</span>')
+        elif value == "RUNNING":
+            return mark_safe('<span class="badge badge-running">RUNNING</span>')
+        return mark_safe(
+            f'<span class="badge bg-secondary px-3 py-2 rounded" '
+            f'style="font-size: 1.1rem;">{value}</span>'
+        )
 
-        Args:
-          value: uuid from the table row data
-        """
+    def render_select(self, value: str) -> str:
+        """Customize behavior of checkboxes in the select column."""
         return mark_safe(
-            f'<input type="checkbox" name="select" value="{value}" id="{value}-input" '
-            f'hx-preserve="true" class="row-checkbox" _="{row_checkbox_hyperscript}"'
+            f'<input type="checkbox" name="select" value="{value}" '
+            f'id="{value}-input" hx-preserve="true" '
+            'class="form-check-input form-check-input-lg row-checkbox" '
+            'style="transform: scale(1.5);" '
+            f'_="{row_checkbox_hyperscript}">'
         )