feat: refactor inline links and use heroicons

src/pages/skills.astro

@@ -1,10 +1,11 @@
 ---
-import BackIcon from "../icons/back.svg";
+import ArrowLeftCircle from "../icons/arrow-left-circle.svg";
 import BaseLayout from "../layouts/BaseLayout.astro";
 import {
   getDurationInYearsBetween as between,
   getDurationInYearsFrom as from,
 } from "../duration-utils";
+import InlineLink from "../components/inline-link.astro";
 
 const trStart = new Date(2011, 7, 1);
 
@@ -32,11 +33,8 @@ const kcStart = new Date(2026, 0, 1);
   <main class="flex items-center justify-center">
     <article>
       <div class="mb-8 flex items-baseline gap-6">
-        <a
-          href="/"
-          title="Zurück"
-          class="text-soft rounded-full outline-offset-2"
-          ><BackIcon class="size-9" /></a
+        <a href="/" title="Zurück" class="text-soft rounded-full"
+          ><ArrowLeftCircle class="size-9" /></a
         >
         <h1>Skills</h1>
       </div>
@@ -110,11 +108,10 @@ const kcStart = new Date(2026, 0, 1);
             <li>
               Public, Private &amp; Clouds – {between(cbtStart, mcB2cEnd)}+
               Jahre<br />
-              (<a
+              (<InlineLink
                 href="https://www.credly.com/badges/e06dda2d-a444-448d-809a-31565c3b8c8d/public_url"
-                target="_blank"
-                rel="external me nofollow noreferrer"
-                >AWS Certified Solutions Architect – Associate</a
+                external
+                >AWS Certified Solutions Architect – Associate</InlineLink
               >, AWS, GCP, Azure, CloudFormation, HashiCorp Terraform)
             </li>
             <li>