Mannivu/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

UX: fix image carousel in comparisonTable

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-12-17 04:12:50 +01:00
parent b2915bdc4d
commit 74618c2282
1 changed files with 12 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/UI/Comparison/ComparisonTable.svelte
View file

@ -128,17 +128,18 @@
{#if $unknownImages.length > 0} {#if $unknownImages.length > 0}
{#if readonly} {#if readonly}
<div class="w-full overflow-x-auto"> <div class="flex w-full space-x-2 overflow-x-auto border border-gray-600 p-1"
<div class="flex h-32 w-max gap-x-2"> style="scroll-snap-type: x proximity; border: 1px solid black">
{#each $unknownImages as image (image)} {#each $unknownImages as image (image)}
<div class="relative flex w-fit items-center bg-gray-200">
<AttributedImage <AttributedImage
{state} {state}
imgClass="h-32 w-max shrink-0" imgClass="h-32 shrink-0"
image={{ url: image }} image={{ url: image }}
previewedImage={state.previewedImage} previewedImage={state.previewedImage}
/> />
{/each}
</div> </div>
{/each}
</div> </div>
{:else} {:else}
{#each $unknownImages as image (image)} {#each $unknownImages as image (image)}