Docker/AdventureLog
Docker/AdventureLog
1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-07-23 14:59:36 +02:00
Code Issues Releases Activity

Prevent UI overlaps in transportation card

Browse source 
Similar to #552 (658764f) the card title and badges of the
transportation card can overlap. This patch adjusts the transportation
card to list the badges below the title similar to the other cards.
This commit is contained in:
Lars Kiesow 2025-04-18 00:22:50 +02:00
parent 9043ee9565
commit ea85c5fc5a
1 changed files with 12 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

26
frontend/src/lib/components/TransportationCard.svelte
View file

@ -110,22 +110,20 @@
>
<div class="card-body space-y-4">
<!-- Title and Type -->
<div class="flex items-center justify-between">
<h2 class="card-title text-lg font-semibold truncate">{transportation.name}</h2>
<div class="flex items-center gap-2">
<div class="badge badge-secondary">
{$t(`transportation.modes.${transportation.type}`) +
' ' +
getTransportationIcon(transportation.type)}
</div>
{#if transportation.type == 'plane' && transportation.flight_number}
<div class="badge badge-neutral-200">{transportation.flight_number}</div>
{/if}
<h2 class="card-title text-lg font-semibold truncate">{transportation.name}</h2>
<div>
<div class="badge badge-secondary">
{$t(`transportation.modes.${transportation.type}`) +
' ' +
getTransportationIcon(transportation.type)}
</div>
{#if transportation.type == 'plane' && transportation.flight_number}
<div class="badge badge-neutral-200">{transportation.flight_number}</div>
{/if}
{#if unlinked}
<div class="badge badge-error">{$t('adventures.out_of_range')}</div>
{/if}
</div>
{#if unlinked}
<div class="badge badge-error">{$t('adventures.out_of_range')}</div>
{/if}
<!-- Locations -->
<div class="space-y-2">