Merge branch 'twbs:main' into main

12 files changed, 51 insertions, 51 deletions

diff --git a/site/content/docs/5.1/examples/carousel-rtl/index.html b/site/content/docs/5.1/examples/carousel-rtl/index.html
index 043d4b063..b29ea863e 100644
--- a/site/content/docs/5.1/examples/carousel-rtl/index.html
+++ b/site/content/docs/5.1/examples/carousel-rtl/index.html
@@ -25,7 +25,7 @@ extra_css:
             <a class="nav-link disabled">رابط غير مفعل</a>
           </li>
         </ul>
-        <form class="d-flex">
+        <form class="d-flex" role="search">
           <input class="form-control me-2" type="search" placeholder="بحث" aria-label="بحث">
           <button class="btn btn-outline-success" type="submit">بحث</button>
         </form>
diff --git a/site/content/docs/5.1/examples/carousel/index.html b/site/content/docs/5.1/examples/carousel/index.html
index 8faf6cdd1..e27c6b73a 100644
--- a/site/content/docs/5.1/examples/carousel/index.html
+++ b/site/content/docs/5.1/examples/carousel/index.html
@@ -24,7 +24,7 @@ extra_css:
             <a class="nav-link disabled">Disabled</a>
           </li>
         </ul>
-        <form class="d-flex">
+        <form class="d-flex" role="search">
           <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
           <button class="btn btn-outline-success" type="submit">Search</button>
         </form>
diff --git a/site/content/docs/5.1/examples/cheatsheet-rtl/index.html b/site/content/docs/5.1/examples/cheatsheet-rtl/index.html
index 04afcbaf4..581686545 100644
--- a/site/content/docs/5.1/examples/cheatsheet-rtl/index.html
+++ b/site/content/docs/5.1/examples/cheatsheet-rtl/index.html
@@ -1240,7 +1240,7 @@ direction: rtl
                   <a class="nav-link disabled">معطل</a>
                 </li>
               </ul>
-              <form class="d-flex">
+              <form class="d-flex" role="search">
                 <input class="form-control me-2" type="search" placeholder="بحث" aria-label="بحث">
                 <button class="btn btn-outline-dark" type="submit">بحث</button>
               </form>
@@ -1279,7 +1279,7 @@ direction: rtl
                   <a class="nav-link disabled">معطل</a>
                 </li>
               </ul>
-              <form class="d-flex">
+              <form class="d-flex" role="search">
                 <input class="form-control me-2" type="search" placeholder="بحث" aria-label="بحث">
                 <button class="btn btn-outline-light" type="submit">بحث</button>
               </form>
@@ -1497,7 +1497,7 @@ direction: rtl
             <button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="قريب"></button>
           </div>
           <div class="toast-body">
-            مرحبا بالعالم! هذه رسالة إشعار.
+            مرحبًا بالعالم! هذه رسالة إشعار.
           </div>
         </div>
         {{< /example >}}
diff --git a/site/content/docs/5.1/examples/cheatsheet/index.html b/site/content/docs/5.1/examples/cheatsheet/index.html
index d68e26233..64269b31c 100644
--- a/site/content/docs/5.1/examples/cheatsheet/index.html
+++ b/site/content/docs/5.1/examples/cheatsheet/index.html
@@ -1239,7 +1239,7 @@ body_class: "bg-light"
                   <a class="nav-link disabled">Disabled</a>
                 </li>
               </ul>
-              <form class="d-flex">
+              <form class="d-flex" role="search">
                 <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
                 <button class="btn btn-outline-dark" type="submit">Search</button>
               </form>
@@ -1278,7 +1278,7 @@ body_class: "bg-light"
                   <a class="nav-link disabled">Disabled</a>
                 </li>
               </ul>
-              <form class="d-flex">
+              <form class="d-flex" role="search">
                 <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
                 <button class="btn btn-outline-light" type="submit">Search</button>
               </form>
