make song entries a bit prettier

This commit is contained in:
2026-02-06 00:12:49 -08:00
parent ff2c936860
commit ec2e642165

View File

@@ -35,12 +35,7 @@
}; };
const typeLabel = $derived(typeLabelMap[type] ?? `T${type}`); const typeLabel = $derived(typeLabelMap[type] ?? `T${type}`);
const displayTypeNumber = $derived(`${typeLabel}${number || ""}`);
const displayTypeNumber = $derived.by(() => {
const num = Number(number);
if (!Number.isFinite(num) || num === 0) return typeLabel;
return `${typeLabel}${num}`;
});
const artistDisplay = $derived.by( const artistDisplay = $derived.by(
() => artistName?.trim() || "Unknown Artist", () => artistName?.trim() || "Unknown Artist",
@@ -75,12 +70,13 @@
<div class="rounded border px-3 py-2"> <div class="rounded border px-3 py-2">
<div class="flex flex-wrap items-baseline gap-x-2 gap-y-1"> <div class="flex flex-wrap items-baseline gap-x-2 gap-y-1">
<span class="text-sm text-muted-foreground">{animeName}</span> <span class="text-sm text-muted-foreground rounded bg-muted px-2 py-0.5"
<span class="text-sm text-muted-foreground"></span> >{displayTypeNumber}</span
<span class="text-sm text-muted-foreground">{displayTypeNumber}</span> >
{animeName}
</div> </div>
<div class="mt-1 font-medium"> <div class="mt-1 text-foreground/80">
{songName} {songName}
<span class="text-sm text-muted-foreground">{artistDisplay}</span> <span class="text-sm text-muted-foreground">{artistDisplay}</span>
</div> </div>