feat: improve links and add matrix and FA logos

src/components/external-link.astro

@@ -16,5 +16,7 @@ const { cssClass, href, title } = Astro.props;
     "flex min-w-full items-center justify-center gap-4 rounded px-6 py-2 text-lg sm:px-24",
   ]}
   {href}
-  {title}><slot name="logo" /><slot /></a
+  {title}
+  target="_blank"
+  rel="external me noreferrer"><slot name="logo" /><slot /></a
 >

src/components/inline-image.astro

@@ -0,0 +1,22 @@
+---
+import type { ImageMetadata } from "astro";
+import { Image } from "astro:assets";
+
+interface Props {
+  priority?: boolean;
+  size?: number;
+  src: ImageMetadata;
+}
+
+const { priority = true, size = 24, src } = Astro.props;
+---
+
+<Image
+  alt=""
+  height={size}
+  width={size}
+  {priority}
+  {src}
+  role="presentation"
+  class="brightness-1000 grayscale"
+/>

src/components/inline-svg.astro

@@ -3,10 +3,15 @@ import type { SvgComponent } from "astro/types";
 
 interface Props {
   SvgComponent: SvgComponent;
-  svgSize?: number;
+  size?: number;
 }
 
-const { SvgComponent, svgSize = 24 } = Astro.props;
+const { size = 24, SvgComponent } = Astro.props;
 ---
 
-<SvgComponent height={svgSize} width={svgSize} role="presentation" />
+<SvgComponent
+  height={size}
+  width={size}
+  fill="currentColor"
+  role="presentation"
+/>