fix: Remove underline from trailing whitespace in external links

xyos · xyos · commit 4425ba78a8e1 · 2025-07-31T16:02:52.000+02:00
Removes the non-breaking space that caused underlines to appear below
trailing whitespace between external icon and link text. Replaces it
with margin-inline-start.

AWSUI-60840
diff --git a/src/link/internal.tsx b/src/link/internal.tsx
@@ -186,7 +186,6 @@ const InternalLink = React.forwardRef(
         {children}
         {external && (
           <span className={styles['icon-wrapper']}>
-            &nbsp;
             <span
               className={styles.icon}
               aria-label={renderedExternalIconAriaLabel}
diff --git a/src/link/styles.scss b/src/link/styles.scss
@@ -58,6 +58,7 @@
 
 .icon-wrapper {
   white-space: nowrap;
+  margin-inline-start: calc(0.25em);
 }
 
 .icon {

Original file line number	Diff line number	Diff line change
`@@ -58,6 +58,7 @@`
`58`	`58`
`59`	`59`	`.icon-wrapper {`
`60`	`60`	`white-space: nowrap;`
	`61`	`+ margin-inline-start: calc(0.25em);`
`61`	`62`	`}`
`62`	`63`
`63`	`64`	`.icon {`