diff --git a/site/content/docs/5.1/examples/footers/index.html b/site/content/docs/5.1/examples/footers/index.html
index b26909574..efa26b92d 100644
--- a/site/content/docs/5.1/examples/footers/index.html
+++ b/site/content/docs/5.1/examples/footers/index.html
@@ -48,7 +48,7 @@ body_class: ""
       <a href="/" class="mb-3 me-2 mb-md-0 text-muted text-decoration-none lh-1">
         <svg class="bi" width="30" height="24"><use xlink:href="#bootstrap"/></svg>
       </a>
-      <span class="text-muted">&copy; {{< year >}} Company, Inc</span>
+      <span class="mb-3 mb-md-0 text-muted">&copy; {{< year >}} Company, Inc</span>
     </div>
 
     <ul class="nav col-md-4 justify-content-end list-unstyled d-flex">
@@ -77,19 +77,19 @@ body_class: ""
 <div class="b-example-divider"></div>
 
 <div class="container">
-  <footer class="row row-cols-5 py-5 my-5 border-top">
-    <div class="col">
+  <footer class="row row-cols-1 row-cols-sm-2 row-cols-md-5 py-5 my-5 border-top">
+    <div class="col mb-3">
       <a href="/" class="d-flex align-items-center mb-3 link-dark text-decoration-none">
         <svg class="bi me-2" width="40" height="32"><use xlink:href="#bootstrap"/></svg>
       </a>
       <p class="text-muted">&copy; {{< year >}}</p>
     </div>
 
-    <div class="col">
+    <div class="col mb-3">
 
     </div>
 
-    <div class="col">
+    <div class="col mb-3">
       <h5>Section</h5>
       <ul class="nav flex-column">
         <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Home</a></li>
@@ -100,7 +100,7 @@ body_class: ""
       </ul>
     </div>
 
-    <div class="col">
+    <div class="col mb-3">
       <h5>Section</h5>
       <ul class="nav flex-column">
         <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Home</a></li>
@@ -111,7 +111,7 @@ body_class: ""
       </ul>
     </div>
 
-    <div class="col">
+    <div class="col mb-3">
       <h5>Section</h5>
       <ul class="nav flex-column">
         <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Home</a></li>
@@ -130,7 +130,7 @@ body_class: ""
 <div class="container">
   <footer class="py-5">
     <div class="row">
-      <div class="col-2">
+      <div class="col-6 col-md-2 mb-3">
         <h5>Section</h5>
         <ul class="nav flex-column">
           <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Home</a></li>
@@ -141,7 +141,7 @@ body_class: ""
         </ul>
       </div>
 
-      <div class="col-2">
+      <div class="col-6 col-md-2 mb-3">
         <h5>Section</h5>
         <ul class="nav flex-column">
           <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Home</a></li>
@@ -152,7 +152,7 @@ body_class: ""
         </ul>
       </div>
 
-      <div class="col-2">
+      <div class="col-6 col-md-2 mb-3">
         <h5>Section</h5>
         <ul class="nav flex-column">
           <li class="nav-item mb-2"><a href="#" class="nav-link p-0 text-muted">Home</a></li>
@@ -163,11 +163,11 @@ body_class: ""
         </ul>
       </div>
 
-      <div class="col-4 offset-1">
+      <div class="col-md-5 offset-md-1 mb-3">
         <form>
           <h5>Subscribe to our newsletter</h5>
           <p>Monthly digest of whats new and exciting from us.</p>
-          <div class="d-flex w-100 gap-2">
+          <div class="d-flex flex-column flex-sm-row w-100 gap-2">
             <label for="newsletter1" class="visually-hidden">Email address</label>
             <input id="newsletter1" type="text" class="form-control" placeholder="Email address">
             <button class="btn btn-primary" type="button">Subscribe</button>
@@ -176,7 +176,7 @@ body_class: ""
       </div>
     </div>
 
