From 8af7357f0678053cf6e60b7af139157ef76e07fe Mon Sep 17 00:00:00 2001
From: alistair3149 <alistair31494322@gmail.com>
Date: Tue, 8 Nov 2022 13:51:39 -0500
Subject: [PATCH] =?UTF-8?q?feat(core):=20=E2=9C=A8=20update=20external=20l?=
 =?UTF-8?q?ink=20styles?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/typography.less                    | 36 +++++++++++--------
 .../images/linkExternal-ltr.svg               |  8 -----
 .../images/linkExternal-rtl.svg               |  8 -----
 .../images/linkExternal.svg                   |  6 ++++
 4 files changed, 27 insertions(+), 31 deletions(-)
 delete mode 100644 resources/skins.citizen.styles/images/linkExternal-ltr.svg
 delete mode 100644 resources/skins.citizen.styles/images/linkExternal-rtl.svg
 create mode 100644 resources/skins.citizen.styles/images/linkExternal.svg

diff --git a/resources/skins.citizen.styles/common/typography.less b/resources/skins.citizen.styles/common/typography.less
index 31e195e9..a8412af2 100644
--- a/resources/skins.citizen.styles/common/typography.less
+++ b/resources/skins.citizen.styles/common/typography.less
@@ -143,21 +143,19 @@ figcaption,
 
 // External links
 .mw-parser-output {
-	a.external {
-		&:after {
-			display: inline-block;
-			width: 0.75em;
-			height: 0.75em;
-			margin-left: 0.25em;
-			background-color: currentcolor;
-			content: '';
-			/* @embed */
-			-webkit-mask: url( images/linkExternal-ltr.svg ) no-repeat 50% 50%;
-			/* @embed */
-			mask: url( images/linkExternal-ltr.svg ) no-repeat 50% 50%;
-			-webkit-mask-size: contain;
-			mask-size: contain;
-		}
+	a.external:after {
+		display: inline-block;
+		width: 0.75em;
+		height: 0.75em;
+		margin-left: 0.25em;
+		background-color: currentcolor;
+		content: '';
+		/* @embed */
+		-webkit-mask: url( images/linkExternal.svg ) no-repeat 50% 50%;
+		/* @embed */
+		mask: url( images/linkExternal.svg ) no-repeat 50% 50%;
+		-webkit-mask-size: contain;
+		mask-size: contain;
 	}
 
 	.plainlinks a.external:after {
@@ -165,6 +163,14 @@ figcaption,
 	}
 }
 
+.mw-content-rtl {
+	.mw-parser-output {
+		a.external:after {
+			transform: scaleX( -1 );
+		}
+	}
+}
+
 @media ( max-width: @width-breakpoint-tablet ) {
 	#mw-content-text {
 		figcaption,
diff --git a/resources/skins.citizen.styles/images/linkExternal-ltr.svg b/resources/skins.citizen.styles/images/linkExternal-ltr.svg
deleted file mode 100644
index eadfe652..00000000
--- a/resources/skins.citizen.styles/images/linkExternal-ltr.svg
+++ /dev/null
@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
-	<title>
-		external link
-	</title>
-	<path d="M17 17H3V3h5V1H3a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5h-2z"/>
-	<path d="m11 1 3.29 3.29-5.73 5.73 1.42 1.42 5.73-5.73L19 9V1z"/>
-</svg>
diff --git a/resources/skins.citizen.styles/images/linkExternal-rtl.svg b/resources/skins.citizen.styles/images/linkExternal-rtl.svg
deleted file mode 100644
index 288cb5d2..00000000
--- a/resources/skins.citizen.styles/images/linkExternal-rtl.svg
+++ /dev/null
@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
-	<title>
-		external link
-	</title>
-	<path d="M3 12H1v5c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2h-5v2h5v14H3z"/>
-	<path d="m1 9 3.3-3.3 5.7 5.7 1.4-1.4-5.7-5.7L9 1H1z"/>
-</svg>
diff --git a/resources/skins.citizen.styles/images/linkExternal.svg b/resources/skins.citizen.styles/images/linkExternal.svg
new file mode 100644
index 00000000..1ca46ebf
--- /dev/null
+++ b/resources/skins.citizen.styles/images/linkExternal.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" aria-hidden="true" viewBox="0 0 20 20">
+	<g fill="currentColor">
+		<path d="M17 17H3V3h5V1H3a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5h-2z"/>
+		<path d="m11 1 3.29 3.29-5.73 5.73 1.42 1.42 5.73-5.73L19 9V1z"/>
+	</g>
+</svg>