klbr/khoj
1
0
Fork 0
mirror of https://github.com/khoaliber/khoj.git synced 2026-03-03 13:19:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve handling of dark mode theme in order to avoid jitter when loading new page

Browse Source
This commit is contained in:
sabaimran
2025-02-06 16:17:58 -08:00
parent 2e01a95cf1
commit 43e032e25a
12 changed files with 166 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/interface/web/app/agents/layout.tsx
View File

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
import { noto_sans, noto_sans_arabic } from "@/app/fonts";
import "../globals.css";
import { ContentSecurityPolicy } from "../common/layoutHelper";
import { ThemeProvider } from "../components/providers/themeProvider";
export const metadata: Metadata = {
title: "Khoj AI - Agents",
@@ -40,8 +41,26 @@ export default function RootLayout({
}>) {
return (
<html lang="en" className={`${noto_sans.variable} ${noto_sans_arabic.variable}`}>
<head>
<script
dangerouslySetInnerHTML={{
__html: `
try {
if (localStorage.getItem('theme') === 'dark' ||
(!localStorage.getItem('theme') && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.classList.add('dark');
}
} catch (e) {}
`,
}}
/>
</head>
<ContentSecurityPolicy />
<body>{children}</body>
<body>
<ThemeProvider>
{children}
</ThemeProvider>
</body>
</html>
);
}

2
src/interface/web/app/agents/page.tsx
View File

@@ -20,7 +20,7 @@ import { Dialog, DialogContent, DialogHeader, DialogTrigger } from "@/components
import LoginPrompt from "../components/loginPrompt/loginPrompt";
import { InlineLoading } from "../components/loading/loading";
import { Alert, AlertDescription } from "@/components/ui/alert";
import { useIsMobileWidth } from "../common/utils";
import { useIsDarkMode, useIsMobileWidth } from "../common/utils";
import {
AgentCard,
EditAgentSchema,