Link bar on left side of main page

(Sucks on phones, but otherwise okay)
Bug fixes

src/components/ContactButton.jsx

@@ -0,0 +1,13 @@
+"use client"
+
+import * as React from "react"
+
+import { Button } from "./ui/button"
+import { cn } from '../lib/utils'
+import { icons } from "../lib/icons"
+
+export function ContactButton({variant, link}) {
+    return (
+        <a href={link} target="_blank"><Button id={`${variant}Btn`} variant="outline" size="icon" className={cn("bg-inherit border-none text-content hover:text-bkg p-1 justify-center")}  dangerouslySetInnerHTML={{ __html: icons[variant] }} /></a>
+    )
+}

src/components/Hero.astro

@@ -2,11 +2,19 @@
 import SinglePage from "../layouts/SinglePage.astro";
 import { getLangFromUrl, useTranslations } from "../i18n/utils";
 import { ContactForm } from "./ContactForm";
+import { ContactButton } from "./ContactButton";
 
 const t = useTranslations(getLangFromUrl(Astro.url))
 ---
 
 <SinglePage>
+    <!-- Contacts list -->
+    <div class="fixed left-0 top-[40%] flex flex-col text-lg text-content">
+        <ContactButton variant={"matrix"} link="https://matrix.to/#/@cyril:cyrilsebek.cz" />
+        <ContactButton variant={"telegram"} link="https://t.me/blboun3" />
+        <ContactButton variant={"github"} link="https://github.com/Blboun3" />
+        <ContactButton variant={"git"} link="https://git.cyrilsebek.cz/blboun3" />
+    </div>
     <!-- Hero Image -->
     <div class="w-full flex justify-center mt-20 ">
         <img src={t("hero").image} alt="" class="rounded-full w-[200px] h-[200px]" />