add form-check css class to checkbox (#42406)

Update the Heroes example Remember me checkbox to use Bootstrap 5 form-check markup. Change container class to `form-check mb-3`, add `form-check-input` on the input with an `id` and `form-check-label` referencing that id. This improves Bootstrap compatibility and accessibility.

diff --git a/site/src/assets/examples/heroes/index.astro b/site/src/assets/examples/heroes/index.astro
index 853776e7bc9004950d80e737a91898d447dff999..d4eb7480485d1dbe599586a4a9ec503302b70329 100644 (file)
--- a/site/src/assets/examples/heroes/index.astro
+++ b/site/src/assets/examples/heroes/index.astro
@@ -74,9 +74,10 @@ export const extra_css = ['heroes.css']
             <input type="password" class="form-control" id="floatingPassword" placeholder="Password">
             <label for="floatingPassword">Password</label>
           </div>
-          <div class="checkbox mb-3">
-            <label>
-              <input type="checkbox" value="remember-me"> Remember me
+          <div class="form-check mb-3">
+            <input class="form-check-input" type="checkbox" id="checkDefault" value="remember-me">
+            <label class="form-check-label" for="checkDefault">
+              Remember me
             </label>
           </div>
           <button class="w-100 btn btn-lg btn-primary" type="submit">Sign up</button>