From 527c46111001f4054f45d7658d023fe83533ede0 Mon Sep 17 00:00:00 2001
From: Siddharth VP <siddharthvp@gmail.com>
Date: Mon, 30 Sep 2024 22:08:19 +0530
Subject: [PATCH] Support dark mode in Scribunto debug console

* Use Codex tokens instead of hardcoded colors, picking close ones where
 there's no exact match
* Remove unnecessary background styles that will be inherited.
* Add border on input box - looks a bit off (at least in dark mode)
without it.

Bug: T370701
Change-Id: I8076b00aff57dea177d23aaa3698471714ac4a93
---
 extension.json                                |  2 +-
 ...bunto.edit.css => ext.scribunto.edit.less} | 27 +++++++------------
 2 files changed, 11 insertions(+), 18 deletions(-)
 rename modules/{ext.scribunto.edit.css => ext.scribunto.edit.less} (67%)

diff --git a/extension.json b/extension.json
index e006c266..bd9ee04c 100644
--- a/extension.json
+++ b/extension.json
@@ -73,7 +73,7 @@
 		},
 		"ext.scribunto.edit": {
 			"scripts": "ext.scribunto.edit.js",
-			"styles": "ext.scribunto.edit.css",
+			"styles": "ext.scribunto.edit.less",
 			"dependencies": [
 				"mediawiki.api",
 				"jquery.spinner"
diff --git a/modules/ext.scribunto.edit.css b/modules/ext.scribunto.edit.less
similarity index 67%
rename from modules/ext.scribunto.edit.css
rename to modules/ext.scribunto.edit.less
index 468bfab8..e5dfb5dd 100644
--- a/modules/ext.scribunto.edit.css
+++ b/modules/ext.scribunto.edit.less
@@ -1,7 +1,4 @@
-.mw-scribunto-console-fieldset {
-	background: #fff;
-	color: #000;
-}
+@import 'mediawiki.skin.variables.less';
 
 /* Preserve line breaks, but wrap too if browser supports it */
 /* stylelint-disable-next-line selector-max-id */
@@ -13,31 +10,28 @@
 /* stylelint-disable-next-line selector-max-id */
 #mw-scribunto-input {
 	width: 100%;
-	border: 0;
+	border: 1px solid @border-color-subtle;
 	overflow: auto;
-	background: #e0e0e0;
+	background: @background-color-notice-subtle;
 }
 
 .mw-scribunto-input {
-	color: #00f;
+	color: @color-progressive--active;
 	font: inherit;
 	font-weight: bold;
 	margin-top: 0.5em;
 }
 
 .mw-scribunto-normalOutput {
-	color: #000;
-	background: #fff;
+	color: @color-base;
 }
 
 .mw-scribunto-print {
-	color: #630;
-	background: #fff;
+	color: @color-content-removed;
 }
 
 .mw-scribunto-error {
-	color: #f00;
-	background: #fff;
+	color: @color-error;
 }
 
 .mw-scribunto-propList {
@@ -46,8 +40,7 @@
 }
 
 .mw-scribunto-message {
-	color: #008000;
-	background: #fff;
+	color: @color-content-added;
 }
 
 .mw-scribunto-tabcomplete {
@@ -56,8 +49,8 @@
 }
 
 .mw-scribunto-clear {
-	color: #f00;
+	color: @color-error;
 	text-align: center;
 	margin-top: 1em;
-	border-bottom: 1px solid #f00;
+	border-bottom: 1px solid @color-error;
 }