Styling for Django admin backend

The base_site.html template is replaced, and relevant CSS is overriden
to leave the built-in CSS unchanged.

app/app/urls.py

@@ -20,6 +20,9 @@
 
 from . import views
 
+admin.site.index_title = "SADiLaR Administration"
+admin.site.site_title = "SADiLaR Site Admin Portal"
+
 urlpatterns = [
     path("admin/", admin.site.urls),
     path("", views.home, name="home"),

app/static/css/admin.css

@@ -0,0 +1,63 @@
+/*
+    Django admin styles
+    extended from https://github.com/django/django/blob/main/django/contrib/admin/static/admin/css/base.css
+    Remember to sync colours with front-end CSS.
+*/
+
+/* VARIABLE DEFINITIONS */
+html[data-theme="light"],
+:root {
+    --primary: #1a2f69;
+    --primary-light: #8288bc;
+
+    --header-color: var(--primary-light);
+    --header-branding-color: var(--primary-light);
+    --header-bg: var(--primary);
+    --header-link-color: #000000;
+
+    --breadcrumbs-bg: var(--primary-light);
+
+    --link-fg: var(--primary);
+    --link-selected-fg: var(--primary);
+
+    --message-success-bg: #9fadd1;
+    --message-warning-bg: var(--primary-light);
+
+    --selected-row: var(--primary-light);
+
+    --button-bg: var(--primary);
+    --button-hover-bg: #485D95;
+    --default-button-bg:#485D95;
+    --default-button-hover-bg: var(--primary);
+}
+
+/* LINKS */
+a.section:link, a.section:visited {
+    color: #ffffff;
+}
+
+/* HEADER */
+#header {
+  padding: 3px 15px 0 10px;
+  background: #ffffff;
+  color: #000;
+}
+
+#header a:link, #header a:visited, #logout-form button {
+    color: var(--link-fg);
+}
+
+.theme-toggle svg.theme-icon-when-auto, .theme-toggle svg.theme-icon-when-dark, .theme-toggle svg.theme-icon-when-light {
+    fill: var(--link-fg);
+    color: #fff;
+}
+
+.header-title {
+    margin: 10px;
+}
+
+.main-logo {
+    margin-left: 1px;
+    width: auto;
+    height: 70px;
+}

app/templates/admin/base_site.html

@@ -0,0 +1,25 @@
+<!--
+    Django Admin template
+    extended from https://github.com/django/django/blob/main/django/contrib/admin/templates/admin/base.html
+    and https://github.com/django/django/blob/main/django/contrib/admin/templates/admin/base_site.html
+-->
+
+{% extends "admin/base.html" %}
+
+{% load static %}
+
+{% block title %}{% if subtitle %}{{ subtitle }} | {% endif %}{{ title }} | {{ site_title|default:_('Django site admin') }}{% endblock %}
+
+{% block extrastyle %}
+  <link rel="stylesheet" href="{% static 'css/admin.css' %}">
+{% endblock %}
+
+{% block branding %}
+        <h1 class="header-title">
+          <img src="{% static 'img/sadilar.png' %}" class="main-logo" alt="SADiLaR">
+        </h1>
+{% if user.is_anonymous %}
+  {% include "admin/color_theme_toggle.html" %}
+{% endif %}
+{% endblock %}
+