add matrix & use forgejo icon from react-icons instead

Author: meowpurrpur

client/public/Icons/forgejo.svg

@@ -86,15 +86,6 @@ p {
   font-weight: 900;
 }
 
-.forgejo-icon {
-  width: 20px;
-  height: 20px;
-  display: inline-block;
-  background-color: var(--accent-color);
-  mask: url("/Icons/forgejo.svg") center / contain no-repeat;
-  -webkit-mask: url("/Icons/forgejo.svg") center / contain no-repeat;
-}
-
 .accent-gradient {
   background: linear-gradient(
     90deg,

client/src/index.css

@@ -5,6 +5,8 @@ import {
   FaTiktok,
   FaYoutube,
 } from "react-icons/fa";
+import { TbBrandMatrix } from "react-icons/tb";
+import { SiForgejo } from "react-icons/si";
 import LinkButton from "../components/LinkButton";
 import useTitle from "../hooks/Title";
 import DiscordWidget from "../components/DiscordInfo";
@@ -52,6 +54,13 @@ function Home() {
             lowerText="@theolol"
             icon={<FaTelegram size={20} />}
           />
+
+          <LinkButton
+            href="https://matrix.to/#/@theo:imtheo.lol"
+            upperText="Matrix"
+            lowerText="@theo:imtheo.lol"
+            icon={<TbBrandMatrix size={20} />}
+          />
         </div>
 
         <h2>Other accounts</h2>
@@ -67,7 +76,7 @@ function Home() {
             href="https://git.imtheo.lol/theo"
             upperText="Forgejo"
             lowerText="theo"
-            icon={<span className="forgejo-icon" />}
+            icon={<SiForgejo size={20} />}
           />
 
           <LinkButton