Prettier through whole project. Updated home page to include

introduction. Includes container for projects, systems, and about
section with animation.

frontend/src/components/Header.jsx

@@ -9,7 +9,7 @@ export default function Header({ theme }) {
         { label: "Forgejo Git", url: "https://git.aramjonghu.nl" },
         { label: "Stream", url: "https://stream.aramjonghu.nl" },
         { label: "SearXNG", url: "https://xng.aramjonghu.nl" },
-        { label: "zach-dev gitea", url: "https://git.zach-dev.cc"}
+        { label: "Gitea zach-dev", url: "https://git.zach-dev.cc" },
     ];
 
     const goHome = () => {
@@ -30,7 +30,7 @@ export default function Header({ theme }) {
                     <a
                         key={item.label}
                         href={item.url}
-                        className="text-ctp-text hover:text-ctp-green-900 border rounded border-ctp-white-800 hover:border-ctp-green-900 cursor-pointer px-3 py-1 transition-colors"
+                        className="ui-btn ui-btn:hover"
                     >
                         {item.label}
                     </a>
@@ -38,10 +38,7 @@ export default function Header({ theme }) {
             </nav>
 
             <div>
-                <button
-                    className="text-ctp-text hover:text-ctp-green-900 border rounded border-ctp-white-800 hover:border-ctp-green-900 cursor-pointer px-3 py-1"
-                    onClick={toggleTheme}
-                >
+                <button className="ui-btn ui-btn:hover" onClick={toggleTheme}>
                     {currentTheme === "macchiato" ? "🌙 Dark" : "☀️ Light"}
                 </button>
             </div>