From 55df3dab9767719be0f6ae36a66693cc3010ac93 Mon Sep 17 00:00:00 2001
From: Hannah Issermann <hannah.issermann@orange.com>
Date: Fri, 23 Aug 2024 15:37:41 +0200
Subject: [PATCH 1/3] Docs: Complete "Edit in Stackblitz" links

---
 site/layouts/partials/examples/main.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/site/layouts/partials/examples/main.html b/site/layouts/partials/examples/main.html
index 3dbb640a73d8..b3af811cebf2 100644
--- a/site/layouts/partials/examples/main.html
+++ b/site/layouts/partials/examples/main.html
@@ -19,14 +19,14 @@ <h2 id="{{ $entry.category | urlize }}">{{ $entry.category }}</h2>
           <div>
             <h3 class="h5 mb-1">
               <a class="d-block link-offset-1" href="{{ urls.JoinPath $.Site.Params.github_org $example.url }}" target="_blank" rel="noopener">
-                {{ $example.name }}
+                <span id="starter{{ $i }}">{{ $example.name }}</span>
               </a>
             </h3>
             <p class="text-body-secondary">{{ $example.description }}</p>
             <p>
               {{- $indexPath := default "index.html" $example.indexPath -}}
               {{- $stackBlitzUrl := printf "%s%s%s" (urls.JoinPath "https://stackblitz.com/github/twbs" $example.url) "?file=" ($indexPath | urlquery) }}
-              <a class="icon-link small link-secondary link-offset-1" href="{{ $stackBlitzUrl }}" target="_blank" rel="noopener">
+              <a class="icon-link small link-secondary link-offset-1" href="{{ $stackBlitzUrl }}" target="_blank" rel="noopener" aria-describedby="starter{{ $i }}">
                 <svg class="bi flex-shrink-0" aria-hidden="true"><use xlink:href="#lightning-charge-fill"></use></svg>
                 Edit in StackBlitz
               </a>

From e1bdaffe02bf05a7b0c6877b35546c97aa21359e Mon Sep 17 00:00:00 2001
From: Hannah Issermann <hannah.issermann@orange.com>
Date: Wed, 4 Sep 2024 08:25:27 +0200
Subject: [PATCH 2/3] Docs: Complete "Edit in Stackblitz" accessible name (with
 aria-labelledby and not aria-describedby)

---
 site/layouts/partials/examples/main.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/site/layouts/partials/examples/main.html b/site/layouts/partials/examples/main.html
index b3af811cebf2..91bc60988ec6 100644
--- a/site/layouts/partials/examples/main.html
+++ b/site/layouts/partials/examples/main.html
@@ -26,9 +26,9 @@ <h3 class="h5 mb-1">
             <p>
               {{- $indexPath := default "index.html" $example.indexPath -}}
               {{- $stackBlitzUrl := printf "%s%s%s" (urls.JoinPath "https://stackblitz.com/github/twbs" $example.url) "?file=" ($indexPath | urlquery) }}
-              <a class="icon-link small link-secondary link-offset-1" href="{{ $stackBlitzUrl }}" target="_blank" rel="noopener" aria-describedby="starter{{ $i }}">
+              <a class="icon-link small link-secondary link-offset-1" href="{{ $stackBlitzUrl }}" target="_blank" rel="noopener" aria-labelledby="edit{{ $i }} starter{{ $i }}">
                 <svg class="bi flex-shrink-0" aria-hidden="true"><use xlink:href="#lightning-charge-fill"></use></svg>
-                Edit in StackBlitz
+                <span id="edit{{ $i }}">Edit in StackBlitz</span>
               </a>
             </p>
           </div>

From 280a3cb617c48756bf07a78c7167c935e9b2024d Mon Sep 17 00:00:00 2001
From: Hannah Issermann <hannah.issermann@orange.com>
Date: Fri, 6 Sep 2024 08:57:51 +0200
Subject: [PATCH 3/3] Change id to be consistent with other examples + move
 starter id on `<a>` to avoid creating a `<span>`

---
 site/layouts/partials/examples/main.html | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/site/layouts/partials/examples/main.html b/site/layouts/partials/examples/main.html
index 91bc60988ec6..636cd7e2e8cd 100644
--- a/site/layouts/partials/examples/main.html
+++ b/site/layouts/partials/examples/main.html
@@ -18,17 +18,17 @@ <h2 id="{{ $entry.category | urlize }}">{{ $entry.category }}</h2>
           <svg class="bi fs-5 flex-shrink-0 mt-1" aria-hidden="true"><use xlink:href="#box-seam"></use></svg>
           <div>
             <h3 class="h5 mb-1">
-              <a class="d-block link-offset-1" href="{{ urls.JoinPath $.Site.Params.github_org $example.url }}" target="_blank" rel="noopener">
-                <span id="starter{{ $i }}">{{ $example.name }}</span>
+              <a class="d-block link-offset-1" href="{{ urls.JoinPath $.Site.Params.github_org $example.url }}" target="_blank" rel="noopener" id="starter-{{ $i }}">
+                {{ $example.name }}
               </a>
             </h3>
             <p class="text-body-secondary">{{ $example.description }}</p>
             <p>
               {{- $indexPath := default "index.html" $example.indexPath -}}
               {{- $stackBlitzUrl := printf "%s%s%s" (urls.JoinPath "https://stackblitz.com/github/twbs" $example.url) "?file=" ($indexPath | urlquery) }}
-              <a class="icon-link small link-secondary link-offset-1" href="{{ $stackBlitzUrl }}" target="_blank" rel="noopener" aria-labelledby="edit{{ $i }} starter{{ $i }}">
+              <a class="icon-link small link-secondary link-offset-1" href="{{ $stackBlitzUrl }}" target="_blank" rel="noopener" aria-labelledby="edit-{{ $i }} starter-{{ $i }}">
                 <svg class="bi flex-shrink-0" aria-hidden="true"><use xlink:href="#lightning-charge-fill"></use></svg>
-                <span id="edit{{ $i }}">Edit in StackBlitz</span>
+                <span id="edit-{{ $i }}">Edit in StackBlitz</span>
               </a>
             </p>
           </div>