Move the variable definitions into base.css

django · Sep 19, 2020 · 3dabde2 · 3dabde2
1 parent 776705b
commit 3dabde2
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 53 deletions.
diff --git a/django/contrib/admin/static/admin/css/base.css b/django/contrib/admin/static/admin/css/base.css
@@ -2,6 +2,60 @@
     DJANGO Admin styles
 */
 
+/* VARIABLE DEFINITIONS */
+:root {
+  --primary: #79aec8;
+  --secondary: #417690;
+  --accent: #f5dd5d;
+
+  --body-fg: #333;
+  --body-bg: #fff;
+  --body-muted-color: #666;
+  --body-quiet-color: #999;
+  --body-screaming-color: #000;
+
+  --header-color: #ffc;
+  --header-branding-color: var(--accent);
+  --header-bg: var(--secondary);
+  --header-link-color: #fff;
+
+  --breadcrumbs-fg: #c4dce8;
+  --breadcrumbs-link-fg: var(--body-bg);
+  --breadcrumbs-bg: var(--primary);
+
+  --link-fg: #447e9b;
+  --link-hover-color: #036;
+  --link-selected-fg: #5b80b2;
+
+  --hairline-color: #e8e8e8;
+  --border-color: #ccc;
+
+  --error-fg: #ba2121;
+
+  --message-success-bg: #dfd;
+  --message-warning-bg: #ffc;
+  --message-error-bg: #ffefef;
+
+  --darkened-bg: #f8f8f8; /* A bit darker than --body-bg */
+  --selected-bg: #e4e4e4;
+
+  --button-fg: #fff;
+  --button-bg: var(--primary);
+  --button-hover-bg: #609ab6;
+  --default-button-bg: var(--secondary);
+  --default-button-hover-bg: #205067;
+  --close-button-bg: #bbb;
+  --close-button-hover-bg: #aaa;
+  --delete-button-bg: #ba2121;
+  --delete-button-hover-bg: #a41515;
+
+  --object-tools-fg: var(--button-fg);
+  --object-tools-bg: #999;
+  --object-tools-hover-bg: var(--secondary);
+
+  --selected: #ffc;
+}
+
 @import url(fonts.css);
 
 html, body {

diff --git a/django/contrib/admin/templates/admin/base.html b/django/contrib/admin/templates/admin/base.html
@@ -21,59 +21,6 @@
 {% load i18n %}
 
 <style>
-:root {
-  --primary: #79aec8;
-  --secondary: #417690;
-  --accent: #f5dd5d;
-
-  --body-fg: #333;
-  --body-bg: #fff;
-  --body-muted-color: #666;
-  --body-quiet-color: #999;
-  --body-screaming-color: #000;
-
-  --header-color: #ffc;
-  --header-branding-color: var(--accent);
-  --header-bg: var(--secondary);
-  --header-link-color: #fff;
-
-  --breadcrumbs-fg: #c4dce8;
-  --breadcrumbs-link-fg: var(--body-bg);
-  --breadcrumbs-bg: var(--primary);
-
-  --link-fg: #447e9b;
-  --link-hover-color: #036;
-  --link-selected-fg: #5b80b2;
-
-  --hairline-color: #e8e8e8;
-  --border-color: #ccc;
-
-  --error-fg: #ba2121;
-
-  --message-success-bg: #dfd;
-  --message-warning-bg: #ffc;
-  --message-error-bg: #ffefef;
-
-  --darkened-bg: #f8f8f8; /* A bit darker than --body-bg */
-  --selected-bg: #e4e4e4;
-
-  --button-fg: #fff;
-  --button-bg: var(--primary);
-  --button-hover-bg: #609ab6;
-  --default-button-bg: var(--secondary);
-  --default-button-hover-bg: #205067;
-  --close-button-bg: #bbb;
-  --close-button-hover-bg: #aaa;
-  --delete-button-bg: #ba2121;
-  --delete-button-hover-bg: #a41515;
-
-  --object-tools-fg: var(--button-fg);
-  --object-tools-bg: #999;
-  --object-tools-hover-bg: var(--secondary);
-
-  --selected: #ffc;
-}
-
 /* Purple, just as an experiment to see what's missing *
 :root {
   --primary: #9774d5;