marketing-shibata50/cmux
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add blocking script to prevent theme flash on load

Browse source 
Inline script in <head> reads localStorage theme before first paint
and applies .dark class synchronously. Defaults to dark to match
next-themes defaultTheme config.
This commit is contained in:
Lawrence Chen 2026-02-10 01:11:41 -08:00
parent c640355154
commit a15baba93b
1 changed files with 35 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

38
web/app/layout.tsx
View file

@ -19,20 +19,25 @@ const geistMono = Geist_Mono({
export const metadata: Metadata = {
title: "cmux — The terminal built for multitasking",
description:
"Native macOS terminal built on Ghostty. Vertical tabs, notification rings when agents need attention, split panes, and a socket API for automation.",
"Native macOS terminal built on Ghostty. Works with Claude Code, Codex, OpenCode, Gemini CLI, Kiro, Aider, and any CLI tool. Vertical tabs, notification rings, split panes, and a socket API.",
keywords: [
"terminal",
"macOS",
"coding agents",
"Claude Code",
"Codex",
"OpenCode",
"Gemini CLI",
"Kiro",
"Aider",
"Ghostty",
"AI",
"terminal for AI agents",
],
openGraph: {
title: "cmux — The terminal built for multitasking",
description:
"Native macOS terminal built on Ghostty. Vertical tabs, notification rings, split panes, and a socket API.",
"Native macOS terminal for AI coding agents. Works with Claude Code, Codex, OpenCode, Gemini CLI, Kiro, Aider, and any CLI tool.",
url: "https://cmux.dev",
siteName: "cmux",
type: "website",
@ -41,7 +46,7 @@ export const metadata: Metadata = {
card: "summary",
title: "cmux — The terminal built for multitasking",
description:
"Native macOS terminal built on Ghostty. Vertical tabs, notification rings, split panes, and a socket API.",
"Native macOS terminal for AI coding agents. Works with Claude Code, Codex, OpenCode, Gemini CLI, Kiro, Aider, and any CLI tool.",
},
metadataBase: new URL("https://cmux.dev"),
};
@ -51,11 +56,38 @@ export default function RootLayout({
}: Readonly<{
children: React.ReactNode;
}>) {
const jsonLd = {
"@context": "https://schema.org",
"@type": "SoftwareApplication",
name: "cmux",
operatingSystem: "macOS",
applicationCategory: "DeveloperApplication",
url: "https://cmux.dev",
downloadUrl:
"https://github.com/manaflow-ai/cmux/releases/latest/download/cmux-macos.dmg",
description:
"Native macOS terminal built on Ghostty. Works with Claude Code, Codex, OpenCode, Gemini CLI, Kiro, Aider, and any CLI tool. Vertical tabs, notification rings, split panes, and a socket API.",
keywords:
"terminal, macOS, Claude Code, Codex, OpenCode, Gemini CLI, Kiro, Aider, AI coding agents, Ghostty",
offers: { "@type": "Offer", price: "0", priceCurrency: "USD" },
};
return (
<html lang="en" suppressHydrationWarning>
<head>
<script
dangerouslySetInnerHTML={{
__html: `(function(){try{var t=localStorage.getItem("theme");if(t==="light")return;if(t==="system"&&window.matchMedia("(prefers-color-scheme:light)").matches)return;document.documentElement.classList.add("dark")}catch(e){}})()`,
}}
/>
</head>
<body
className={`${geistSans.variable} ${geistMono.variable} font-sans antialiased`}
>
<script
type="application/ld+json"
dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
/>
<Providers>
{children}
<SiteFooter />