-    <div class="d-flex justify-content-between py-4 my-4 border-top">
+    <div class="d-flex flex-column flex-sm-row justify-content-between py-4 my-4 border-top">
       <p>&copy; {{< year >}} Company, Inc. All rights reserved.</p>
       <ul class="list-unstyled d-flex">
         <li class="ms-3"><a class="link-dark" href="#"><svg class="bi" width="24" height="24"><use xlink:href="#twitter"/></svg></a></li>
diff --git a/site/content/docs/5.1/examples/grid/index.html b/site/content/docs/5.1/examples/grid/index.html
index f26829b4f..fae182a1c 100644
--- a/site/content/docs/5.1/examples/grid/index.html
+++ b/site/content/docs/5.1/examples/grid/index.html
@@ -110,8 +110,8 @@ include_js: false
     <hr class="my-4">
 
     <h2 class="mt-4">Mixed: mobile and desktop</h2>
-    <p>The Bootstrap v4 grid system has five tiers of classes: xs (extra small, this class infix is not used), sm (small), md (medium), lg (large), and xl (extra large). You can use nearly any combination of these classes to create more dynamic and flexible layouts.</p>
-    <p>Each tier of classes scales up, meaning if you plan on setting the same widths for md, lg and xl, you only need to specify md.</p>
+    <p>The Bootstrap v5 grid system has six tiers of classes: xs (extra small, this class infix is not used), sm (small), md (medium), lg (large), xl (x-large), and xxl (xx-large). You can use nearly any combination of these classes to create more dynamic and flexible layouts.</p>
+    <p>Each tier of classes scales up, meaning if you plan on setting the same widths for md, lg, xl and xxl, you only need to specify md.</p>
     <div class="row mb-3">
       <div class="col-md-8 themed-grid-col">.col-md-8</div>
       <div class="col-6 col-md-4 themed-grid-col">.col-6 .col-md-4</div>
diff --git a/site/content/docs/5.1/examples/headers/index.html b/site/content/docs/5.1/examples/headers/index.html
index e15b47e5f..15f82c505 100644
--- a/site/content/docs/5.1/examples/headers/index.html
+++ b/site/content/docs/5.1/examples/headers/index.html
@@ -104,7 +104,7 @@ body_class: ""
           <li><a href="#" class="nav-link px-2 text-white">About</a></li>
         </ul>
 
-        <form class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3">
+        <form class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3" role="search">
           <input type="search" class="form-control form-control-dark" placeholder="Search..." aria-label="Search">
         </form>
 
@@ -132,7 +132,7 @@ body_class: ""
           <li><a href="#" class="nav-link px-2 link-dark">Products</a></li>
         </ul>
 
-        <form class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3">
+        <form class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3" role="search">
           <input type="search" class="form-control" placeholder="Search..." aria-label="Search">
         </form>
 
@@ -172,7 +172,7 @@ body_class: ""
       </div>
 
       <div class="d-flex align-items-center">
-        <form class="w-100 me-3">
+        <form class="w-100 me-3" role="search">
           <input type="search" class="form-control" placeholder="Search..." aria-label="Search">
         </form>
 
@@ -226,7 +226,7 @@ body_class: ""
         <svg class="bi me-2" width="40" height="32"><use xlink:href="#bootstrap"/></svg>
         <span class="fs-4">Double header</span>
       </a>
-      <form class="col-12 col-lg-auto mb-3 mb-lg-0">
+      <form class="col-12 col-lg-auto mb-3 mb-lg-0" role="search">
         <input type="search" class="form-control" placeholder="Search..." aria-label="Search">
       </form>
     </div>
@@ -279,7 +279,7 @@ body_class: ""
     </div>
     <div class="px-3 py-2 border-bottom mb-3">
       <div class="container d-flex flex-wrap justify-content-center">
-        <form class="col-12 col-lg-auto mb-2 mb-lg-0 me-lg-auto">
+        <form class="col-12 col-lg-auto mb-2 mb-lg-0 me-lg-auto" role="search">
           <input type="search" class="form-control" placeholder="Search..." aria-label="Search">
         </form>
 
