fix: responsiveness of title buttons on mobile devices

This commit is contained in:
2025-11-25 22:27:17 +01:00
parent 62ff4826c1
commit 4cdaa2e72f
3 changed files with 9 additions and 7 deletions

View File

@@ -23,7 +23,7 @@
<Card style={cardStyle} class="h-full flex flex-col">
<CardHeader class="flex-shrink-0">
<div class="flex items-center justify-between gap-2">
<div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-1 sm:gap-2">
<CardTitle class="text-lg flex items-center gap-2 flex-1 min-w-0">
<span class="truncate">{title}</span>
</CardTitle>

View File

@@ -46,13 +46,15 @@
<Card>
<CardHeader>
<div class="flex items-center justify-between">
<div>
<div class="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
<div class="flex-1 min-w-0">
<CardTitle>{title}</CardTitle>
<CardDescription>{description}</CardDescription>
</div>
{#if headerAction}
{@render headerAction()}
<div class="flex-shrink-0">
{@render headerAction()}
</div>
{/if}
</div>
{#if searchBar}

View File

@@ -46,14 +46,14 @@
<div class="min-h-screen flex items-center justify-center p-4">
<Card class="w-full max-w-lg">
<CardHeader>
<div class="flex items-center justify-between">
<div>
<div class="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
<div class="flex-1 min-w-0">
<CardTitle class="text-3xl">{t.wishlist.createTitle}</CardTitle>
<CardDescription>
{t.wishlist.createDescription}
</CardDescription>
</div>
<div class="flex items-center gap-1 sm:gap-2">
<div class="flex items-center gap-1 sm:gap-2 flex-shrink-0">
<LanguageToggle />
<ThemeToggle />
{#if data.session?.user}