improve PWA feel on iOS: offline fallback, overscroll, tap feedback, dark status bar, apple touch icon
Add offline.html served by the service worker when a never-visited route is requested without network. Disable rubber-band overscroll bounce and gray tap highlights so standalone mode feels less like a webview. Split theme-color by prefers-color-scheme so the iOS status bar matches dark mode, and add a proper 180x180 apple-touch-icon instead of downscaling the 192px icon.
This commit is contained in:
@@ -46,6 +46,7 @@
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
[x-cloak] {
|
||||
@@ -56,6 +57,7 @@ html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overscroll-behavior-y: none;
|
||||
}
|
||||
|
||||
body {
|
||||
@@ -239,6 +241,7 @@ p {
|
||||
text-decoration: none;
|
||||
color: var(--color-text-muted);
|
||||
font-size: 11px;
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
.bottom-tab-bar .tab-item svg {
|
||||
@@ -277,6 +280,7 @@ p {
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
transition: background-color 0.15s ease, opacity 0.15s ease;
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@@ -452,6 +456,7 @@ label {
|
||||
gap: 8px var(--space-2);
|
||||
padding: 12px 4px;
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
.habit-item:last-child {
|
||||
|
||||
Reference in New Issue
Block a user