From 8b8e1df5476b4a8d6ad11caf612c0bfdb0d0358e Mon Sep 17 00:00:00 2001
From: Volker E <volker.e@wikimedia.org>
Date: Fri, 8 Sep 2017 22:47:22 -0700
Subject: [PATCH] postEdit: Use standard close icon

Making use of standard close icon and also prevent screenreaders
from reading 'x' if they ever come across the message.
Also slightly bumping `font-size` to better harmonize
with close icon and clean-up CSS.

Bug: T50067
Change-Id: I82cdad23462f62d5e8ab2eef8632a2b3ac35e93f
---
 .../src/mediawiki.action/images/close.png     | Bin 0 -> 168 bytes
 .../src/mediawiki.action/images/close.svg     |   5 +++
 .../mediawiki.action.view.postEdit.less       |  41 +++++++++---------
 3 files changed, 25 insertions(+), 21 deletions(-)
 create mode 100644 resources/src/mediawiki.action/images/close.png
 create mode 100644 resources/src/mediawiki.action/images/close.svg

diff --git a/resources/src/mediawiki.action/images/close.png b/resources/src/mediawiki.action/images/close.png
new file mode 100644
index 0000000000000000000000000000000000000000..80dde95155eb325c0e68ef3935d7fae040a2d4ca
GIT binary patch
literal 168
zcmeAS@N?(olHy`uVBq!ia0vp^A|TAd3?%E9GuQzsp#Yx{S0H`<{CNQZ0U*P{!QuV;
z_j6cwvI04bB|(0{3=Yq3qyafDo-U3d9M_W%Fgmd~s4Ui=P!Psq*y`iZGLa!5KvIK2
zX<>~4>ocd8gG~a76BI%u)H)KBL=?6t@;Gl~N;EuVd7|$KAH)CioW6X~SCoO~F?hQA
KxvX<aXaWEs9xc@X

literal 0
HcmV?d00001

diff --git a/resources/src/mediawiki.action/images/close.svg b/resources/src/mediawiki.action/images/close.svg
new file mode 100644
index 0000000000..7f7551128e
--- /dev/null
+++ b/resources/src/mediawiki.action/images/close.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+	<path d="M3.636 2.222l14.142 14.142-1.414 1.414L2.222 3.636z"/>
+	<path d="M17.778 3.636L3.636 17.778l-1.414-1.414L16.364 2.222z"/>
+</svg>
diff --git a/resources/src/mediawiki.action/mediawiki.action.view.postEdit.less b/resources/src/mediawiki.action/mediawiki.action.view.postEdit.less
index e1fa925823..d19f098529 100644
--- a/resources/src/mediawiki.action/mediawiki.action.view.postEdit.less
+++ b/resources/src/mediawiki.action/mediawiki.action.view.postEdit.less
@@ -7,7 +7,7 @@
 	height: 0;
 	left: 50%;
 	z-index: 1000;
-	font-size: 13px;
+	font-size: 14px;
 	cursor: pointer;
 }
 
@@ -19,6 +19,24 @@
 	opacity: 1;
 	.transition( opacity 250ms );
 
+	&:after {
+		content: '';
+		background: no-repeat center center;
+		.background-image-svg( 'images/close.svg', 'images/close.png' );
+		background-size: 12px 12px;
+		position: absolute;
+		right: 0.4em;
+		top: 0;
+		bottom: 0;
+		min-width: 32px;
+		min-height: 32px;
+		opacity: 0.87;
+
+		&:hover {
+			opacity: 1;
+		}
+	}
+
 	&.mw-notification {
 		padding-right: 3em;
 	}
@@ -29,32 +47,13 @@
 }
 
 .postedit-icon {
-	padding-left: 41px; /* 25 + 8 + 8 */
+	padding-left: 25px;
 	/* like min-height, but old IE compatible and keeps text vertically aligned, too */
 	line-height: 25px;
 	background-repeat: no-repeat;
-	background-position: 8px 50%;
 }
 
 .postedit-icon-checkmark {
 	/* @embed */
 	background-image: url( images/green-checkmark.png );
-	background-position: left;
-}
-
-.postedit:after {
-	content: '×';
-	position: absolute;
-	padding: 0 0.8em;
-	right: 0;
-	top: 0;
-	font-size: 1.25em;
-	font-weight: bold;
-	line-height: 2.3em;
-	text-shadow: 0 0.0625em 0 #fff;
-	opacity: 0.2;
-}
-
-.postedit:hover:after {
-	opacity: 0.4;
 }
-- 
2.20.1