Add external link indicator (#1096)

reakaleek · web-flow · commit 02c344448766 · 2025-04-12T01:03:47.000+02:00
* Add external link icon

* Run prettier
diff --git a/src/Elastic.Markdown/Assets/markdown/typography.css b/src/Elastic.Markdown/Assets/markdown/typography.css
@@ -50,5 +50,10 @@
 
 	a {
 		@apply font-body text-blue-elastic hover:text-blue-elastic-100 underline;
+
+		&[href^='http']::after {
+			@apply ml-0.5;
+			content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='grey' height='16'><path d='M6.22 8.72a.75.75 0 0 0 1.06 1.06l5.22-5.22v1.69a.75.75 0 0 0 1.5 0v-3.5a.75.75 0 0 0-.75-.75h-3.5a.75.75 0 0 0 0 1.5h1.69L6.22 8.72Z' /><path d='M3.5 6.75c0-.69.56-1.25 1.25-1.25H7A.75.75 0 0 0 7 4H4.75A2.75 2.75 0 0 0 2 6.75v4.5A2.75 2.75 0 0 0 4.75 14h4.5A2.75 2.75 0 0 0 12 11.25V9a.75.75 0 0 0-1.5 0v2.25c0 .69-.56 1.25-1.25 1.25h-4.5c-.69 0-1.25-.56-1.25-1.25v-4.5Z' /></svg>");
+		}
 	}
 }

Original file line number	Diff line number	Diff line change
`@@ -50,5 +50,10 @@`
`50`	`50`
`51`	`51`	`a {`
`52`	`52`	`@apply font-body text-blue-elastic hover:text-blue-elastic-100 underline;`
	`53`	`+`
	`54`	`+ &[href^='http']::after {`
	`55`	`+ @apply ml-0.5;`
	`56`	+ content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='grey' height='16'><path d='M6.22 8.72a.75.75 0 0 0 1.06 1.06l5.22-5.22v1.69a.75.75 0 0 0 1.5 0v-3.5a.75.75 0 0 0-.75-.75h-3.5a.75.75 0 0 0 0 1.5h1.69L6.22 8.72Z' /><path d='M3.5 6.75c0-.69.56-1.25 1.25-1.25H7A.75.75 0 0 0 7 4H4.75A2.75 2.75 0 0 0 2 6.75v4.5A2.75 2.75 0 0 0 4.75 14h4.5A2.75 2.75 0 0 0 12 11.25V9a.75.75 0 0 0-1.5 0v2.25c0 .69-.56 1.25-1.25 1.25h-4.5c-.69 0-1.25-.56-1.25-1.25v-4.5Z' /></svg>");
	`57`	`+ }`
`53`	`58`	`}`
`54`	`59`	`}`