PR-C0: card-style no-video tiles with border and backdrop label

- Add border (border-line) to no-video tile outer div for card contrast
  against bg-surface panel (video-on tiles unchanged)
- Use bg-backdrop/80 for name label on no-video tiles for legibility
  (video-on tiles keep bg-surface/80)

Part of flotilla-j4k / coracle/flotilla#343
This commit is contained in:
Agent 2026-08-13 12:53:12 -04:00
parent 91a8995a98
commit 928456649e

View file

@ -222,6 +222,7 @@
<div
class={cx(
"relative isolate overflow-hidden rounded-2xl shadow-sm",
!tile.track && "border border-line border-solid",
layout === "spotlight" && "min-h-0 flex-1",
layout === "default" && "aspect-video w-full min-h-0",
layout === "strip" && "aspect-video w-44 shrink-0",
@ -248,7 +249,9 @@
</div>
{/if}
<span
class="pointer-events-none absolute bottom-1 left-1 max-w-[calc(100%-0.5rem)] truncate rounded bg-surface/80 px-1.5 py-0.5 text-xs">
class="pointer-events-none absolute bottom-1 left-1 max-w-[calc(100%-0.5rem)] truncate rounded px-1.5 py-0.5 text-xs {tile.track
? 'bg-surface/80'
: 'bg-backdrop/80'}">
{labelFor(tile.liveKitIdentity, tile.source)}{tile.isLocal ? " (you)" : ""}
</span>
{#if videoTiles.length > 1}