dne/stammtisch-hersbruck
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: Einladungslinks brechen um statt zu scrollen

Browse source 
Der Link lag in einem einzeiligen Feld. So etwas bricht nicht um, es
scrollt — im Dialog sah man ein Stueck aus der Mitte und musste raten,
ob der richtige Link kopiert wird.

Jetzt steht er in voller Laenge auf einer eigenen Zeile, darunter der
Hinweis und die beiden Knoepfe. break-all statt break-words, weil eine
URL keine Leerzeichen hat, an denen sich trennen liesse.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01P32KoesVtABd6xWsqMKzhr
This commit is contained in:
Daniel Michelberger 2026-09-07 22:38:07 +02:00
parent 6ff37ef1f6
commit ea4e0bd80a
1 changed files with 41 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
frontend/src/routes/dashboard/team/+page.svelte
View file

@ -815,41 +815,50 @@
{#if invites.scoped.length > 0}
<div class="space-y-2">
{#each invites.scoped as invite (invite.id)}
<!--
Der Link steht in voller Laenge auf einer eigenen
Zeile und bricht um. Vorher lag er in einem
einzeiligen Feld, das nicht umbrechen kann, sondern
scrollt — im Dialog sah man davon ein Stueck Mitte
und musste raten, ob der richtige Link kopiert
wird. break-all statt break-words, weil eine URL
keine Leerzeichen hat, an denen sich trennen
liesse.
-->
<div
class="flex flex-wrap items-center gap-2 rounded-lg border p-2"
class="space-y-2 rounded-lg border p-2"
class:opacity-60={!invites.isValid(invite)}
>
<input
readonly
value={invites.url(invite)}
class="min-w-0 flex-1 bg-transparent px-1 font-mono text-xs outline-none"
onfocus={(e) => e.currentTarget.select()}
/>
<span class="text-xs text-muted-foreground whitespace-nowrap">
{inviteHint(invite)}
</span>
<Button
variant="ghost"
size="icon"
class="size-8"
tooltip="Link kopieren"
onclick={() => copyLink(invite)}
>
{#if copied === invite.id}
<Check class="size-4 text-primary" />
{:else}
<Copy class="size-4" />
{/if}
</Button>
<Button
variant="ghost"
size="icon"
class="size-8"
tooltip="Link zurückziehen"
onclick={() => removeInvite(invite)}
>
<Trash2 class="size-4 text-destructive" />
</Button>
<p class="font-mono text-xs leading-relaxed break-all">
{invites.url(invite)}
</p>
<div class="flex items-center gap-2">
<span class="flex-1 text-xs text-muted-foreground">
{inviteHint(invite)}
</span>
<Button
variant="ghost"
size="icon"
class="size-8 shrink-0"
tooltip="Link kopieren"
onclick={() => copyLink(invite)}
>
{#if copied === invite.id}
<Check class="size-4 text-primary" />
{:else}
<Copy class="size-4" />
{/if}
</Button>
<Button
variant="ghost"
size="icon"
class="size-8 shrink-0"
tooltip="Link zurückziehen"
onclick={() => removeInvite(invite)}
>
<Trash2 class="size-4 text-destructive" />
</Button>
</div>
</div>
{/each}
</div>