diff --git a/next-canary/package.json b/next-canary/package.json index 5a6711c..3099ec3 100644 --- a/next-canary/package.json +++ b/next-canary/package.json @@ -13,7 +13,8 @@ "groq": "^3.64.2", "next": "canary", "react": "rc", - "react-dom": "rc" + "react-dom": "rc", + "use-effect-event": "^1.0.2" }, "devDependencies": { "@types/node": "^20", diff --git a/next-canary/src/app/globals.css b/next-canary/src/app/globals.css index 6b717ad..ed0ea58 100644 --- a/next-canary/src/app/globals.css +++ b/next-canary/src/app/globals.css @@ -2,20 +2,14 @@ @tailwind components; @tailwind utilities; -:root { - --background: #ffffff; - --foreground: #171717; +@property --theme-text { + syntax: ''; + inherits: true; + initial-value: #000; } -@media (prefers-color-scheme: dark) { - :root { - --background: #0a0a0a; - --foreground: #ededed; - } -} - -body { - color: var(--foreground); - background: var(--background); - font-family: Arial, Helvetica, sans-serif; +@property --theme-background { + syntax: ''; + inherits: true; + initial-value: #fff; } diff --git a/next-canary/src/app/layout.tsx b/next-canary/src/app/layout.tsx index f7fa87e..f29595d 100644 --- a/next-canary/src/app/layout.tsx +++ b/next-canary/src/app/layout.tsx @@ -1,34 +1,21 @@ -import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; -import "./globals.css"; - -const geistSans = Geist({ - variable: "--font-geist-sans", - subsets: ["latin"], -}); - -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", - subsets: ["latin"], -}); +import type {Metadata} from 'next' +import './globals.css' export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", -}; + title: 'Create Next App', + description: 'Generated by create next app', +} export default function RootLayout({ children, }: Readonly<{ - children: React.ReactNode; + children: React.ReactNode }>) { return ( - + {children} - ); + ) } diff --git a/next-canary/tailwind.config.ts b/next-canary/tailwind.config.ts index 109807b..f3b29eb 100644 --- a/next-canary/tailwind.config.ts +++ b/next-canary/tailwind.config.ts @@ -1,18 +1,28 @@ -import type { Config } from "tailwindcss"; +import type {Config} from 'tailwindcss' export default { content: [ - "./src/pages/**/*.{js,ts,jsx,tsx,mdx}", - "./src/components/**/*.{js,ts,jsx,tsx,mdx}", - "./src/app/**/*.{js,ts,jsx,tsx,mdx}", + './src/pages/**/*.{js,ts,jsx,tsx,mdx}', + './src/components/**/*.{js,ts,jsx,tsx,mdx}', + './src/app/**/*.{js,ts,jsx,tsx,mdx}', ], theme: { extend: { - colors: { - background: "var(--background)", - foreground: "var(--foreground)", + backgroundColor: { + 'theme': 'var(--theme-background,#fff)', + 'theme-button': 'var(--theme-text,#fff)', + }, + textColor: { + 'theme': 'var(--theme-text,#000)', + 'theme-button': 'var(--theme-background,#fff)', + }, + ringColor: { + theme: 'var(--theme-text,#000)', + }, + ringOffsetColor: { + theme: 'var(--theme-background,#fff)', }, }, }, plugins: [], -} satisfies Config; +} satisfies Config diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3e083b9..519be78 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -216,6 +216,9 @@ importers: react-dom: specifier: rc version: 19.0.0-rc.1(react@19.0.0-rc.1) + use-effect-event: + specifier: ^1.0.2 + version: 1.0.2(react@19.0.0-rc.1) devDependencies: '@types/node': specifier: ^20