fix: resolve position and size issues with external link icons (#911)

* chore(deps-dev): bump eslint-plugin-markdown to 4.0.1

* fix: resolve position and size issues with external link icons

* fix: resolve linting issue

* fix: don't add external link symbol to anchors (resolves #832)

* fix: resolve linting issue

.eslintrc.js

@@ -5,7 +5,7 @@ module.exports = {
         "fluid",
         "plugin:yml/standard",
         "plugin:react/recommended",
-        "plugin:markdown/recommended"
+        "plugin:markdown/recommended-legacy"
     ],
     ignorePatterns: ["_site/", "src/_locales/messages.js", "!.*.cjs", "!.*.js", "!.github/"],
     env: {

package.json

@@ -64,7 +64,7 @@
     "eslint": "8.57.0",
     "eslint-config-fluid": "2.1.1",
     "eslint-plugin-jsdoc": "48.2.3",
-    "eslint-plugin-markdown": "3.0.1",
+    "eslint-plugin-markdown": "4.0.1",
     "eslint-plugin-react": "7.34.1",
     "eslint-plugin-yml": "1.14.0",
     "estrella": "1.4.1",

src/_transforms/parse.js

@@ -38,6 +38,7 @@ module.exports = (value, outputPath) => {
         if (links.length > 0) {
             for (const link of links) {
                 if (
+                    link.href &&
                     !link.href.startsWith("/") &&
 					(!["localhost:3000", "localhost:8080", "idrc.ocadu.ca"].includes(link.host) || !link.host.endsWith("idrc.netlify.app"))
                 ) {

src/assets/styles/base/_base.scss

@@ -65,13 +65,11 @@ footer {
 a[hreflang],
 a[download],
 a[rel="external"] {
-    align-items: center;
-    display: inline-flex;
-    gap: 0.25em;
-
     svg {
         display: inline-block;
         inline-size: 1em;
+        margin-block-end: 0.25em;
+        margin-inline: 0.25em 0.5ch;
     }
 }