fix build fail on github pages

Author: NevoMir

index.html

@@ -5,6 +5,12 @@
     <link rel="icon" type="image/png" href="/logo.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>SimplePlain</title>
+    <link rel="preconnect" href="https://player.vimeo.com" crossorigin />
+    <link rel="preconnect" href="https://i.vimeocdn.com" crossorigin />
+    <link rel="preconnect" href="https://f.vimeocdn.com" crossorigin />
+    <link rel="dns-prefetch" href="//player.vimeo.com" />
+    <link rel="dns-prefetch" href="//i.vimeocdn.com" />
+    <link rel="dns-prefetch" href="//f.vimeocdn.com" />
     <!-- Google tag (gtag.js) -->
     <script async src="https://www.googletagmanager.com/gtag/js?id=G-K4L29KFR9M"></script>
     <script>

src/assets/projects/rl-quadruped-training/content.md

@@ -5,7 +5,6 @@
 <iframe
     src="https://player.vimeo.com/video/1148904156?autoplay=1&muted=1&loop=1&autopause=0&background=1&controls=0&title=0&byline=0&portrait=0&badge=0&dnt=1&playsinline=1"
     title="Dog Robot Cover"
-    loading="lazy"
     tabindex="-1"
     allow="autoplay; fullscreen; picture-in-picture"
     referrerpolicy="strict-origin-when-cross-origin"

src/components/video-embed.tsx

@@ -120,6 +120,7 @@ export function VideoEmbed({
                 onLoad={handleLoad}
                 onReload={() => setLoaded(!poster)}
                 ref={iframeRef}
+                loading={props.loading ?? "eager"}
                 className={cn(
                     "absolute inset-0 h-full w-full border-0 transition-opacity duration-500",
                     mediaClassName,

src/lib/project-assets.ts

@@ -269,7 +269,7 @@ export function getProjectAssets(slug: string) {
     };
 }
 
-export function getProjectHero(slug: string) {
+export function getProjectHero(slug: string): ProjectHero | undefined {
     if (heroOverrides[slug]) {
         return heroOverrides[slug];
     }

src/pages/projects/index.tsx

@@ -69,18 +69,18 @@ function normalizeInlineStyle(style?: CSSProperties | string): CSSProperties | u
     if (!style) return undefined;
     if (typeof style !== "string") return style;
 
-    const output: CSSProperties = {};
+    const output: Record<string, string> = {};
     style.split(";").forEach((rule) => {
         const [rawKey, ...rawValueParts] = rule.split(":");
         if (!rawKey || rawValueParts.length === 0) return;
         const key = rawKey.trim();
         const value = rawValueParts.join(":").trim();
         if (!key || !value) return;
         const camelKey = key.replace(/-([a-z])/g, (_, char: string) => char.toUpperCase());
-        output[camelKey as keyof CSSProperties] = value;
+        output[camelKey] = value;
     });
 
-    return output;
+    return output as CSSProperties;
 }
 
 const allProjectTags: ProjectTag[] = Array.from(