Files
2026-07-12 21:49:28 +08:00

94 lines
2.3 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="ie=edge" http-equiv="X-UA-Compatible">
<meta content="webkit" name="renderer">
<title>Dev mode</title>
<script>"use strict";
(() => {
window.GLOBAL_CONFIG = {
IS_DEV: true,
THEME: "",
};
try {
const storedTheme = String(localStorage.getItem("x-theme:v1") ?? "");
let theme = storedTheme;
if (storedTheme) {
window.GLOBAL_CONFIG.THEME = storedTheme;
} else {
theme = window.matchMedia("(prefers-color-scheme: dark)").matches
? "dark"
: "light";
}
document.documentElement.setAttribute("data-theme", theme);
} catch (e) {
console.error(e);
}
})();
</script>
<script src="/main.tsx" type="module"></script>
<style>
:root {
--x-init-fg: oklch(0.1 0 0);
--x-init-body-fg: oklch(0.1 0 0);
--x-init-body-bg: oklch(0.9 0 0);
--x-init-loading-bg: oklch(0 0 0 / 0.3);
--x-init-loading-fg: oklch(0.1 0 0);
}
[data-theme="dark"] {
--x-init-fg: oklch(0.9 0 0);
--x-init-body-fg: oklch(0.9 0 0);
--x-init-body-bg: oklch(0.1 0 0);
--x-init-loading-bg: oklch(1 0 0 / 0.3);
--x-init-loading-fg: oklch(0.9 0 0);
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
body {
gap: var(--x-init-gutter);
padding: 0;
margin: 0;
line-height: 1.5;
color: var(--x-init-body-fg);
background: var(--x-init-body-bg);
}
#loading {
display: flex;
gap: 0.5em;
align-items: center;
justify-content: center;
height: 100svh;
font-family:
-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial,
"PingFang SC", "PingFang TC", "Microsoft YaHei", "Source Han Sans SC",
"Noto Sans CJK SC", sans-serif;
}
#loading::before {
box-sizing: border-box;
width: 16px;
height: 16px;
content: "";
border: 1px solid var(--x-init-loading-bg);
border-top-color: var(--x-init-loading-fg);
border-radius: 50%;
animation: spin 1s linear infinite;
}
</style>
</head>
<body>
<div id="loading">Thinking...</div>
</body>
</html>