chadtmiller.com/knotless

<script lang="ts">
	import { page } from '$app/state';
	/**
	 * A page's title, and what it says of itself to whatever unfurls a link
	 * to it: what it is about, and the card it unfurls into, by its path.
	 */
	let { title, about, card }: { title: string; about?: string | null; card?: string } = $props();
</script>

<svelte:head>
	<title>{title}</title>
	<meta property="og:site_name" content="knotless" />
	<meta property="og:title" content={title} />
	{#if about}
		<meta name="description" content={about} />
		<meta property="og:description" content={about} />
	{/if}
	{#if card}
		<meta property="og:image" content={page.url.origin + card} />
		<meta property="og:image:width" content="1200" />
		<meta property="og:image:height" content="630" />
		<meta name="twitter:card" content="summary_large_image" />
	{/if}
</svelte:head>