From b5cef91a91c9dbb697b65ef978a7de0b2c5cf564 Mon Sep 17 00:00:00 2001
From: mimi89999 <michel@lebihan.pl>
Date: Tue, 12 Jan 2021 09:59:40 +0100
Subject: [PATCH] Fixed #31259 -- Added admin dark theme.
---
.../contrib/admin/static/admin/css/base.css | 26 +++++++++++++++++++
docs/ref/contrib/admin/index.txt | 9 ++++++-
docs/releases/3.2.txt | 3 ++-
3 files changed, 36 insertions(+), 2 deletions(-)
diff --git a/django/contrib/admin/static/admin/css/base.css b/django/contrib/admin/static/admin/css/base.css
index f6828c866e..224c787460 100644
--- a/django/contrib/admin/static/admin/css/base.css
+++ b/django/contrib/admin/static/admin/css/base.css
@@ -56,6 +56,32 @@
--object-tools-hover-bg: var(--close-button-hover-bg);
}
+@media (prefers-color-scheme: dark) {
+ :root {
+ --primary: #264b5d;
+
+ --body-fg: #eeeeee;
+ --body-bg: #121212;
+ --body-quiet-color: #e0e0e0;
+ --body-loud-color: #ffffff;
+
+ --header-link-color: #eeeeee;
+
+ --breadcrumbs-link-fg: #e0e0e0;
+ --breadcrumbs-bg: var(--primary);
+
+ --link-fg: #81d4fa;
+ --link-hover-color: #4ac1f7;
+
+ --hairline-color: #272727;
+ --border-color: #353535;
+
+ --darkened-bg: #212121;
+ --selected-bg: #1b1b1b;
+ --selected-row: #00363a;
+ }
+}
+
html, body {
height: 100%;
}
diff --git a/docs/ref/contrib/admin/index.txt b/docs/ref/contrib/admin/index.txt
index aaf5134395..c6135ca5cb 100644
--- a/docs/ref/contrib/admin/index.txt
+++ b/docs/ref/contrib/admin/index.txt
@@ -2853,6 +2853,8 @@ creating your own ``AdminSite`` instance (see below), and changing the
Theming support
===============
+.. versionadded:: 3.2
+
The admin uses CSS variables to define colors. This allows changing colors
without having to override many individual CSS rules. For example, if you
preferred purple instead of blue you could add a ``admin/base.html`` template
@@ -2873,7 +2875,12 @@ override to your project:
</style>
{% endblock %}
-An up-to-date list of CSS variables is at
+A dark theme is defined, and applied respecting the `prefers-color-scheme`_
+media query.
+
+.. _prefers-color-scheme: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme
+
+The list of CSS variables are defined at
:file:`django/contrib/admin/static/admin/css/base.css`.
``AdminSite`` objects
diff --git a/docs/releases/3.2.txt b/docs/releases/3.2.txt
index 66607916e0..2b0f0ee6ee 100644
--- a/docs/releases/3.2.txt
+++ b/docs/releases/3.2.txt
@@ -175,7 +175,8 @@ Minor features
* Read-only related fields are now rendered as navigable links if target models
are registered in the admin.
-* The admin now supports theming. See :ref:`admin-theming` for more details.
+* The admin now supports theming, and includes a dark theme that is enabled
+ according to browser settings. See :ref:`admin-theming` for more details.
* :attr:`.ModelAdmin.autocomplete_fields` now respects
:attr:`ForeignKey.to_field <django.db.models.ForeignKey.to_field>` and