From 4f32f6fa97ee0799c3ee070b68dd953e1c4a3f0f Mon Sep 17 00:00:00 2001
From: Dan Trickey <git@trickey.io>
Date: Wed, 5 Jun 2024 18:59:47 +0100
Subject: [PATCH 1/3] Limit width of images

Prevent the images from overflowing the card on smaller screens
---
 src/components/Hexpansion.astro | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/components/Hexpansion.astro b/src/components/Hexpansion.astro
index 7995bdf..67638f2 100644
--- a/src/components/Hexpansion.astro
+++ b/src/components/Hexpansion.astro
@@ -62,4 +62,7 @@ const image_url = image_url_prop
   a {
     color: #aaa;
   }
+  img {
+    width: 95%;
+  }
 </style>

From fa23ebe6f56a4f1cff1eaab2e8e9c9c3441804c4 Mon Sep 17 00:00:00 2001
From: Dan Trickey <git@trickey.io>
Date: Wed, 5 Jun 2024 19:06:05 +0100
Subject: [PATCH 2/3] Improve headings for screenreaders

There should only be one h1 per page, and W3C recommends that aria roles are used for subtitles, strongly discouraging the use of h3 for it.
---
 src/components/Hexpansion.astro | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Hexpansion.astro b/src/components/Hexpansion.astro
index 67638f2..7fdef2b 100644
--- a/src/components/Hexpansion.astro
+++ b/src/components/Hexpansion.astro
@@ -32,8 +32,8 @@ const image_url = image_url_prop
     return homepage ? <a href={homepage}>{markup}</a> : markup;
   })(
     <article>
-      <h1>{unique_name}</h1>
-      <h2>by {maker}</h2>
+      <h2>{unique_name}</h2>
+      <div role="doc-subtitle">by {maker}</div>
       {image_url && (
         <img
           alt={`An image of the ${unique_name} hexpansion`}

From 3288c95a96064e7ec932243a9a48328f9fbc327c Mon Sep 17 00:00:00 2001
From: Dan Trickey <git@trickey.io>
Date: Wed, 5 Jun 2024 19:06:54 +0100
Subject: [PATCH 3/3] Remove underline from anchor tag on hexpansion
 description

---
 src/components/Hexpansion.astro | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/Hexpansion.astro b/src/components/Hexpansion.astro
index 7fdef2b..5c893f2 100644
--- a/src/components/Hexpansion.astro
+++ b/src/components/Hexpansion.astro
@@ -58,9 +58,11 @@ const image_url = image_url_prop
   h3 {
     color: #eee;
     text-decoration: none;
+    margin: 0.5em 0;
   }
   a {
     color: #aaa;
+    text-decoration: none;
   }
   img {
     width: 95%;