[bskyembed] Fix landing page for iOS 26 safari dark mode (#10257)
This commit is contained in:
@@ -9,7 +9,11 @@ export function applyTheme(theme: 'light' | 'dark') {
|
|||||||
document.documentElement.classList.add(theme)
|
document.documentElement.classList.add(theme)
|
||||||
}
|
}
|
||||||
|
|
||||||
export function initSystemColorMode() {
|
export function initSystemColorMode({additionalBodyClasses = ''} = {}) {
|
||||||
|
if (additionalBodyClasses) {
|
||||||
|
document.body.classList.add(additionalBodyClasses)
|
||||||
|
}
|
||||||
|
|
||||||
applyTheme(
|
applyTheme(
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').matches
|
window.matchMedia('(prefers-color-scheme: dark)').matches
|
||||||
? 'dark'
|
? 'dark'
|
||||||
|
|||||||
@@ -28,7 +28,7 @@ export const EMBED_SCRIPT = `${EMBED_SERVICE}/static/embed.js`
|
|||||||
const root = document.getElementById('app')
|
const root = document.getElementById('app')
|
||||||
if (!root) throw new Error('No root element')
|
if (!root) throw new Error('No root element')
|
||||||
|
|
||||||
initSystemColorMode()
|
initSystemColorMode({additionalBodyClasses: 'dark:bg-dimmedBgDarken'})
|
||||||
|
|
||||||
const agent = new AtpAgent({
|
const agent = new AtpAgent({
|
||||||
service: 'https://public.api.bsky.app',
|
service: 'https://public.api.bsky.app',
|
||||||
@@ -119,7 +119,7 @@ function LandingPage() {
|
|||||||
}, [uri])
|
}, [uri])
|
||||||
|
|
||||||
return (
|
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
|
<Link
|
||||||
href="https://bsky.social/about"
|
href="https://bsky.social/about"
|
||||||
className="transition-transform hover:scale-110">
|
className="transition-transform hover:scale-110">
|
||||||
|
|||||||
Reference in New Issue
Block a user