pwa fixes

This commit is contained in:
Piotr Domański 2026-04-03 20:26:31 +02:00
parent 9f41c87309
commit 6b41eafc55
3 changed files with 31 additions and 4 deletions

View file

@ -19,6 +19,33 @@
<title>Fooder</title> <title>Fooder</title>
%sveltekit.head% %sveltekit.head%
<script>
// iOS PWA: intercept internal <a> clicks in capture phase so Safari never
// processes them as "real" navigations (which causes the browser chrome to appear).
if (window.navigator.standalone) {
document.addEventListener('click', function (e) {
var node = e.target;
while (node) {
if (node.nodeName === 'A' && node.href) {
try {
var url = new URL(node.href);
if (
url.origin === window.location.origin &&
!node.download &&
node.target !== '_blank'
) {
e.preventDefault();
history.pushState(null, '', url.pathname + url.search + url.hash);
window.dispatchEvent(new PopStateEvent('popstate', { state: null }));
}
} catch (_) {}
break;
}
node = node.parentElement;
}
}, true);
}
</script>
</head> </head>
<body data-sveltekit-preload-data="hover" class="bg-zinc-950 text-zinc-100 antialiased"> <body data-sveltekit-preload-data="hover" class="bg-zinc-950 text-zinc-100 antialiased">
<div style="display: contents">%sveltekit.body%</div> <div style="display: contents">%sveltekit.body%</div>

View file

@ -3,8 +3,7 @@
import { auth } from '$lib/auth/store.svelte'; import { auth } from '$lib/auth/store.svelte';
import { logout } from '$lib/api/auth'; import { logout } from '$lib/api/auth';
import { useQueryClient } from '@tanstack/svelte-query'; import { useQueryClient } from '@tanstack/svelte-query';
import { today } from '$lib/utils/date'; import { page } from '$app/state';
import { page } from '$app/state';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { network } from '$lib/offline/network.svelte'; import { network } from '$lib/offline/network.svelte';
import { syncOfflineQueue } from '$lib/offline/sync'; import { syncOfflineQueue } from '$lib/offline/sync';
@ -80,7 +79,7 @@
<nav class="flex-1 space-y-1"> <nav class="flex-1 space-y-1">
<a <a
href="/diary/{today()}" href="/diary/today"
class="flex items-center gap-2.5 px-3 py-2 rounded-xl text-sm font-medium transition-colors class="flex items-center gap-2.5 px-3 py-2 rounded-xl text-sm font-medium transition-colors
{isDiary ? 'bg-zinc-800 text-zinc-100' : 'text-zinc-400 hover:text-zinc-200 hover:bg-zinc-900'}" {isDiary ? 'bg-zinc-800 text-zinc-100' : 'text-zinc-400 hover:text-zinc-200 hover:bg-zinc-900'}"
> >
@ -120,7 +119,7 @@
<!-- Bottom tab bar (mobile only) --> <!-- Bottom tab bar (mobile only) -->
<nav class="lg:hidden fixed bottom-0 left-0 right-0 z-20 bg-zinc-950 border-t border-zinc-800 flex items-center pb-[var(--safe-bottom)]"> <nav class="lg:hidden fixed bottom-0 left-0 right-0 z-20 bg-zinc-950 border-t border-zinc-800 flex items-center pb-[var(--safe-bottom)]">
<a <a
href="/diary/{today()}" href="/diary/today"
class="flex-1 flex flex-col items-center gap-1 py-3 text-xs font-medium transition-colors class="flex-1 flex flex-col items-center gap-1 py-3 text-xs font-medium transition-colors
{isDiary ? 'text-green-400' : 'text-zinc-500 hover:text-zinc-300'}" {isDiary ? 'text-green-400' : 'text-zinc-500 hover:text-zinc-300'}"
> >

View file

@ -39,6 +39,7 @@ export default defineConfig({
] ]
}, },
workbox: { workbox: {
navigateFallback: '/index.html',
globPatterns: ['**/*.{js,css,html,ico,png,svg,woff2}'], globPatterns: ['**/*.{js,css,html,ico,png,svg,woff2}'],
runtimeCaching: [ runtimeCaching: [
{ {