fix(web): fix logo size on shared pages

immich-app · May 9, 2024 · 17bfc2d · 17bfc2d
1 parent f340786
commit 17bfc2d
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/web/src/lib/components/album-page/album-viewer.svelte b/web/src/lib/components/album-page/album-viewer.svelte
@@ -23,6 +23,7 @@
   export let user: UserResponseDto | undefined = undefined;
 
   const album = sharedLink.album as AlbumResponseDto;
+  let innerWidth: number;
 
   let { isViewing: showAssetViewer } = assetViewingStore;
 
@@ -47,6 +48,7 @@
       }
     },
   }}
+  bind:innerWidth
 />
 
 <header>
@@ -65,7 +67,7 @@
     <ControlAppBar showBackButton={false}>
       <svelte:fragment slot="leading">
         <a data-sveltekit-preload-data="hover" class="ml-4" href="/">
-          <ImmichLogo class="h-10" />
+          <ImmichLogo class="h-[24px] w-[24px] max-w-none md:w-auto md:h-10 md:max-w-full" noText={innerWidth < 768} />
         </a>
       </svelte:fragment>
 

diff --git a/web/src/lib/components/share-page/individual-shared-viewer.svelte b/web/src/lib/components/share-page/individual-shared-viewer.svelte
@@ -23,6 +23,7 @@
 
   const viewport: Viewport = { width: 0, height: 0 };
   let selectedAssets: Set<AssetResponseDto> = new Set();
+  let innerWidth: number;
 
   $: assets = sharedLink.assets;
   $: isMultiSelectionMode = selectedAssets.size > 0;
@@ -68,6 +69,8 @@
   };
 </script>
 
+<svelte:window bind:innerWidth />
+
 <section class="bg-immich-bg dark:bg-immich-dark-bg">
   {#if isMultiSelectionMode}
     <AssetSelectControlBar assets={selectedAssets} clearSelect={() => (selectedAssets = new Set())}>
@@ -83,7 +86,7 @@
     <ControlAppBar on:close={() => goto(AppRoute.PHOTOS)} backIcon={mdiArrowLeft} showBackButton={false}>
       <svelte:fragment slot="leading">
         <a data-sveltekit-preload-data="hover" class="ml-4" href="/">
-          <ImmichLogo class="h-10" />
+          <ImmichLogo class="h-[24px] w-[24px] max-w-none md:w-auto md:h-10 md:max-w-full" noText={innerWidth < 768} />
         </a>
       </svelte:fragment>