diff --git a/site/content/docs/5.1/examples/navbar-fixed/index.html b/site/content/docs/5.1/examples/navbar-fixed/index.html
index 0c981392e..b0d998652 100644
--- a/site/content/docs/5.1/examples/navbar-fixed/index.html
+++ b/site/content/docs/5.1/examples/navbar-fixed/index.html
@@ -23,7 +23,7 @@ extra_css:
           <a class="nav-link disabled">Disabled</a>
         </li>
       </ul>
-      <form class="d-flex">
+      <form class="d-flex" role="search">
         <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
         <button class="btn btn-outline-success" type="submit">Search</button>
       </form>
diff --git a/site/content/docs/5.1/examples/navbar-static/index.html b/site/content/docs/5.1/examples/navbar-static/index.html
index 63c54c9f2..b6c26c94a 100644
--- a/site/content/docs/5.1/examples/navbar-static/index.html
+++ b/site/content/docs/5.1/examples/navbar-static/index.html
@@ -23,7 +23,7 @@ extra_css:
           <a class="nav-link disabled">Disabled</a>
         </li>
       </ul>
-      <form class="d-flex">
+      <form class="d-flex" role="search">
         <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
         <button class="btn btn-outline-success" type="submit">Search</button>
       </form>
diff --git a/site/content/docs/5.1/examples/navbars/index.html b/site/content/docs/5.1/examples/navbars/index.html
index 04d6ab623..d1c3675e4 100644
--- a/site/content/docs/5.1/examples/navbars/index.html
+++ b/site/content/docs/5.1/examples/navbars/index.html
@@ -33,8 +33,8 @@ extra_css:
             </ul>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -56,8 +56,8 @@ extra_css:
             <a class="nav-link" href="#">Link</a>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -90,8 +90,8 @@ extra_css:
             </ul>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -124,8 +124,8 @@ extra_css:
             </ul>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -158,8 +158,8 @@ extra_css:
             </ul>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -192,8 +192,8 @@ extra_css:
             </ul>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -226,8 +226,8 @@ extra_css:
             </ul>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -260,8 +260,8 @@ extra_css:
             </ul>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -294,8 +294,8 @@ extra_css:
             </ul>
           </li>
         </ul>
-        <form>
-          <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+        <form role="search">
+          <input class="form-control" type="search" placeholder="Search" aria-label="Search">
         </form>
       </div>
     </div>
@@ -363,8 +363,8 @@ extra_css:
               </ul>
             </li>
           </ul>
-          <form>
-            <input class="form-control" type="text" placeholder="Search" aria-label="Search">
+          <form role="search">
+            <input class="form-control" type="search" placeholder="Search" aria-label="Search">
           </form>
         </div>
       </div>
diff --git a/site/content/docs/5.1/examples/offcanvas-navbar/index.html b/site/content/docs/5.1/examples/offcanvas-navbar/index.html
index 5af7e2ea2..258e445e6 100644
--- a/site/content/docs/5.1/examples/offcanvas-navbar/index.html
+++ b/site/content/docs/5.1/examples/offcanvas-navbar/index.html
@@ -39,7 +39,7 @@ aliases: "/docs/5.1/examples/offcanvas/"
           </ul>
         </li>
       </ul>
-      <form class="d-flex">
+      <form class="d-flex" role="search">
         <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
         <button class="btn btn-outline-success" type="submit">Search</button>
       </form>
diff --git a/site/content/docs/5.1/examples/sticky-footer-navbar/index.html b/site/content/docs/5.1/examples/sticky-footer-navbar/index.html
index cd72aa778..1f807a6dc 100644
--- a/site/content/docs/5.1/examples/sticky-footer-navbar/index.html
+++ b/site/content/docs/5.1/examples/sticky-footer-navbar/index.html
@@ -27,7 +27,7 @@ body_class: "d-flex flex-column h-100"
             <a class="nav-link disabled">Disabled</a>
           </li>
         </ul>
-        <form class="d-flex">
+        <form class="d-flex" role="search">
           <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
           <button class="btn btn-outline-success" type="submit">Search</button>
         </form>