Repository navigation
Expand file tree
/
Copy pathindex.html
More file actions
98 lines (91 loc) · 4.06 KB
/
Copy pathindex.html
File metadata and controls
98 lines (91 loc) · 4.06 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
<!doctype html>
<html lang="en-US" data-theme="light" data-accent="cinnabar" data-background="paper">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, interactive-widget=resizes-content, maximum-scale=5" />
<meta name="color-scheme" content="light dark" />
<meta name="description" content="A private, self-hosted Markdown notebook built on Cloudflare." />
<meta name="theme-color" content="#1a1817" media="(prefers-color-scheme: dark)" />
<meta name="theme-color" content="#faf9f7" media="(prefers-color-scheme: light)" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-title" content="Inkstone" />
<title>Inkstone</title>
<link rel="manifest" href="/manifest.webmanifest" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<link
rel="icon"
href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect x='3' y='3' width='26' height='26' rx='8' fill='%231C1917'/%3E%3Cpath d='M16 8.5c2.6 3.4 5.2 6.1 5.2 9a5.2 5.2 0 1 1-10.4 0c0-2.9 2.6-5.6 5.2-9z' fill='%23E06A4F'/%3E%3C/svg%3E"
/>
<script>
;(function () {
try {
var raw = localStorage.getItem('inkstone.ui')
var saved = raw ? JSON.parse(raw) : null
var pref = (saved && saved.theme) || 'system'
var accent = (saved && saved.accent) || 'cinnabar'
var background = saved && saved.background === 'white' ? 'white' : 'paper'
var dark =
pref === 'dark' ||
(pref === 'system' &&
window.matchMedia('(prefers-color-scheme: dark)').matches)
var root = document.documentElement
root.dataset.theme = dark ? 'dark' : 'light'
root.dataset.accent = accent
root.dataset.background = background
var storedLocale = localStorage.getItem('inkstone-locale')
var locale =
storedLocale === 'zh-CN' || storedLocale === 'en-US'
? storedLocale
: saved && (saved.language === 'zh-CN' || saved.language === 'en-US')
? saved.language
: navigator.language.toLowerCase().startsWith('zh')
? 'zh-CN'
: 'en-US'
root.lang = locale
document.title = 'Inkstone'
var description = document.querySelector('meta[name="description"]')
if (description) {
description.content = 'A private, self-hosted Markdown notebook built on Cloudflare.'
}
if (saved && saved.fontScale) {
root.style.setProperty('--prose-size', saved.fontScale + 'px')
}
} catch (e) {
}
})()
</script>
<style>
#boot {
position: fixed;
inset: 0;
display: grid;
place-items: center;
background: light-dark(#faf9f7, #1a1817);
z-index: 9999;
transition: opacity 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}
html[data-theme='light'] #boot { background: #faf9f7; }
html[data-theme='light'][data-background='white'] #boot { background: #fff; }
html[data-theme='dark'] #boot { background: #1a1817; }
#boot.done { opacity: 0; pointer-events: none; }
#boot svg { width: 34px; height: 34px; animation: bootPulse 1.5s ease-in-out infinite; }
@keyframes bootPulse {
0%, 100% { opacity: 0.28; transform: scale(0.97); }
50% { opacity: 0.85; transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
#boot svg { animation: none; opacity: 0.6; }
}
</style>
</head>
<body>
<div id="boot" aria-hidden="true">
<svg viewBox="0 0 32 32" fill="none">
<rect x="4.2" y="4.2" width="23.6" height="23.6" rx="7.4" stroke="#b5482e" stroke-width="2.2" />
<path d="M16 9.4c2.3 3 4.6 5.4 4.6 8a4.6 4.6 0 1 1-9.2 0c0-2.6 2.3-5 4.6-8z" fill="#b5482e" />
</svg>
</div>
<div id="root"></div>
<script type="module" src="/src/client/main.tsx"></script>
</body>
</html>