c-l/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-04-21 15:36:26 +02:00
Code Releases Activity

feat(web): slight fade in animation when open/close asset-viewer ()

Browse source
This commit is contained in:
Alex 2025-02-24 16:38:07 -06:00 • committed by GitHub
parent 4be2351d21
commit 57829cee26
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 17 additions and 2 deletions
web/src
app.css
lib/utils
navigation.ts

5
web/src/app.css
View file

@ -168,3 +168,8 @@ input:focus-visible {
scrollbar-gutter: stable both-edges;
}
}
::view-transition-old(root),
::view-transition-new(root) {
animation-duration: 250ms;
}

14
web/src/lib/utils/navigation.ts
View file

@ -112,7 +112,7 @@ async function navigateAssetRoute(route: AssetRoute, options?: NavOptions) {
const next = assetId ? currentUrlReplaceAssetId(assetId) : currentUrlWithoutAsset();
const current = currentUrl();
if (next !== current || options?.forceNavigate) {
await goto(next, options);
await navigateWithTransition(next, options);
}
}
@ -122,7 +122,7 @@ async function navigateAssetGridRoute(route: AssetGridRoute, options?: NavOption
const next = replaceScrollTarget(assetUrl, assetGridScrollTarget);
const current = currentUrl();
if (next !== current || options?.forceNavigate) {
await goto(next, options);
await navigateWithTransition(next, options);
}
}
@ -136,6 +136,16 @@ export function navigate(change: ImmichRoute, options?: NavOptions): Promise<voi
throw `Invalid navigation: ${JSON.stringify(change)}`;
}
async function navigateWithTransition(url: string, options?: NavOptions) {
if (document.startViewTransition) {
document.startViewTransition(async () => {
await goto(url, options);
});
} else {
await goto(url, options);
}
}
export const clearQueryParam = async (queryParam: string, url: URL) => {
if (url.searchParams.has(queryParam)) {
url.searchParams.delete(queryParam);