Merge pull request #45 from trueberryless-org/responsive-images

Enable experimental Image cropping features from Astro 5.x

.changeset/sharp-bags-turn.md

@@ -0,0 +1,5 @@
+---
+"trueberryless": patch
+---
+
+Enable experimental Image cropping features from Astro 5.x

src/astro.config.mjs

@@ -2,4 +2,8 @@
 import { defineConfig } from "astro/config";
 
 // https://astro.build/config
-export default defineConfig({});
+export default defineConfig({
+  experimental: {
+    responsiveImages: true,
+  },
+});

src/src/pages/about.astro

@@ -23,7 +23,8 @@ import holiday from '../assets/about/about-1.jpg';
 					width="1553"
 					height="873"
 					src={holiday}
-					alt="Felix Schneider with his dads at a family holiday eating his favorite dessert, crapes."
+					alt="Felix Schneider looking into the distance with the Graz clock tower in the background"
+          priority={true}
 				/>
 			</Hero>
 

src/src/pages/index.astro

@@ -48,6 +48,7 @@ import portrait from '../assets/portrait.jpg';
 					alt="Felix Schneider smiling in a formal gray shirt and silver tie, arms crossed against a dark background."
 					width="480"
 					height="620"
+          priority={true}
 					src={portrait}
 				/>
 			</header>
@@ -121,7 +122,7 @@ import portrait from '../assets/portrait.jpg';
 	}
 
 	.hero img {
-		aspect-ratio: 5 / 4;
+    aspect-ratio: 3 / 4;
 		object-fit: cover;
 		object-position: top;
 		border-radius: 1.5rem;
@@ -143,7 +144,6 @@ import portrait from '../assets/portrait.jpg';
 		}
 
 		.hero img {
-			aspect-ratio: 3 / 4;
 			border-radius: 4.5rem;
 			object-fit: cover;
 		}