From 4d2b8113264c0fcda2fdae880754db9cec44c35f Mon Sep 17 00:00:00 2001
From: Patrick <me@patrick.id>
Date: Fri, 9 Dec 2022 17:38:05 +0100
Subject: [PATCH] `sizes` needs to be on the `source`-tag (#7997)

* `sizes` needs to be on the `source`-tag

* adjust sizes

* remove sizes attribute

Co-authored-by: Rich Harris <hello@rich-harris.dev>
---
 sites/kit.svelte.dev/src/routes/home/Hero.svelte | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/sites/kit.svelte.dev/src/routes/home/Hero.svelte b/sites/kit.svelte.dev/src/routes/home/Hero.svelte
index 3fa339a4273c..1b360b355b34 100644
--- a/sites/kit.svelte.dev/src/routes/home/Hero.svelte
+++ b/sites/kit.svelte.dev/src/routes/home/Hero.svelte
@@ -1,6 +1,6 @@
 <script>
 	import logotype from './svelte-kit-logotype.svg';
-	import background from './svelte-kit-machine.webp?w=1440;800;600;480&format=avif;webp;png&picture';
+	import background from './svelte-kit-machine.webp?w=1440;960&format=avif;webp;png&picture';
 </script>
 
 <section class="hero">
@@ -11,12 +11,9 @@
 			<a class="cta" href="/docs/introduction">read the docs</a>
 		</div>
 
-		<picture class="hero-image" sizes="(min-width: 480px) 800px, (min-width: 1024px) 480px, 600px">
+		<picture class="hero-image">
 			{#each Object.entries(background.sources) as [format, images]}
-				<source
-					srcset={images.map((i) => `${i.src} ${i.w}w`).join(', ')}
-					type={'image/' + format}
-				/>
+				<source srcset={images.map((i) => `${i.src} ${i.w}w`).join(', ')} type="image/{format}" />
 			{/each}
 			<img src={background.fallback.src} alt="SvelteKit illustration" />
 		</picture>