93 lines
3.5 KiB
TypeScript
93 lines
3.5 KiB
TypeScript
'use client'
|
|
|
|
/** Contenu exécuté avant hydratation (thème + fond, évite flash clair). */
|
|
export const THEME_INIT_SCRIPT = `
|
|
(function () {
|
|
try {
|
|
var path = window.location.pathname || "";
|
|
var isDrive = path === "/drive" || path.indexOf("/drive/") === 0;
|
|
var splashSeen = localStorage.getItem("ultimail-splash-seen-v1") === "1";
|
|
if (isDrive) {
|
|
splashSeen = true;
|
|
document.documentElement.dataset.routeScope = "drive";
|
|
delete document.documentElement.dataset.mailBackground;
|
|
document.documentElement.style.removeProperty("--mail-bg-layer");
|
|
document.documentElement.style.removeProperty("--mail-bg-fallback");
|
|
}
|
|
document.documentElement.dataset.splashSeen = splashSeen ? "1" : "0";
|
|
|
|
var raw = localStorage.getItem("ultimail-mail-settings");
|
|
if (!raw) return;
|
|
var parsed = JSON.parse(raw);
|
|
var state = parsed.state || parsed;
|
|
var mode = state.themeMode || "system";
|
|
var resolved =
|
|
mode === "system"
|
|
? window.matchMedia("(prefers-color-scheme: dark)").matches
|
|
? "dark"
|
|
: "light"
|
|
: mode;
|
|
document.documentElement.classList.toggle("dark", resolved === "dark");
|
|
var bgId = state.backgroundId;
|
|
if (!isDrive && bgId && bgId !== "none") {
|
|
var legacy = {
|
|
mountains: "photo-mountains",
|
|
ocean: "gradient-ocean",
|
|
forest: "photo-nature",
|
|
abstract: "gradient-blossom"
|
|
};
|
|
var id = legacy[bgId] || bgId;
|
|
var layers = {
|
|
"gradient-aurora": 'url("/mail-backgrounds/gradient-aurora.svg") center/cover no-repeat',
|
|
"gradient-sunset": 'url("/mail-backgrounds/gradient-sunset.svg") center/cover no-repeat',
|
|
"gradient-ocean": 'url("/mail-backgrounds/gradient-ocean.svg") center/cover no-repeat',
|
|
"gradient-blossom": 'url("/mail-backgrounds/gradient-blossom.svg") center/cover no-repeat',
|
|
"photo-mountains": 'url("https://picsum.photos/seed/ultimail-mountains/1920/1080") center/cover no-repeat',
|
|
"photo-ocean": 'url("https://picsum.photos/seed/ultimail-ocean/1920/1080") center/cover no-repeat',
|
|
"photo-city": 'url("https://picsum.photos/seed/ultimail-city/1920/1080") center/cover no-repeat',
|
|
"photo-nature": 'url("https://picsum.photos/seed/ultimail-nature/1920/1080") center/cover no-repeat'
|
|
};
|
|
var fallbacks = {
|
|
"gradient-aurora": "#667eea",
|
|
"gradient-sunset": "#e44d26",
|
|
"gradient-ocean": "#203a43",
|
|
"gradient-blossom": "#ffecd2",
|
|
"photo-mountains": "#5c6b73",
|
|
"photo-ocean": "#1a5276",
|
|
"photo-city": "#2c3e50",
|
|
"photo-nature": "#2d5016"
|
|
};
|
|
if (layers[id]) {
|
|
document.documentElement.dataset.mailBackground = id;
|
|
document.documentElement.style.setProperty("--mail-bg-layer", layers[id]);
|
|
document.documentElement.style.setProperty(
|
|
"--mail-bg-fallback",
|
|
fallbacks[id] || "#202124"
|
|
);
|
|
}
|
|
}
|
|
} catch (e) {}
|
|
})();
|
|
`.trim()
|
|
|
|
/**
|
|
* Script bloquant dans <head>. SSR rend script exécutable ; côté client type
|
|
* inerte pour éviter l'avertissement React 19 (le script a déjà tourné).
|
|
*/
|
|
export function ThemeInitScript() {
|
|
const isServer = typeof window === 'undefined'
|
|
|
|
return (
|
|
<script
|
|
id="ultimail-theme-init"
|
|
suppressHydrationWarning
|
|
{...(isServer
|
|
? { dangerouslySetInnerHTML: { __html: THEME_INIT_SCRIPT } }
|
|
: {
|
|
type: 'application/json' as const,
|
|
dangerouslySetInnerHTML: { __html: THEME_INIT_SCRIPT },
|
|
})}
|
|
/>
|
|
)
|
|
}
|