From fb6146053aa5eef78a294e585a2d0c9770d0e619 Mon Sep 17 00:00:00 2001
From: Ed Sanders <esanders@wikimedia.org>
Date: Wed, 23 Dec 2020 16:50:32 +0000
Subject: [PATCH] Convert highlighter.css to less

Change-Id: I41f6d9536a589b6423f4fc619d5058335083a570
---
 extension.json           |  2 +-
 modules/highlighter.css  | 78 ----------------------------------------
 modules/highlighter.less | 77 +++++++++++++++++++++++++++++++++++++++
 3 files changed, 78 insertions(+), 79 deletions(-)
 delete mode 100644 modules/highlighter.css
 create mode 100644 modules/highlighter.less

diff --git a/extension.json b/extension.json
index c29843cb0..4cf0cfff1 100644
--- a/extension.json
+++ b/extension.json
@@ -97,7 +97,7 @@
 				"dt.debug.js",
 				"highlighter.js"
 			],
-			"styles": "highlighter.css",
+			"styles": "highlighter.less",
 			"dependencies": [
 				"ext.discussionTools.init"
 			]
diff --git a/modules/highlighter.css b/modules/highlighter.css
deleted file mode 100644
index 0e7818109..000000000
--- a/modules/highlighter.css
+++ /dev/null
@@ -1,78 +0,0 @@
-/* stylelint-disable color-named */
-/* stylelint-disable unit-blacklist */
-
-.dt-highlighter-timestamp {
-	border: 2px solid forestgreen;
-	border-radius: 6px;
-	margin: -2px;
-}
-
-.dt-highlighter-signature {
-	border: 2px solid blue;
-	border-bottom-left-radius: 6px;
-	border-top-left-radius: 6px;
-	border-right: 0;
-	margin: -2px;
-	margin-right: 0;
-}
-
-.dt-highlighter-signature + .dt-highlighter-timestamp {
-	border-left: 0;
-	padding-left: 0;
-	margin-left: 0;
-	border-bottom-left-radius: 0;
-	border-top-left-radius: 0;
-}
-
-.dt-highlighter-timestamp:hover:after {
-	content: ' ' attr( title );
-}
-
-.dt-highlighter-comment {
-	position: absolute;
-	opacity: 0.2;
-	pointer-events: none;
-}
-
-.dt-highlighter-comment:nth-of-type( 2n ) {
-	background: lightpink;
-}
-
-.dt-highlighter-comment:nth-of-type( 2n + 1 ) {
-	background: skyblue;
-}
-
-.dt-highlighter-comment-ruler {
-	position: absolute;
-	box-sizing: border-box;
-	border-left: 2px solid #ccc;
-	border-bottom: 2px solid #ccc;
-	border-bottom-left-radius: 3px;
-}
-
-.dt-highlighter-comment-warnings {
-	position: absolute;
-	color: transparent;
-	font-size: 0;
-	height: 1em;
-	width: 1em;
-	pointer-events: none;
-}
-
-.dt-highlighter-comment-warnings:hover {
-	background: white;
-	color: red;
-	font-size: inherit;
-	pointer-events: all;
-}
-
-.dt-highlighter-comment-warnings:before {
-	content: '⚠';
-	color: #000;
-	background: #fff;
-	font-size: 1rem;
-	pointer-events: all;
-	margin-left: -1em;
-	position: absolute;
-	z-index: 1;
-}
diff --git a/modules/highlighter.less b/modules/highlighter.less
new file mode 100644
index 000000000..e3c8d23d3
--- /dev/null
+++ b/modules/highlighter.less
@@ -0,0 +1,77 @@
+/* stylelint-disable color-named */
+
+.dt-highlighter-timestamp {
+	border: 2px solid forestgreen;
+	border-radius: 6px;
+	margin: -2px;
+
+	&:hover:after {
+		content: ' ' attr( title );
+	}
+}
+
+.dt-highlighter-signature {
+	border: 2px solid blue;
+	border-bottom-left-radius: 6px;
+	border-top-left-radius: 6px;
+	border-right: 0;
+	margin: -2px;
+	margin-right: 0;
+
+	& + .dt-highlighter-timestamp {
+		border-left: 0;
+		padding-left: 0;
+		margin-left: 0;
+		border-bottom-left-radius: 0;
+		border-top-left-radius: 0;
+	}
+}
+
+.dt-highlighter-comment {
+	position: absolute;
+	opacity: 0.2;
+	pointer-events: none;
+
+	&:nth-of-type( 2n ) {
+		background: lightpink;
+	}
+
+	&:nth-of-type( 2n + 1 ) {
+		background: skyblue;
+	}
+
+	&-ruler {
+		position: absolute;
+		box-sizing: border-box;
+		border-left: 2px solid #ccc;
+		border-bottom: 2px solid #ccc;
+		border-bottom-left-radius: 3px;
+	}
+
+	&-warnings {
+		position: absolute;
+		color: transparent;
+		font-size: 0;
+		height: 1em;
+		width: 1em;
+		pointer-events: none;
+
+		&:hover {
+			background: white;
+			color: red;
+			font-size: inherit;
+			pointer-events: all;
+		}
+
+		&:before {
+			content: '⚠';
+			color: #000;
+			background: #fff;
+			font-size: 1rem;
+			pointer-events: all;
+			margin-left: -1em;
+			position: absolute;
+			z-index: 1;
+		}
+	}
+}