diff --git a/ws/static/colours.css b/ws/static/colours.css
new file mode 100644
index 0000000000000000000000000000000000000000..dfdb8edfaf7eb09b02db9a8cc82a8747b56b5d3e
--- /dev/null
+++ b/ws/static/colours.css
@@ -0,0 +1,13 @@
+
+:root {
+ --primary: hsl(224, 95%, 45%); /* Blue #0640e0 */
+ --page-background: hsl(0, 0%, 100%);
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+ --primary: hsl(224, 100%, 67%);
+ --page-background: hsl(0, 0%, 9%);
+ }
+
+}
\ No newline at end of file
diff --git a/ws/static/home.html b/ws/static/home.html
index a1eee202056bb15f206618893f8cae0acdd578b9..a192eadc76aee9d7343377f06ce66a9d8ac20ac8 100644
--- a/ws/static/home.html
+++ b/ws/static/home.html
@@ -14,6 +14,8 @@
+
+
diff --git a/ws/static/login.html b/ws/static/login.html
index 06d4a2ddaca6ae915067694f9959bbfd3cc8ad28..19930b8946440fc18c74e0a7260eb634c25da7fc 100644
--- a/ws/static/login.html
+++ b/ws/static/login.html
@@ -14,6 +14,8 @@
+
+
diff --git a/ws/static/new.html b/ws/static/new.html
index b92e0a93bf2bd69d7e45d78fca8caa143e35a35e..153f5d40758f2a39993c9caac77a8fb7ccdee80a 100644
--- a/ws/static/new.html
+++ b/ws/static/new.html
@@ -14,6 +14,8 @@
+
+
diff --git a/ws/static/select-release.html b/ws/static/select-release.html
index 85dd84e7363c2859abed4898a36a8849801e58d3..e2ad9d4c31fd2ee6503c9c081b407b2a6ce64805 100644
--- a/ws/static/select-release.html
+++ b/ws/static/select-release.html
@@ -14,6 +14,8 @@
+
+
diff --git a/ws/static/styles.css b/ws/static/styles.css
index dac4cedcf1aa97b2f919b1f10d2579b10f29b313..c31a26f49a8cc5342f0c2b0b4c5d342e1767b5be 100644
--- a/ws/static/styles.css
+++ b/ws/static/styles.css
@@ -39,17 +39,17 @@
html {
margin: auto auto;
color: #2f2f2f;
- background: white;
+ background: var(--page-background);
font-family: 'Atkinson Hyperlegible', sans-serif;
scroll-behavior: smooth;
}
a {
- color: #0640e0;
+ color: var(--primary);
}
a:visited {
- color: #0640e0;
+ color: var(--primary);
}
.two_column {
@@ -160,17 +160,9 @@ header nav a:last-of-type:visited {
@media (prefers-color-scheme: dark) {
html {
- background: #171717;
color: #ccc;
}
- a {
- color: #5582ff;
- }
-
- a:visited {
- color: #5582ff;
- }
.card {
border: 2px solid #424242;