alice.pds.demo.boltless.dev
This repository has no description
1<script lang="ts">
2 import { resolve } from '$app/paths';
3 import { compactRelativeTime } from '$lib/format';
4 import type { StringCardData } from './types';
5
6 let { entry }: { entry: StringCardData } = $props();
7</script>
8
9<div
10 class="flex min-h-32 flex-col gap-1 rounded border border-border bg-surface px-6 py-4 shadow-sm"
11>
12 <div class="flex items-center justify-between font-medium text-fg-strong">
13 <div class="mr-2 flex min-w-0 flex-1 items-center">
14 <a
15 href={resolve(`/${entry.ownerHandle}/strings/${entry.rkey}` as '/')}
16 class="min-w-0 truncate font-bold text-fg-strong no-underline hover:underline"
17 >
18 {entry.filename}
19 </a>
20 </div>
21 </div>
22
23 {#if entry.description}
24 <p class="line-clamp-2 text-sm text-fg-muted">{entry.description}</p>
25 {/if}
26
27 <div class="mt-auto flex flex-wrap items-center gap-4 pt-2 font-mono text-xs text-fg-subtle">
28 <span class="shrink-0"
29 >{entry.lines} line{entry.lines === 1 ? '' : 's'} · {compactRelativeTime(
30 entry.createdAt
31 )}</span
32 >
33 </div>
34</div>