helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-14 17:36:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

feat(web): improve alt text (#7596)

Browse source 
* alt text

* memory lane alt text

* revert sql generator change

* use getAltText

* oops

* handle large number of people in asset

* nit

* add aria-label to search button

* update api

* fixed tests

* fixed typing

* fixed spacing

* fix displaying null
This commit is contained in:
Mert 2024-03-03 16:42:17 -05:00 • committed by GitHub
parent 07c926bb12
commit 2fa10a254c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
24 changed files with 200 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

4
web/src/lib/components/asset-viewer/activity-viewer.svelte
View file

@ -195,7 +195,7 @@
<img
class="rounded-lg w-[75px] h-[75px] object-cover"
src={getAssetThumbnailUrl(reaction.assetId, ThumbnailFormat.Webp)}
alt="comment-thumbnail"
alt="Profile picture of {reaction.user.name}, who commented on this asset"
/>
</div>
{/if}
@ -241,7 +241,7 @@
<img
class="rounded-lg w-[75px] h-[75px] object-cover"
src={getAssetThumbnailUrl(reaction.assetId, ThumbnailFormat.Webp)}
alt="like-thumbnail"
alt="Profile picture of {reaction.user.name}, who liked this asset"
/>
</div>
{/if}

11
web/src/lib/components/asset-viewer/detail-panel.svelte
View file

@ -616,7 +616,16 @@
{:then component}
<svelte:component
this={component.default}
mapMarkers={[{ lat: latlng.lat, lon: latlng.lng, id: asset.id }]}
mapMarkers={[
{
lat: latlng.lat,
lon: latlng.lng,
id: asset.id,
city: asset.exifInfo?.city ?? null,
state: asset.exifInfo?.state ?? null,
country: asset.exifInfo?.country ?? null,
},
]}
center={latlng}
zoom={15}
simplified

3
web/src/lib/components/asset-viewer/photo-viewer.svelte
View file

@ -13,6 +13,7 @@
import { fade } from 'svelte/transition';
import LoadingSpinner from '../shared-components/loading-spinner.svelte';
import { NotificationType, notificationController } from '../shared-components/notification/notification';
import { getAltText } from '$lib/utils/thumbnail-util';
export let asset: AssetResponseDto;
export let element: HTMLDivElement | undefined = undefined;
@ -133,7 +134,7 @@
bind:this={$photoViewer}
transition:fade={{ duration: haveFadeTransition ? 150 : 0 }}
src={assetData}
alt={asset.id}
alt={getAltText(asset)}
class="h-full w-full object-contain"
draggable="false"
/>