refactor: site metadata and layout animation delays

This commit is contained in:
Bart van der Braak 2024-01-22 11:25:57 +01:00
parent b5b12ae5d5
commit fe2a5d00f9
3 changed files with 5 additions and 4 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 39 KiB

View file

@ -5,6 +5,7 @@
export let title: string = siteConfig.name;
$: title = $page.data?.name ? `${$page.data.name} — ${siteConfig.name}` : siteConfig.name;
$: description = $page.data?.subTitle ?? siteConfig.description;
$: ogImage = encodeURI(
`${siteConfig.ogImage}?title=${$page.data.title}&subTitle=${$page.data.subTitle}`
);
@ -12,13 +13,13 @@
<svelte:head>
<title>{title}</title>
<meta name="description" content={siteConfig.description} />
<meta name="description" content={description} />
<meta name="keywords" content={siteConfig.keywords} />
<meta name="author" content="Bart van der Braak" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content={siteConfig.url} />
<meta name="twitter:title" content={title} />
<meta name="twitter:description" content={siteConfig.description} />
<meta name="twitter:description" content={description} />
<meta name="twitter:image" content={ogImage} />
<meta name="twitter:image:alt" content={siteConfig.name} />
<meta name="twitter:creator" content="Bart van der Braak" />
@ -29,7 +30,7 @@
<meta property="og:image:alt" content={siteConfig.name} />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:description" content={siteConfig.description} />
<meta property="og:description" content={description} />
<meta property="og:site_name" content={siteConfig.name} />
<meta property="og:locale" content="EN_US" />
</svelte:head>

View file

@ -20,7 +20,7 @@
<SiteNavBar />
<main class="container relative mb-4 max-w-[980px] flex-1">
{#key data.url}
<div in:fly={{ x: -200, duration: 200, delay: 200 }} out:fly={{ x: 200, duration: 200 }}>
<div in:fly={{ x: -200, duration: 200, delay: 100 }} out:fly={{ x: 200, duration: 100 }}>
<slot />
</div>
{/key}