Tronax
cbc03c56bf
- Add web app manifest, maskable/apple-touch icons, and a production-only service worker that caches the app shell for offline start - Improve mobile UX: responsive breakpoints from ~320px, 44px touch targets, safe-area insets, dvh heights, 16px inputs to avoid iOS zoom - Serve .webmanifest with correct content type in the Go static handler - Document PWA behavior and mobile features in the README
44 lines
1.8 KiB
HTML
44 lines
1.8 KiB
HTML
<!doctype html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
|
||
<meta name="theme-color" content="#05070c" />
|
||
<link rel="manifest" href="/manifest.webmanifest" />
|
||
<link rel="apple-touch-icon" sizes="180x180" href="/icons/apple-touch-icon.png" />
|
||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||
<meta name="mobile-web-app-capable" content="yes" />
|
||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||
<meta name="apple-mobile-web-app-title" content="WannPassts" />
|
||
<script>
|
||
// Design vor dem ersten Render anwenden (verhindert Flash beim Laden)
|
||
;(function () {
|
||
try {
|
||
var m = localStorage.getItem('wannpassts_theme')
|
||
var dark =
|
||
m === 'dark' ||
|
||
((m === null || m === 'auto') && window.matchMedia('(prefers-color-scheme: dark)').matches)
|
||
var t = dark ? 'dark' : 'light'
|
||
document.documentElement.dataset.theme = t
|
||
document.documentElement.style.colorScheme = t
|
||
} catch (e) {}
|
||
})()
|
||
</script>
|
||
<meta
|
||
name="description"
|
||
content="WannPassts – Deine freien Zeiten, geteilt per Link. Verbinde Google-, iCloud- und andere Kalender und nimm Buchungsanfragen an, ohne deine Termine preiszugeben."
|
||
/>
|
||
<title>WannPassts</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||
<link
|
||
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap"
|
||
rel="stylesheet"
|
||
/>
|
||
</head>
|
||
<body>
|
||
<div id="app"></div>
|
||
<script type="module" src="/src/main.ts"></script>
|
||
</body>
|
||
</html>
|