fix(dashboard): wrap mention items so last:border-0 works correctly

Adding the link div after the {#each} broke last:border-0 — the last
mention item was no longer the last child, so it kept its border-b,
creating a double line with the link's border-t. Wrapping the each in
its own div restores correct last:border-0 targeting.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-03-29 16:35:29 +02:00
committed by marcel
parent 7dcb8bc705
commit 7573d3b5da

View File

@@ -24,26 +24,28 @@ let { mentions }: Props = $props();
<h2 class="mb-4 font-sans text-xs font-bold tracking-widest text-gray-400 uppercase"> <h2 class="mb-4 font-sans text-xs font-bold tracking-widest text-gray-400 uppercase">
{m.dashboard_notifications_heading()} {m.dashboard_notifications_heading()}
</h2> </h2>
{#each mentions as mention (mention.id)} <div>
<div class="flex items-center gap-3 border-b border-line py-2 last:border-0"> {#each mentions as mention (mention.id)}
{#if mention.documentId} <div class="flex items-center gap-3 border-b border-line py-2 last:border-0">
<a {#if mention.documentId}
href={mention.annotationId <a
? `/documents/${mention.documentId}?commentId=${mention.referenceId}&annotationId=${mention.annotationId}` href={mention.annotationId
: `/documents/${mention.documentId}?commentId=${mention.referenceId}`} ? `/documents/${mention.documentId}?commentId=${mention.referenceId}&annotationId=${mention.annotationId}`
class="font-serif text-lg text-ink hover:text-ink-2 hover:underline" : `/documents/${mention.documentId}?commentId=${mention.referenceId}`}
>{mention.actorName ?? ''}</a class="font-serif text-lg text-ink hover:text-ink-2 hover:underline"
> >{mention.actorName ?? ''}</a
<span class="font-sans text-xs text-gray-400"> >
{mention.type === 'MENTION' <span class="font-sans text-xs text-gray-400">
? m.dashboard_notification_mentioned() {mention.type === 'MENTION'
: m.dashboard_notification_replied()} ? m.dashboard_notification_mentioned()
</span> : m.dashboard_notification_replied()}
{:else} </span>
<span class="font-serif text-lg text-ink">{mention.actorName ?? ''}</span> {:else}
{/if} <span class="font-serif text-lg text-ink">{mention.actorName ?? ''}</span>
</div> {/if}
{/each} </div>
{/each}
</div>
<div class="mt-4 border-t border-line pt-4"> <div class="mt-4 border-t border-line pt-4">
<a <a
href="/notifications" href="/notifications"