From 4a2e3f8917732e1c874ae88fd550fda256ba5fec Mon Sep 17 00:00:00 2001
From: Jon Robson <jdlrobson@gmail.com>
Date: Tue, 13 Feb 2024 14:14:42 -0800
Subject: [PATCH] Provide a visual hint that night mode is being triggered in
 Vector

Working on feature flag not having this is causing confusion. This
will speed up development by allowing me to more easily determine what
mode I am in at all times.

Change-Id: I5d4168bbf7df41f4754b36c6e6aa4955dbc609bb
---
 .../skins.vector.styles/CSSCustomProperties.less  | 15 +++++++++++++++
 resources/skins.vector.styles/variables.less      |  2 +-
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/resources/skins.vector.styles/CSSCustomProperties.less b/resources/skins.vector.styles/CSSCustomProperties.less
index 2e8e713ca..2849de5db 100644
--- a/resources/skins.vector.styles/CSSCustomProperties.less
+++ b/resources/skins.vector.styles/CSSCustomProperties.less
@@ -16,6 +16,11 @@
 :root {
 	--font-size-medium: unit( @font-size-small, rem );
 	--line-height-medium: @line-height-small;
+	--background-color-base: @background-color-base;
+}
+
+.night-mode-palette() {
+	--background-color-base: #101418;
 }
 
 .vector-feature-custom-font-size-clientpref-1 {
@@ -27,3 +32,13 @@
 	--font-size-medium: unit( @font-size-x-large, rem );
 	--line-height-medium: 1.3;
 }
+
+html.skin-night-mode-clientpref-1 {
+	.night-mode-palette();
+}
+
+@media ( prefers-color-scheme: dark ) {
+	html.skin-night-mode-clientpref-2 {
+		.night-mode-palette();
+	}
+}
diff --git a/resources/skins.vector.styles/variables.less b/resources/skins.vector.styles/variables.less
index 9b40477e9..fbe18f230 100644
--- a/resources/skins.vector.styles/variables.less
+++ b/resources/skins.vector.styles/variables.less
@@ -59,7 +59,7 @@
 @padding-blockquote: 8px 32px;
 
 @background-color-secondary--modern: #f8f9fa;
-@background-color-page-container: @background-color-base;
+@background-color-page-container: var( --background-color-base );
 
 // Navigation
 @background-color-secondary: #f6f6f6;