From d3c73b21f02620e3ccf96192e988cf557f4321fd Mon Sep 17 00:00:00 2001
From: Fomafix <fomafix@googlemail.com>
Date: Sun, 27 Aug 2017 19:35:11 +0200
Subject: [PATCH] postEdit: Generate close button with CSS instead of HTML

Also remove :hover for cursor:pointer because cursor:pointer is always
shown on hovering.

Change-Id: Ib44f927a1764f703a8c31af363ebd5a8fca27375
---
 .../mediawiki.action.view.postEdit.js              | 12 +++++-------
 .../mediawiki.action.view.postEdit.less            | 14 ++++++--------
 2 files changed, 11 insertions(+), 15 deletions(-)

diff --git a/resources/src/mediawiki.action/mediawiki.action.view.postEdit.js b/resources/src/mediawiki.action/mediawiki.action.view.postEdit.js
index 09eef5762f..e0ab45a109 100644
--- a/resources/src/mediawiki.action/mediawiki.action.view.postEdit.js
+++ b/resources/src/mediawiki.action/mediawiki.action.view.postEdit.js
@@ -48,13 +48,11 @@
 			$content.append( data.message );
 		}
 
-		$popup = $( '<div>' ).addClass( 'postedit mw-notification' ).append(
-			$content,
-			$( '<span>' ).addClass( 'postedit-close' ).text( '×' )
-		).click( function () {
-			clearTimeout( timeoutId );
-			fadeOutConfirmation();
-		} );
+		$popup = $( '<div>' ).addClass( 'postedit mw-notification' ).append( $content )
+			.click( function () {
+				clearTimeout( timeoutId );
+				fadeOutConfirmation();
+			} );
 
 		$container = $( '<div>' ).addClass( 'postedit-container' ).append( $popup );
 		timeoutId = setTimeout( fadeOutConfirmation, 3000 );
diff --git a/resources/src/mediawiki.action/mediawiki.action.view.postEdit.less b/resources/src/mediawiki.action/mediawiki.action.view.postEdit.less
index 633fd2030d..467928d7e8 100644
--- a/resources/src/mediawiki.action/mediawiki.action.view.postEdit.less
+++ b/resources/src/mediawiki.action/mediawiki.action.view.postEdit.less
@@ -8,10 +8,7 @@
 	left: 50%;
 	z-index: 1000;
 	font-size: 13px;
-
-	&:hover {
-		cursor: pointer;
-	}
+	cursor: pointer;
 }
 
 .postedit {
@@ -50,7 +47,8 @@
 	background-position: left;
 }
 
-.postedit-close {
+.postedit:after {
+	content: '×';
 	position: absolute;
 	padding: 0 0.8em;
 	right: 0;
@@ -60,8 +58,8 @@
 	line-height: 2.3em;
 	text-shadow: 0 0.0625em 0 #fff;
 	opacity: 0.2;
+}
 
-	.postedit:hover & {
-		opacity: 0.4;
-	}
+.postedit:hover:after {
+	opacity: 0.4;
 }
-- 
2.20.1