From 17bfc2d0767bae3e7c7acc670fd02063bf08bcca Mon Sep 17 00:00:00 2001
From: snowknight26 <Snowknight26@users.noreply.github.com>
Date: Wed, 8 May 2024 21:14:27 -0500
Subject: [PATCH] fix(web): fix logo size on shared pages

---
 web/src/lib/components/album-page/album-viewer.svelte        | 4 +++-
 .../components/share-page/individual-shared-viewer.svelte    | 5 ++++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/web/src/lib/components/album-page/album-viewer.svelte b/web/src/lib/components/album-page/album-viewer.svelte
index cccb080ff318d..8f107d47a112b 100644
--- 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
index 89ecae5b41e1a..e9265f3ad3af2 100644
--- 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>