Something went wrong. Try again.
Monorepo for Tangled forked from tangled.org/core
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990<script lang="ts"> import Avatar from "#lib/components/ui/Avatar.svelte"; import LayerCard from "#lib/components/ui/LayerCard.svelte"; import LayerCardPrimary from "#lib/components/ui/LayerCardPrimary.svelte"; import LayerCardSecondary from "#lib/components/ui/LayerCardSecondary.svelte"; import TimeAgo from "#lib/components/ui/TimeAgo.svelte"; import { date, KIND_LABEL, type Update } from "#lib/components/landing/updates/updates.ts";
let { update: u }: { update: Update } = $props();</script>
<a class="ru-card group" data-kind={u.kind} // eslint-disable-next-line svelte/no-navigation-without-resolve -- the blog href={u.href} target="_blank" rel="noopener noreferrer"> {#if u.kind === "blog"} <LayerCard class="h-full bg-background-default transition-colors group-hover:bg-background-subtle" > <LayerCardSecondary class="flex-col items-stretch gap-xs p-xs! pb-sm!"> <span class="flex items-center justify-between gap-md typography-paragraph-small text-foreground-muted" > <span class="flex min-w-0 items-center gap-xs"> <span class="flex shrink-0 -space-x-1.5"> {#each u.authors as author (author.name)} <Avatar did={author.did} handle={author.handle} size="small" /> {/each} </span> <span class="truncate" >{u.authors.map((author) => author.name).join(", ")}</span > </span> <TimeAgo value={u.at} variant="full" class="shrink-0 pr-2xs tabular-nums" /> </span> <span class="flex flex-col gap-2xs"> <h3 class="typography-paragraph-body font-medium text-foreground-default"> {u.title} </h3> {#if u.summary} <p class="typography-paragraph-regular"> {u.summary} </p> {/if} </span> </LayerCardSecondary> {#if u.image} <LayerCardPrimary padding="none" class="mt-auto"> <img src={u.image.src} alt={u.image.alt} loading="lazy" class="aspect-1200/630 w-full bg-background-inset object-cover" /> </LayerCardPrimary> {/if} </LayerCard> {:else} <LayerCard class="h-full"> <LayerCardSecondary class="gap-xs typography-paragraph-small"> <span class="font-medium text-foreground-default">{KIND_LABEL[u.kind]}</span> {#if u.kind === "changelog"} <span aria-hidden="true">·</span> <time datetime={u.at}>{date(u.at)}</time> {/if} </LayerCardSecondary> <LayerCardPrimary class="ru-body"> {#if u.kind === "changelog"} <p class="ru-text">{u.text}</p> {:else} <h3 class="typography-paragraph-regular font-medium text-foreground-default"> {u.title} </h3> {#each u.body as para, i (i)} <p class="ru-text"> {#each para.split("`") as part, j (j)}{#if j % 2}<code class="typography-monospace-small">{part}</code >{:else}{part}{/if}{/each} </p> {/each} {/if} </LayerCardPrimary> </LayerCard> {/if}</a>