git.stevedylan.dev

src/routes/+layout.svelte +33 −15

<script lang="ts">
import { onNavigate } from "$app/navigation";
import "./layout.css";
import favicon from "$lib/assets/favicon.svg";
  import { onNavigate } from "$app/navigation";
  import "./layout.css";
  import favicon from "$lib/assets/favicon.svg";

let { children } = $props();
  let { children } = $props();

onNavigate((navigation) => {
	if (!document.startViewTransition) return;
  onNavigate((navigation) => {
    if (!document.startViewTransition) return;

	return new Promise((resolve) => {
		document.startViewTransition(async () => {
			resolve();
			await navigation.complete;
		});
	});
});
    return new Promise((resolve) => {
      document.startViewTransition(async () => {
        resolve();
        await navigation.complete;
      });
    });
  });
</script>

<svelte:head><link rel="icon" href={favicon} /></svelte:head>
  {@render children()}
<svelte:head>
  <link rel="icon" href={favicon} />
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
  <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
  <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
  <link rel="alternate" type="application/rss+xml" title="RSS" href="https://steve.photo/rss.xml" />
  <meta name="description" content="Photography by Steve" />
  <meta property="og:site_name" content="steve.photo" />
  <meta property="og:type" content="website" />
  <meta property="og:title" content="steve.photo" />
  <meta property="og:url" content="https://steve.photo" />
  <meta property="og:description" content="Photography by Steve" />
  <meta property="og:image" content="https://steve.photo/og.png" />
  <meta name="twitter:card" content="summary_large_image" />
  <meta name="twitter:title" content="steve.photo" />
  <meta name="twitter:description" content="Photography by Steve" />
  <meta name="twitter:image" content="https://steve.photo/og.png" />
  <link rel="canonical" href="https://steve.photo" />
</svelte:head>
{@render children()}

src/routes/photo/[slug]/+page.svelte +24 −0

  let { data }: { data: PageData } = $props();
</script>

<svelte:head>
  <title>{data.photo.title} | steve.photo</title>
  <meta
    name="description"
    content="{data.photo.title} - Shot on {data.photo.make} {data.photo.camera}"
  />
  <meta property="og:type" content="article" />
  <meta property="og:title" content="{data.photo.title} | steve.photo" />
  <meta property="og:url" content="https://steve.photo/photo/{data.photo.slug}" />
  <meta
    property="og:description"
    content="{data.photo.title} - Shot on {data.photo.make} {data.photo.camera}"
  />
  <meta property="og:image" content={data.photo.image} />
  <meta name="twitter:card" content="summary_large_image" />
  <meta name="twitter:title" content="{data.photo.title} | steve.photo" />
  <meta
    name="twitter:description"
    content="{data.photo.title} - Shot on {data.photo.make} {data.photo.camera}"
  />
  <meta name="twitter:image" content={data.photo.image} />
  <link rel="canonical" href="https://steve.photo/photo/{data.photo.slug}" />
</svelte:head>

<div class="bg-[#121113] min-h-screen text-white flex flex-col gap-4 pb-4">
  <div class="fixed bg-[#121113] w-full py-4 sm:px-8 px-4">
    <a href="/" class="text-sm hover:underline">steve.photo</a>

static/android-chrome-192x192.png (added) +0 −0

Binary file — no preview.

static/android-chrome-512x512.png (added) +0 −0

Binary file — no preview.

static/apple-touch-icon.png (added) +0 −0

Binary file — no preview.

static/favicon-16x16.png (added) +0 −0

Binary file — no preview.

static/favicon-32x32.png (added) +0 −0

Binary file — no preview.

static/favicon.ico (added) +0 −0

Binary file — no preview.

static/og.png (added) +0 −0

Binary file — no preview.

1	1		<script lang="ts">
2		-	import { onNavigate } from "$app/navigation";
3		-	import "./layout.css";
4		-	import favicon from "$lib/assets/favicon.svg";
	2	+	import { onNavigate } from "$app/navigation";
	3	+	import "./layout.css";
	4	+	import favicon from "$lib/assets/favicon.svg";
5	5
6		-	let { children } = $props();
	6	+	let { children } = $props();
7	7
8		-	onNavigate((navigation) => {
9		-	if (!document.startViewTransition) return;
	8	+	onNavigate((navigation) => {
	9	+	if (!document.startViewTransition) return;
10	10
11		-	return new Promise((resolve) => {
12		-	document.startViewTransition(async () => {
13		-	resolve();
14		-	await navigation.complete;
15		-	});
16		-	});
17		-	});
	11	+	return new Promise((resolve) => {
	12	+	document.startViewTransition(async () => {
	13	+	resolve();
	14	+	await navigation.complete;
	15	+	});
	16	+	});
	17	+	});
18	18		</script>
19	19
20		-	<svelte:head><link rel="icon" href={favicon} /></svelte:head>
21		-	{@render children()}
	20	+	<svelte:head>
	21	+	<link rel="icon" href={favicon} />
	22	+	<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
	23	+	<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
	24	+	<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
	25	+	<link rel="alternate" type="application/rss+xml" title="RSS" href="https://steve.photo/rss.xml" />
	26	+	<meta name="description" content="Photography by Steve" />
	27	+	<meta property="og:site_name" content="steve.photo" />
	28	+	<meta property="og:type" content="website" />
	29	+	<meta property="og:title" content="steve.photo" />
	30	+	<meta property="og:url" content="https://steve.photo" />
	31	+	<meta property="og:description" content="Photography by Steve" />
	32	+	<meta property="og:image" content="https://steve.photo/og.png" />
	33	+	<meta name="twitter:card" content="summary_large_image" />
	34	+	<meta name="twitter:title" content="steve.photo" />
	35	+	<meta name="twitter:description" content="Photography by Steve" />
	36	+	<meta name="twitter:image" content="https://steve.photo/og.png" />
	37	+	<link rel="canonical" href="https://steve.photo" />
	38	+	</svelte:head>
	39	+	{@render children()}

4	4		let { data }: { data: PageData } = $props();
5	5		</script>
6	6
	7	+	<svelte:head>
	8	+	<title>{data.photo.title} \| steve.photo</title>
	9	+	<meta
	10	+	name="description"
	11	+	content="{data.photo.title} - Shot on {data.photo.make} {data.photo.camera}"
	12	+	/>
	13	+	<meta property="og:type" content="article" />
	14	+	<meta property="og:title" content="{data.photo.title} \| steve.photo" />
	15	+	<meta property="og:url" content="https://steve.photo/photo/{data.photo.slug}" />
	16	+	<meta
	17	+	property="og:description"
	18	+	content="{data.photo.title} - Shot on {data.photo.make} {data.photo.camera}"
	19	+	/>
	20	+	<meta property="og:image" content={data.photo.image} />
	21	+	<meta name="twitter:card" content="summary_large_image" />
	22	+	<meta name="twitter:title" content="{data.photo.title} \| steve.photo" />
	23	+	<meta
	24	+	name="twitter:description"
	25	+	content="{data.photo.title} - Shot on {data.photo.make} {data.photo.camera}"
	26	+	/>
	27	+	<meta name="twitter:image" content={data.photo.image} />
	28	+	<link rel="canonical" href="https://steve.photo/photo/{data.photo.slug}" />
	29	+	</svelte:head>
	30	+
7	31		<div class="bg-[#121113] min-h-screen text-white flex flex-col gap-4 pb-4">
8	32		<div class="fixed bg-[#121113] w-full py-4 sm:px-8 px-4">
9	33		<a href="/" class="text-sm hover:underline">steve.photo</a>