From 4d3c4deff19853c1dc6be16b6bade461fbcfc204 Mon Sep 17 00:00:00 2001
From: John Adams <78485956+jpaoad31@users.noreply.github.com>
Date: Wed, 24 Dec 2025 16:28:45 -0800
Subject: [PATCH] prevent page rendering instability

---
 src/routes/+layout.svelte                  | 23 +++++++++++++++++++++-
 src/routes/Flash.svelte                    |  6 ++----
 src/routes/_components/WindowsZadig.svelte |  2 +-
 3 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 162f420..270e841 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -26,6 +26,25 @@
   ]
 
   let { children } = $props();
+  let fontsLoaded = $state(false);
+
+  // Explicitly load fonts before rendering to prevent FOUT
+  async function loadFonts() {
+    try {
+      await Promise.all([
+        document.fonts.load('16px "Inter Variable"'),
+        document.fonts.load('16px "JetBrains Mono Variable"'),
+      ]);
+      fontsLoaded = true;
+    } catch (error) {
+      console.warn('Font preload failed:', error);
+      fontsLoaded = true;
+    }
+  }
+
+  $effect.pre(() => {
+    loadFonts();
+  })
 </script>
 
 <svelte:head>
@@ -35,4 +54,6 @@
   {/each}
 </svelte:head>
 
-{@render children()}
+{#if fontsLoaded}
+  {@render children()}
+{/if}
diff --git a/src/routes/Flash.svelte b/src/routes/Flash.svelte
index 1cc9371..f00332c 100644
--- a/src/routes/Flash.svelte
+++ b/src/routes/Flash.svelte
@@ -94,12 +94,10 @@
     },
     [ErrorCode.REQUIREMENTS_NOT_MET]: {
       status: 'Unsupported Browser',
-      // TODO Verify that this works lol
       description: `
           This browser doesn&apos;t support WebUSB. Please use a compatible browser like 
           <a href="https://www.google.com/chrome/" target="_blank" rel="noopener noreferrer" class="text-blue-500 hover:underline font-semibold">
-            Google Chrome
-          </a>.`,
+            Google Chrome</a>.`,
       hideRetry: true,
     },
     [ErrorCode.STORAGE_SPACE]: {
@@ -320,7 +318,7 @@
 </script>
 
 <!-- Render landing page -->
-{#if wizardScreen === 'landing' && !error}
+{#if wizardScreen === 'landing' && !(error && error != ErrorCode.REQUIREMENTS_NOT_MET)}
   <LandingPage onStart={handleStart} />
 
 <!-- Render device picker -->
diff --git a/src/routes/_components/WindowsZadig.svelte b/src/routes/_components/WindowsZadig.svelte
index 6d20472..3464640 100644
--- a/src/routes/_components/WindowsZadig.svelte
+++ b/src/routes/_components/WindowsZadig.svelte
@@ -1,4 +1,4 @@
-<script lang="ts">
+<script>
   import zadigCreateNewDevice from '$lib/images/zadig_create_new_device.png'
   import zadigForm from '$lib/images/zadig_form.png'
   import { DeviceType } from "$lib/utils/manager"