From 19e2dc939a07b92748fe528c150a7caa7db2bb8e Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Wed, 15 Apr 2026 10:05:22 -0700
Subject: [PATCH] [bskyembed] Fix landing page for iOS 26 safari dark mode
 (#10257)

---
 bskyembed/src/color-mode.ts       | 6 +++++-
 bskyembed/src/screens/landing.tsx | 4 ++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/bskyembed/src/color-mode.ts b/bskyembed/src/color-mode.ts
index b34624e312..3b9219cb3c 100644
--- a/bskyembed/src/color-mode.ts
+++ b/bskyembed/src/color-mode.ts
@@ -9,7 +9,11 @@ export function applyTheme(theme: 'light' | 'dark') {
   document.documentElement.classList.add(theme)
 }
 
-export function initSystemColorMode() {
+export function initSystemColorMode({additionalBodyClasses = ''} = {}) {
+  if (additionalBodyClasses) {
+    document.body.classList.add(additionalBodyClasses)
+  }
+
   applyTheme(
     window.matchMedia('(prefers-color-scheme: dark)').matches
       ? 'dark'
diff --git a/bskyembed/src/screens/landing.tsx b/bskyembed/src/screens/landing.tsx
index b4bb0f7e91..9c7cd68a40 100644
--- a/bskyembed/src/screens/landing.tsx
+++ b/bskyembed/src/screens/landing.tsx
@@ -28,7 +28,7 @@ export const EMBED_SCRIPT = `${EMBED_SERVICE}/static/embed.js`
 const root = document.getElementById('app')
 if (!root) throw new Error('No root element')
 
-initSystemColorMode()
+initSystemColorMode({additionalBodyClasses: 'dark:bg-dimmedBgDarken'})
 
 const agent = new AtpAgent({
   service: 'https://public.api.bsky.app',
@@ -119,7 +119,7 @@ function LandingPage() {
   }, [uri])
 
   return (
-    <main className="w-full min-h-screen flex flex-col items-center gap-8 py-14 px-4 md:pt-32 dark:bg-dimmedBgDarken dark:text-slate-200">
+    <main className="w-full min-h-dvh flex flex-col items-center gap-8 py-14 px-4 md:pt-32 dark:text-slate-200">
       <Link
         href="https://bsky.social/about"
         className="transition-transform hover:scale-110">