hamedandClaude Opus 5
2fb17d778a
Chasing the dark-mode wiring to the end turned up the actual cause. next-themes was configured with attribute="data-", which sets an attribute whose literal name is "data-": the page rendered <html data-="dark">. Both globals.css and the project's own documentation assume data-theme, so the transition rule keyed on [data-theme] never applied either, and no Tailwind selector could have matched. It is data-theme now, verified in a headless browser with prefers-color-scheme forced to dark. That is one of two reasons the booking flow looks the same in either theme. The other is simply that components/appointment/ contains zero dark: utilities — nothing there was ever styled for dark. The wiring is fixed and the 66 dark rules that do exist now compile against the real attribute; giving the booking flow a dark palette is design work, not a wiring bug, and it is not something this pass invents. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
32 lines
1004 B
JavaScript
32 lines
1004 B
JavaScript
"use client";
|
|
|
|
import { ThemeProvider } from "next-themes";
|
|
import { useEffect } from "react";
|
|
import Cookies from "js-cookie";
|
|
import { setAccessToken } from "@/lib/tokenStore";
|
|
|
|
export function Providers({ children }) {
|
|
useEffect(() => {
|
|
if (!Cookies.get("userInfo")) return;
|
|
fetch("/api/auth/refresh", { method: "POST" })
|
|
.then((res) => (res.ok ? res.json() : null))
|
|
.then((data) => {
|
|
if (data?.access_token) setAccessToken(data.access_token);
|
|
})
|
|
.catch(() => {});
|
|
}, []);
|
|
|
|
// `attribute="data-"` یک اتریبیوت با نام تحتاللفظی `data-` میساخت (`<html data-="dark">`)،
|
|
// نه `data-theme`. هم `globals.css` و هم مستند پروژه از اول `data-theme` را فرض کردهاند،
|
|
// پس هیچکدام هرگز اجرا نمیشدند.
|
|
return (
|
|
<ThemeProvider
|
|
attribute="data-theme"
|
|
defaultTheme="system"
|
|
enableSystem
|
|
>
|
|
{children}
|
|
</ThemeProvider>
|
|
);
|
|
}
|