From 387c32dd16a5557a5c7edaf599f33ccb16d1430c Mon Sep 17 00:00:00 2001
From: Moriel Schottlender <moriel@gmail.com>
Date: Fri, 29 Jun 2018 09:06:14 -0700
Subject: [PATCH] RCFilters: Fix highlight container selector in Watchlist
 overrides

Bug: T198445
Change-Id: I01f0ccc964595c0f65aca6cbcac7828ebad33818
---
 .../styles/mw.rcfilters.less                  |  4 +
 ...perWidget.highlightCircles.seenunseen.less | 85 ++++++++++---------
 2 files changed, 50 insertions(+), 39 deletions(-)

diff --git a/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.less b/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.less
index fad409bf26..390d873277 100644
--- a/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.less
+++ b/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.less
@@ -83,6 +83,10 @@
 		}
 	}
 
+	.mw-rcfilters-ui-highlights {
+		display: none;
+	}
+
 	.mw-changeslist {
 		// Reserve space for the highlight circles
 		ul,
diff --git a/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.ChangesListWrapperWidget.highlightCircles.seenunseen.less b/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.ChangesListWrapperWidget.highlightCircles.seenunseen.less
index 5f6fbea2fb..920fec3fe3 100644
--- a/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.ChangesListWrapperWidget.highlightCircles.seenunseen.less
+++ b/resources/src/mediawiki.rcfilters/styles/mw.rcfilters.ui.ChangesListWrapperWidget.highlightCircles.seenunseen.less
@@ -1,4 +1,5 @@
 @import 'mw.rcfilters.mixins';
+@import 'mw.rcfilters.variables';
 
 .mw-rcfilters-ui-changesListWrapperWidget {
 	ul {
@@ -8,59 +9,65 @@
 			list-style: none;
 		}
 	}
+}
 
-	// Make more specific for the overrides
-	div&-highlights {
+// Make more specific for the overrides
+div.mw-rcfilters-ui-highlights {
+	body.mw-rcfilters-ui-initialized & {
 		display: inline-block;
+	}
 
-		&-color {
-			&-none {
-				display: inline-block;
-				.mw-changeslist-watchedseen & {
-					.mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
-						.mw-rcfilters-mixin-circle( @highlight-none, @result-circle-diameter, 0, true, @highlight-grey, true );
-					}
-
-					.mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
-						.mw-rcfilters-mixin-circle( @highlight-none, @result-circle-diameter, 0, true, @highlight-bluedot, true );
-					}
+	&-color {
+		&-none {
+			display: inline-block;
+			.mw-changeslist-watchedseen & {
+				.mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
+					.mw-rcfilters-mixin-circle( @highlight-none, @result-circle-diameter, 0, true, @highlight-grey, true );
 				}
 
-				.mw-changeslist-watchedunseen & {
-					.mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
-						.mw-rcfilters-mixin-circle( @highlight-grey, @result-circle-diameter, 0, true, @highlight-grey );
-					}
+				.mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
+					.mw-rcfilters-mixin-circle( @highlight-none, @result-circle-diameter, 0, true, @highlight-bluedot, true );
+				}
+			}
 
-					.mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
-						.mw-rcfilters-mixin-circle( @highlight-bluedot, @result-circle-diameter, 0, true, @highlight-bluedot );
-					}
+			.mw-changeslist-watchedunseen & {
+				.mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
+					.mw-rcfilters-mixin-circle( @highlight-grey, @result-circle-diameter, 0, true, @highlight-grey );
 				}
 
+				.mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
+					.mw-rcfilters-mixin-circle( @highlight-bluedot, @result-circle-diameter, 0, true, @highlight-bluedot );
+				}
 			}
 
-			// Watchlist unseen highlighted fixes
-			// Seen (empty circle)
-			// There's no need to correct 'unseen' because that would be
-			// a filled colorful circle, which is the regular rendering
-			.mw-changeslist-watchedseen &-c1 {
-				.mw-rcfilters-mixin-circle( @highlight-c1, @result-circle-diameter, 0, true, @highlight-c1, true );
-			}
+		}
 
-			.mw-changeslist-watchedseen &-c2 {
-				.mw-rcfilters-mixin-circle( @highlight-c2, @result-circle-diameter, 0, true, @highlight-c2, true );
-			}
+		// Watchlist unseen highlighted fixes
+		// Seen (empty circle)
+		// There's no need to correct 'unseen' because that would be
+		// a filled colorful circle, which is the regular rendering
+		.mw-changeslist-watchedseen &-c1 {
+			.mw-rcfilters-mixin-circle( @highlight-c1, @result-circle-diameter, 0, true, @highlight-c1, true );
+		}
 
-			.mw-changeslist-watchedseen &-c3 {
-				.mw-rcfilters-mixin-circle( @highlight-c3, @result-circle-diameter, 0, true, @highlight-c3, true );
-			}
+		.mw-changeslist-watchedseen &-c2 {
+			.mw-rcfilters-mixin-circle( @highlight-c2, @result-circle-diameter, 0, true, @highlight-c2, true );
+		}
 
-			.mw-changeslist-watchedseen &-c4 {
-				.mw-rcfilters-mixin-circle( @highlight-c4, @result-circle-diameter, 0, true, @highlight-c4, true );
-			}
+		.mw-changeslist-watchedseen &-c3 {
+			.mw-rcfilters-mixin-circle( @highlight-c3, @result-circle-diameter, 0, true, @highlight-c3, true );
+		}
 
-			.mw-changeslist-watchedseen &-c5 {
-				.mw-rcfilters-mixin-circle( @highlight-c5, @result-circle-diameter, 0, true, @highlight-c5, true );
-			}
+		.mw-changeslist-watchedseen &-c4 {
+			.mw-rcfilters-mixin-circle( @highlight-c4, @result-circle-diameter, 0, true, @highlight-c4, true );
 		}
+
+		.mw-changeslist-watchedseen &-c5 {
+			.mw-rcfilters-mixin-circle( @highlight-c5, @result-circle-diameter, 0, true, @highlight-c5, true );
+		}
+	}
+
+	.mw-rcfilters-ui-changesListWrapperWidget & > div {
+		margin-right: @result-circle-margin;
 	}
 }
-- 
2.20.1