improve accessibility, load times

martinmiglio · martinmiglio · commit d2750e111afd · 2025-12-04T01:38:54.000-05:00
diff --git a/src/assets/index.css b/src/assets/index.css
@@ -1,6 +1,22 @@
 @import 'tailwindcss';
 @import "tw-animate-css";
 
+@font-face {
+  font-family: 'Geist';
+  src: url('./fonts/Geist-Variable.woff2') format('woff2');
+  font-weight: 100 900;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Geist Mono';
+  src: url('./fonts/GeistMono-Variable.woff2') format('woff2');
+  font-weight: 100 900;
+  font-style: normal;
+  font-display: swap;
+}
+
 @theme {
   --color-background: #0a0f1a;
   --color-foreground: #e2e8f0;
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -18,7 +18,7 @@ export default function Footer() {
               {author.url ? (
                 <a
                   href={author.url}
-                  className="text-foreground underline-offset-4 hover:underline"
+                  className="text-foreground underline underline-offset-4 hover:text-accent"
                   data-umami-event={`Footer - ${author.name}`}
                   target="_blank"
                   rel="noopener noreferrer"
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
@@ -9,7 +9,7 @@ export default function Navbar() {
     <header className="sticky top-0 z-50 border-b border-border bg-background/80 backdrop-blur-sm">
       <nav className="mx-auto flex h-16 max-w-3xl items-center justify-between px-6 md:px-8">
         <Link to="/" className="flex items-center gap-2">
-          <img src={logo} alt="py-clash-bot" width={32} height={32} />
+          <img src={logo} alt="" width={32} height={32} />
           <span className="font-semibold text-foreground">py-clash-bot</span>
         </Link>
         <div className="flex items-center gap-6">
diff --git a/src/components/cms/MarkdownLink.tsx b/src/components/cms/MarkdownLink.tsx
@@ -21,7 +21,7 @@ const MarkdownLink = ({ href, children }: MarkdownLinkProps) => {
   const isExternal = resolvedHref.startsWith('http') || resolvedHref.startsWith('//')
 
   const className =
-    'text-accent font-medium underline-offset-4 transition-colors hover:text-accent/80 hover:underline'
+    'text-accent font-medium underline underline-offset-4 transition-colors hover:text-accent/80'
 
   if (isExternal) {
     return (
diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx
@@ -27,12 +27,6 @@ export const Route = createRootRoute({
     links: [
       { rel: 'canonical', href: 'https://www.pyclashbot.app/' },
       { rel: 'icon', href: '/favicon.ico' },
-      { rel: 'preconnect', href: 'https://fonts.googleapis.com' },
-      { rel: 'preconnect', href: 'https://fonts.gstatic.com', crossOrigin: 'anonymous' },
-      {
-        rel: 'stylesheet',
-        href: 'https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap',
-      },
       { rel: 'stylesheet', href: appCss },
     ],
     scripts: [
@@ -60,6 +54,7 @@ function RootDocument({ children }: Readonly<{ children: ReactNode }>) {
   return (
     <html lang="en">
       <head>
+        <title>{title}</title>
         <HeadContent />
       </head>
       <body className="font-sans antialiased">
