The new window icon is not showing on some WordPress.com sites, due to conflict with JetPack and how .com handles load order

[christophermhinds]

From Gen Herres:

I recently just loaded a site onto WordPress .com and had issues with the plugin. It didn't show the icon. When I looked into it, .com is loading in content to reset some variables. And that content is loaded on the page, overriding your plugin.

:root {
--font-headings: unset;
--font-base: unset;
--font-headings-default: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
--font-base-default: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

This comes from Jetpack, which .com requires.

<style id='jetpack-global-styles-frontend-style-inline-css'> :root { --font-headings: unset; --font-base: unset; --font-headings-default: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; --font-base-default: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;} </style>

So what I did was I added the following to my child theme to override their override and use a unique variable name instead of "font-base".

:root {
--nd-font-base: 'anww', sans-serif;
}
/* fix for accessibility new window warnings */
.anww-external-link-icon.anww-external-link-icon {
font: normal normal normal 1em var(--nd-font-base) !important;
}

For the plugin, if you update to using a unique variable instead of "font-base", so something like "anww-font-base" everything should be fine.