From c2a279e49ea585065f5a4e21450544862dc668c4 Mon Sep 17 00:00:00 2001
From: Michel Heusschen <59014050+michelheusschen@users.noreply.github.com>
Date: Fri, 13 Mar 2026 15:40:04 +0100
Subject: [PATCH] fix(web): keep header fixed on individual shared links
 (#26892)

---
 .../individual-shared-viewer.svelte           | 25 ++++++++++---------
 1 file changed, 13 insertions(+), 12 deletions(-)

diff --git a/web/src/lib/components/share-page/individual-shared-viewer.svelte b/web/src/lib/components/share-page/individual-shared-viewer.svelte
index 64eb98bec0..0bf1a2f7f2 100644
--- a/web/src/lib/components/share-page/individual-shared-viewer.svelte
+++ b/web/src/lib/components/share-page/individual-shared-viewer.svelte
@@ -74,8 +74,12 @@
   };
 </script>
 
-<section>
-  {#if sharedLink?.allowUpload || assets.length > 1}
+{#if sharedLink?.allowUpload || assets.length > 1}
+  <main class="mt-24 mb-40 mx-4 isolate" bind:clientHeight={viewport.height} bind:clientWidth={viewport.width}>
+    <GalleryViewer {assets} {assetInteraction} {viewport} allowDeletion={false} />
+  </main>
+
+  <header class="fixed top-0 inset-s-0 w-full">
     {#if assetInteraction.selectionActive}
       <AssetSelectControlBar
         assets={assetInteraction.selectedAssets}
@@ -129,14 +133,11 @@
         {/snippet}
       </ControlAppBar>
     {/if}
-    <section class="my-40 mx-4" bind:clientHeight={viewport.height} bind:clientWidth={viewport.width}>
-      <GalleryViewer {assets} {assetInteraction} {viewport} allowDeletion={false} />
-    </section>
-  {:else if assets.length === 1}
-    {#await getAssetInfo({ ...authManager.params, id: assets[0].id }) then asset}
-      {#await import('$lib/components/asset-viewer/asset-viewer.svelte') then { default: AssetViewer }}
-        <AssetViewer cursor={{ current: asset }} onAction={handleAction} />
-      {/await}
+  </header>
+{:else if assets.length === 1}
+  {#await getAssetInfo({ ...authManager.params, id: assets[0].id }) then asset}
+    {#await import('$lib/components/asset-viewer/asset-viewer.svelte') then { default: AssetViewer }}
+      <AssetViewer cursor={{ current: asset }} onAction={handleAction} />
     {/await}
-  {/if}
-</section>
+  {/await}
+{/if}