Repository navigation
Expand file tree
/
Copy pathindex.html
More file actions
106 lines (106 loc) · 3.11 KB
/
Copy pathindex.html
File metadata and controls
106 lines (106 loc) · 3.11 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, viewport-fit=cover"
/>
<meta name="theme-color" content="#f7f7f8" />
<style>
:root {
background: #f7f7f8;
color-scheme: light;
}
:root.dark {
background: #0f0f11;
color-scheme: dark;
}
body {
margin: 0;
}
.boot-shell {
box-sizing: border-box;
min-height: 100dvh;
display: grid;
place-items: center;
padding: 24px;
color: #18181b;
font:
500 15px/1.5 -apple-system,
BlinkMacSystemFont,
"Segoe UI",
sans-serif;
}
.boot-shell__content {
display: grid;
justify-items: center;
gap: 14px;
}
.boot-shell__mark {
width: 34px;
height: 34px;
border: 3px solid color-mix(in srgb, #0e8a55 22%, transparent);
border-top-color: #0e8a55;
border-radius: 50%;
animation: boot-shell-spin 900ms linear infinite;
}
.dark .boot-shell {
color: #f2f2f3;
}
@keyframes boot-shell-spin {
to {
transform: rotate(360deg);
}
}
@media (prefers-reduced-motion: reduce) {
.boot-shell__mark {
animation: none;
}
}
</style>
<script id="theme-bootstrap">
// 在样式和应用模块加载前恢复外观,避免刷新时先绘制浅色页面。
(() => {
let mode = "system";
let palette = "green";
try {
mode = localStorage.getItem("meterleaf-theme") || "system";
const saved = localStorage.getItem("meterleaf-palette");
if (saved === "indigo" || saved === "mono") palette = saved;
} catch {}
const dark =
mode === "dark" ||
(mode !== "light" &&
matchMedia("(prefers-color-scheme: dark)").matches);
document.documentElement.classList.toggle("dark", dark);
document.documentElement.dataset.palette = palette;
document.querySelector('meta[name="theme-color"]').content = dark
? "#0f0f11"
: "#f7f7f8";
})();
</script>
<link rel="icon" type="image/svg+xml" sizes="any" href="/favicon.svg" />
<link rel="manifest" href="/manifest.webmanifest" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="/icons/meterleaf-leaf-180.png"
/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-title" content="Meterleaf" />
<meta name="description" content="Meterleaf:独立的 AI 用量账本。" />
<title>Meterleaf</title>
</head>
<body>
<div id="root">
<div class="boot-shell" role="status" aria-live="polite">
<div class="boot-shell__content">
<span class="boot-shell__mark" aria-hidden="true"></span>
<span>正在连接 Meterleaf…</span>
</div>
</div>
</div>
<script type="module" src="/src/web/main.tsx"></script>
</body>
</html>