From b829f17d54de41d66c6bd6a80e6ae784c1ec7ccf Mon Sep 17 00:00:00 2001
From: Volker E <volker.e@wikimedia.org>
Date: Mon, 22 Feb 2016 20:21:36 -0800
Subject: [PATCH] mediawiki.ui: Button group active buttons unchanged on user
 interaction

Applying default cursor and making active button's hover state behave same
as normal state for improved user experience.

Bug: T77916
Depends-On: Ib89500d70b3e79edcf9ba989f05a311e0edec82b
Change-Id: I8fd74c28ccb89df1e257aa3d63d362697c4542ed
---
 .../mediawiki.less/mediawiki.ui/mixins.less   |  1 +
 .../src/mediawiki.ui/components/buttons.less  | 34 +++++++++++--------
 2 files changed, 21 insertions(+), 14 deletions(-)

diff --git a/resources/src/mediawiki.less/mediawiki.ui/mixins.less b/resources/src/mediawiki.less/mediawiki.ui/mixins.less
index 1b31956d8e..93b7265f39 100644
--- a/resources/src/mediawiki.less/mediawiki.ui/mixins.less
+++ b/resources/src/mediawiki.less/mediawiki.ui/mixins.less
@@ -53,6 +53,7 @@
 	}
 
 	&:active,
+	&.is-on,
 	&.mw-ui-checked {
 		background: @activeColor;
 		box-shadow: none;
diff --git a/resources/src/mediawiki.ui/components/buttons.less b/resources/src/mediawiki.ui/components/buttons.less
index 71febe3a45..40a67c52e4 100644
--- a/resources/src/mediawiki.ui/components/buttons.less
+++ b/resources/src/mediawiki.ui/components/buttons.less
@@ -253,29 +253,35 @@ a.mw-ui-button {
 //
 // Markup:
 // <div class="mw-ui-button-group">
-//   <div class="mw-ui-button">A</div>
+//   <div class="mw-ui-button is-on">A</div>
 //   <div class="mw-ui-button">B</div>
 //   <div class="mw-ui-button">C</div>
 //   <div class="mw-ui-button">D</div>
 // </div><div style="clear:both"></div>
 //
 // Styleguide 2.2.
-.mw-ui-button-group > * {
-	min-width: 48px;
-	border-radius: 0;
-	float: left;
+.mw-ui-button-group {
+	& > * {
+		min-width: 48px;
+		border-radius: 0;
+		float: left;
 
-	&:first-child {
-		border-top-left-radius: @borderRadius;
-		border-bottom-left-radius: @borderRadius;
-	}
+		&:first-child {
+			border-top-left-radius: @borderRadius;
+			border-bottom-left-radius: @borderRadius;
+		}
+
+		&:not( :first-child ) {
+			border-left: 0;
+		}
 
-	&:not( :first-child ) {
-		border-left: 0;
+		&:last-child {
+			border-top-right-radius: @borderRadius;
+			border-bottom-right-radius: @borderRadius;
+		}
 	}
 
-	&:last-child{
-		border-top-right-radius: @borderRadius;
-		border-bottom-right-radius: @borderRadius;
+	& .is-on .button {
+		cursor: default;
 	}
 }
-- 
2.20.1