Merge branch 'main' into patrickhlauke-carousel

build/zip-examples.js

@@ -12,9 +12,10 @@
 const path = require('path')
 const sh = require('shelljs')
 
-const { version, version_short: versionShort } = require('../package.json')
+const pkg = require('../package.json')
 
-const folderName = `bootstrap-${version}-examples`
+const versionShort = pkg.config.version_short
+const folderName = `bootstrap-${pkg.version}-examples`
 
 sh.config.fatal = true
 

js/tests/unit/scrollspy.spec.js

@@ -68,7 +68,7 @@ describe('ScrollSpy', () => {
       fixtureEl.innerHTML = [
         '<nav id="navigation" class="navbar">',
         '  <ul class="navbar-nav">',
-        '    <li class="nav-item active"><a class="nav-link" id="one-link" href="#">One</a></li>',
+        '    <li class="nav-item"><a class="nav-link active" id="one-link" href="#">One</a></li>',
         '    <li class="nav-item"><a class="nav-link" id="two-link" href="#two">Two</a></li>',
         '    <li class="nav-item"><a class="nav-link" id="three-link" href="#three">Three</a></li>',
         '  </ul>',
@@ -177,7 +177,7 @@ describe('ScrollSpy', () => {
         '<div id="header" style="height: 500px;"></div>',
         '<nav id="navigation" class="navbar">',
         ' <ul class="navbar-nav">',
-        '   <li class="nav-item active"><a class="nav-link" id="one-link" href="#one">One</a></li>',
+        '   <li class="nav-item"><a class="nav-link active" id="one-link" href="#one">One</a></li>',
         '   <li class="nav-item"><a class="nav-link" id="two-link" href="#two">Two</a></li>',
         '   <li class="nav-item"><a class="nav-link" id="three-link" href="#three">Three</a></li>',
         ' </ul>',

js/tests/visual/dropdown.html

@@ -18,8 +18,8 @@
 
         <div class="collapse navbar-collapse" id="navbarResponsive">
           <ul class="navbar-nav">
-            <li class="nav-item active">
+            <li class="nav-item">
-              <a class="nav-link" href="#" aria-current="page">Home</a>
+              <a class="nav-link active" href="#" aria-current="page">Home</a>
             </li>
             <li class="nav-item">
               <a class="nav-link" href="#">Link</a>

js/tests/visual/modal.html

@@ -18,8 +18,8 @@
       <div class="collapse navbar-expand-md" id="navbarResponsive">
         <a class="navbar-brand" href="#">This shouldn't jump!</a>
         <ul class="navbar-nav">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" href="#" aria-current="page">Home</a>
+            <a class="nav-link active" href="#" aria-current="page">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>

package-lock.json

@@ -1612,15 +1612,15 @@
       "optional": true
     },
     "autoprefixer": {
-      "version": "10.1.0",
+      "version": "10.2.1",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.2.1.tgz",
-      "integrity": "sha512-0/lBNwN+ZUnb5su18NZo5MBIjDaq6boQKZcxwy86Gip/CmXA2zZqUoFQLCNAGI5P25ZWSP2RWdhDJ8osfKEjoQ==",
+      "integrity": "sha512-dwP0UjyYvROUvtU+boBx8ff5pPWami1NGTrJs9YUsS/oZVbRAcdNHOOuXSA1fc46tgKqe072cVaKD69rvCc3QQ==",
       "dev": true,
       "requires": {
-        "browserslist": "^4.15.0",
+        "browserslist": "^4.16.1",
-        "caniuse-lite": "^1.0.30001165",
+        "caniuse-lite": "^1.0.30001173",
         "colorette": "^1.2.1",
-        "fraction.js": "^4.0.12",
+        "fraction.js": "^4.0.13",
         "normalize-range": "^0.1.2",
         "postcss-value-parser": "^4.1.0"
       }
@@ -2053,16 +2053,16 @@
       }
     },
     "browserslist": {
-      "version": "4.16.0",
+      "version": "4.16.1",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.0.tgz",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.1.tgz",
-      "integrity": "sha512-/j6k8R0p3nxOC6kx5JGAxsnhc9ixaWJfYc+TNTzxg6+ARaESAvQGV7h0uNOB4t+pLQJZWzcrMxXOxjgsCj3dqQ==",
+      "integrity": "sha512-UXhDrwqsNcpTYJBTZsbGATDxZbiVDsx6UjpmRUmtnP10pr8wAYr5LgFoEFw9ixriQH2mv/NX2SfGzE/o8GndLA==",
       "dev": true,
       "requires": {
-        "caniuse-lite": "^1.0.30001165",
+        "caniuse-lite": "^1.0.30001173",
         "colorette": "^1.2.1",
-        "electron-to-chromium": "^1.3.621",
+        "electron-to-chromium": "^1.3.634",
         "escalade": "^3.1.1",
-        "node-releases": "^1.1.67"
+        "node-releases": "^1.1.69"
       }
     },
     "browserstack": {
@@ -2269,13 +2269,13 @@
       }
     },
     "call-bind": {
-      "version": "1.0.0",
+      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.0.tgz",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.1.tgz",
-      "integrity": "sha512-AEXsYIyyDY3MCzbwdhzG3Jx1R0J2wetQyUynn6dYHAO+bg8l1k7jwZtRv4ryryFs7EP+NDlikJlVe59jr0cM2w==",
+      "integrity": "sha512-tvAvUwNcRikl3RVF20X9lsYmmepsovzTWeJiXjO0PkJp15uy/6xKFZOQtuiSULwYW+6ToZBprphCgWXC2dSgcQ==",
       "dev": true,
       "requires": {
         "function-bind": "^1.1.1",
-        "get-intrinsic": "^1.0.0"
+        "get-intrinsic": "^1.0.2"
       }
     },
     "callsites": {
@@ -2386,14 +2386,14 @@
       }
     },
     "chokidar": {
-      "version": "3.4.3",
+      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.4.3.tgz",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.0.tgz",
-      "integrity": "sha512-DtM3g7juCXQxFVSNPNByEC2+NImtBuxQQvWlHunpJIS5Ocr0lG306cC7FCi7cEA0fzmybPUIl4txBIobk1gGOQ==",
+      "integrity": "sha512-JgQM9JS92ZbFR4P90EvmzNpSGhpPBGBSj10PILeDyYFwp4h2/D9OM03wsJ4zW1fEp4ka2DGrnUeD7FuvQ2aZ2Q==",
       "dev": true,
       "requires": {
         "anymatch": "~3.1.1",
         "braces": "~3.0.2",
-        "fsevents": "~2.1.2",
+        "fsevents": "~2.3.1",
         "glob-parent": "~5.1.0",
         "is-binary-path": "~2.1.0",
         "is-glob": "~4.0.1",
@@ -3321,9 +3321,9 @@
       "dev": true
     },
     "electron-to-chromium": {
-      "version": "1.3.634",
+      "version": "1.3.635",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.634.tgz",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.635.tgz",
-      "integrity": "sha512-QPrWNYeE/A0xRvl/QP3E0nkaEvYUvH3gM04ZWYtIa6QlSpEetRlRI1xvQ7hiMIySHHEV+mwDSX8Kj4YZY6ZQAw==",
+      "integrity": "sha512-RRriZOLs9CpW6KTLmgBqyUdnY0QNqqWs0HOtuQGGEMizOTNNn1P7sGRBxARnUeLejOsgwjDyRqT3E/CSst02ZQ==",
       "dev": true
     },
     "emoji-regex": {
@@ -4625,9 +4625,9 @@
       "dev": true
     },
     "fsevents": {
-      "version": "2.1.3",
+      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.1.tgz",
-      "integrity": "sha512-Auw9a4AxqWpa9GUfj370BMPzzyncfBABW8Mab7BGWBYDj4Isgq+cDKtx0i6u9jcX9pQDnswsaaOTgTmA5pEjuQ==",
+      "integrity": "sha512-YR47Eg4hChJGAB1O3yEAOkGO+rlzutoICGqGo9EZ4lKWokzZRSyIW1QmTzqjtw8MJdj9srP869CuWw/hyzSiBw==",
       "dev": true,
       "optional": true
     },
@@ -4864,9 +4864,9 @@
       "dev": true
     },
     "globby": {
-      "version": "11.0.1",
+      "version": "11.0.2",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-11.0.1.tgz",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-11.0.2.tgz",
-      "integrity": "sha512-iH9RmgwCmUJHi2z5o2l3eTtGBtXek1OYlHrbcxOYugyHLmAsZrPj43OtHThd62Buh/Vv6VyCBD2bdyWcGNQqoQ==",
+      "integrity": "sha512-2ZThXDvvV8fYFRVIxnrMQBipZQDr7MxKAmQK1vujaj9/7eF0efG7BPUKJ7jP7G5SLF37xKDXvO4S/KKLj/Z0og==",
       "dev": true,
       "requires": {
         "array-union": "^2.1.0",
@@ -6579,9 +6579,9 @@
       "dev": true
     },
     "meow": {
-      "version": "8.1.0",
+      "version": "8.1.2",
-      "resolved": "https://registry.npmjs.org/meow/-/meow-8.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/meow/-/meow-8.1.2.tgz",
-      "integrity": "sha512-fNWkgM1UVMey2kf24yLiccxLihc5W+6zVus3/N0b+VfnJgxV99E9u04X6NAiKdg6ED7DAQBX5sy36NM0QJZkWA==",
+      "integrity": "sha512-r85E3NdZ+mpYk1C6RjPFEMSE+s1iZMuHtsHAqY0DT3jZczl0diWUZ8g6oU7h0M9cD2EL+PzaYghhCLzR0ZNn5Q==",
       "dev": true,
       "requires": {
         "@types/minimist": "^1.2.0",
@@ -7834,9 +7834,9 @@
       "optional": true
     },
     "postcss": {
-      "version": "8.2.2",
+      "version": "8.2.4",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.2.2.tgz",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.2.4.tgz",
-      "integrity": "sha512-HM1NDNWLgglJPQQMNwvLxgH2KcrKZklKLi/xXYIOaqQB57p/pDWEJNS83PVICYsn1Dg/9C26TiejNr422/ePaQ==",
+      "integrity": "sha512-kRFftRoExRVXZlwUuay9iC824qmXPcQQVzAjbCCgjpXnkdMCJYBu2gTwAaFBzv8ewND6O8xFb3aELmEkh9zTzg==",
       "dev": true,
       "requires": {
         "colorette": "^1.2.1",
@@ -8839,6 +8839,15 @@
       "dev": true,
       "requires": {
         "fsevents": "~2.1.2"
+      },
+      "dependencies": {
+        "fsevents": {
+          "version": "2.1.3",
+          "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz",
+          "integrity": "sha512-Auw9a4AxqWpa9GUfj370BMPzzyncfBABW8Mab7BGWBYDj4Isgq+cDKtx0i6u9jcX9pQDnswsaaOTgTmA5pEjuQ==",
+          "dev": true,
+          "optional": true
+        }
       }
     },
     "rollup-plugin-istanbul": {
@@ -9463,9 +9472,9 @@
       }
     },
     "socket.io": {
-      "version": "2.4.0",
+      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-2.4.0.tgz",
+      "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-2.4.1.tgz",
-      "integrity": "sha512-9UPJ1UTvKayuQfVv2IQ3k7tCQC/fboDyIK62i99dAQIyHKaBsNdTpwHLgKJ6guRWxRtC9H+138UwpaGuQO9uWQ==",
+      "integrity": "sha512-Si18v0mMXGAqLqCVpTxBa8MGqriHGQh8ccEOhmsmNS3thNCGBwO8WGrwMibANsWtQQ5NStdZwHqZR3naJVFc3w==",
       "dev": true,
       "requires": {
         "debug": "~4.1.0",

package.json

@@ -2,7 +2,9 @@
   "name": "bootstrap",
   "description": "The most popular front-end framework for developing responsive, mobile first projects on the web.",
   "version": "5.0.0-beta1",
-  "version_short": "5.0",
+  "config": {
+    "version_short": "5.0"
+  },
   "keywords": [
     "css",
     "sass",
@@ -32,7 +34,7 @@
     "css-prefix": "npm-run-all --parallel css-prefix-*",
     "css-prefix-main": "postcss --config build/postcss.config.js --replace \"dist/css/*.css\" \"!dist/css/*.rtl*.css\" \"!dist/css/*.min.css\"",
     "css-prefix-examples": "postcss --config build/postcss.config.js --replace \"site/content/**/*.css\"",
-    "css-prefix-examples-rtl": "cross-env-shell NODE_ENV=RTL postcss --config build/postcss.config.js --dir \"site/content/docs/$npm_package_version_short/examples/\" --ext \".rtl.css\" --base \"site/content/docs/$npm_package_version_short/examples/\" \"site/content/docs/$npm_package_version_short/examples/{blog,carousel,dashboard,cheatsheet}/*.css\" \"!site/content/docs/$npm_package_version_short/examples/{blog,carousel,dashboard,cheatsheet}/*.rtl.css\"",
+    "css-prefix-examples-rtl": "cross-env-shell NODE_ENV=RTL postcss --config build/postcss.config.js --dir \"site/content/docs/$npm_package_config_version_short/examples/\" --ext \".rtl.css\" --base \"site/content/docs/$npm_package_config_version_short/examples/\" \"site/content/docs/$npm_package_config_version_short/examples/{blog,carousel,dashboard,cheatsheet}/*.css\" \"!site/content/docs/$npm_package_config_version_short/examples/{blog,carousel,dashboard,cheatsheet}/*.rtl.css\"",
     "js": "npm-run-all js-compile js-minify",
     "js-compile": "npm-run-all --parallel js-compile-*",
     "js-compile-standalone": "rollup --environment BUNDLE:false --config build/rollup.config.js --sourcemap",
@@ -106,7 +108,7 @@
     "@rollup/plugin-commonjs": "^17.0.0",
     "@rollup/plugin-node-resolve": "^11.0.1",
     "@rollup/plugin-replace": "^2.3.4",
-    "autoprefixer": "^10.1.0",
+    "autoprefixer": "^10.2.1",
     "bundlewatch": "^0.3.1",
     "clean-css-cli": "^4.3.0",
     "cross-env": "^7.0.3",
@@ -133,7 +135,7 @@
     "lockfile-lint": "^4.3.7",
     "nodemon": "^2.0.7",
     "npm-run-all": "^4.1.5",
-    "postcss": "^8.2.2",
+    "postcss": "^8.2.4",
     "postcss-cli": "^8.3.1",
     "rollup": "^2.36.1",
     "rollup-plugin-istanbul": "^3.0.0",

scss/_reboot.scss

@@ -411,6 +411,15 @@ button {
   border-radius: 0;
 }
 
+// Explicitly remove focus outline in Chromium when it shouldn't be
+// visible (e.g. as result of mouse click or touch tap). It already
+// should be doing this automatically, but seems to currently be
+// confused and applies its very visible two-tone outline anyway.
+
+button:focus:not(:focus-visible) {
+  outline: 0;
+}
+
 // 1. Remove the margin in Firefox and Safari
 
 input,

site/content/docs/5.0/examples/navbar-bottom/index.html

@@ -18,8 +18,8 @@ title: Bottom navbar example
     </button>
     <div class="collapse navbar-collapse" id="navbarCollapse">
       <ul class="navbar-nav">
-        <li class="nav-item active">
+        <li class="nav-item">
-          <a class="nav-link" aria-current="page" href="#">Home</a>
+          <a class="nav-link active" aria-current="page" href="#">Home</a>
         </li>
         <li class="nav-item">
           <a class="nav-link" href="#">Link</a>

site/content/docs/5.0/examples/navbar-fixed/index.html

@@ -13,8 +13,8 @@ extra_css:
     </button>
     <div class="collapse navbar-collapse" id="navbarCollapse">
       <ul class="navbar-nav me-auto mb-2 mb-md-0">
-        <li class="nav-item active">
+        <li class="nav-item">
-          <a class="nav-link" aria-current="page" href="#">Home</a>
+          <a class="nav-link active" aria-current="page" href="#">Home</a>
         </li>
         <li class="nav-item">
           <a class="nav-link" href="#">Link</a>

site/content/docs/5.0/examples/navbar-static/index.html

@@ -13,8 +13,8 @@ extra_css:
     </button>
     <div class="collapse navbar-collapse" id="navbarCollapse">
       <ul class="navbar-nav me-auto mb-2 mb-md-0">
-        <li class="nav-item active">
+        <li class="nav-item">
-          <a class="nav-link" aria-current="page" href="#">Home</a>
+          <a class="nav-link active" aria-current="page" href="#">Home</a>
         </li>
         <li class="nav-item">
           <a class="nav-link" href="#">Link</a>

site/content/docs/5.0/examples/navbars/index.html

@@ -15,8 +15,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExample01">
         <ul class="navbar-nav me-auto mb-2">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -49,8 +49,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExample02">
         <ul class="navbar-nav me-auto">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -72,8 +72,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExample03">
         <ul class="navbar-nav me-auto mb-2 mb-sm-0">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -106,8 +106,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExample04">
         <ul class="navbar-nav me-auto mb-2 mb-md-0">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -140,8 +140,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExample05">
         <ul class="navbar-nav me-auto mb-2 mb-lg-0">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -174,8 +174,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExample06">
         <ul class="navbar-nav me-auto mb-2 mb-xl-0">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -208,8 +208,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExampleXxl">
         <ul class="navbar-nav me-auto mb-2 mb-xl-0">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -242,8 +242,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExample07">
         <ul class="navbar-nav me-auto mb-2 mb-lg-0">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -276,8 +276,8 @@ extra_css:
 
       <div class="collapse navbar-collapse" id="navbarsExample07XL">
         <ul class="navbar-nav me-auto mb-2 mb-lg-0">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -313,8 +313,8 @@ extra_css:
 
       <div class="collapse navbar-collapse justify-content-md-center" id="navbarsExample08">
         <ul class="navbar-nav">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Centered nav only</a>
+            <a class="nav-link active" aria-current="page" href="#">Centered nav only</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>
@@ -345,8 +345,8 @@ extra_css:
 
         <div class="collapse navbar-collapse" id="navbarsExample09">
           <ul class="navbar-nav me-auto mb-2 mb-lg-0">
-            <li class="nav-item active">
+            <li class="nav-item">
-              <a class="nav-link" aria-current="page" href="#">Home</a>
+              <a class="nav-link active" aria-current="page" href="#">Home</a>
             </li>
             <li class="nav-item">
               <a class="nav-link" href="#">Link</a>
@@ -378,8 +378,8 @@ extra_css:
 
         <div class="collapse navbar-collapse justify-content-md-center" id="navbarsExample10">
           <ul class="navbar-nav">
-            <li class="nav-item active">
+            <li class="nav-item">
-              <a class="nav-link" aria-current="page" href="#">Centered nav only</a>
+              <a class="nav-link active" aria-current="page" href="#">Centered nav only</a>
             </li>
             <li class="nav-item">
               <a class="nav-link" href="#">Link</a>

site/content/docs/5.0/examples/offcanvas/index.html

@@ -17,8 +17,8 @@ body_class: "bg-light"
 
     <div class="navbar-collapse offcanvas-collapse" id="navbarsExampleDefault">
       <ul class="navbar-nav me-auto mb-2 mb-lg-0">
-        <li class="nav-item active">
+        <li class="nav-item">
-          <a class="nav-link" aria-current="page" href="#">Dashboard</a>
+          <a class="nav-link active" aria-current="page" href="#">Dashboard</a>
         </li>
         <li class="nav-item">
           <a class="nav-link" href="#">Notifications</a>

site/content/docs/5.0/examples/starter-template/index.html

@@ -14,8 +14,8 @@ extra_css:
 
     <div class="collapse navbar-collapse" id="navbarsExampleDefault">
       <ul class="navbar-nav me-auto mb-2 mb-md-0">
-        <li class="nav-item active">
+        <li class="nav-item">
-          <a class="nav-link" aria-current="page" href="#">Home</a>
+          <a class="nav-link active" aria-current="page" href="#">Home</a>
         </li>
         <li class="nav-item">
           <a class="nav-link" href="#">Link</a>

site/content/docs/5.0/examples/sticky-footer-navbar/index.html

@@ -17,8 +17,8 @@ body_class: "d-flex flex-column h-100"
       </button>
       <div class="collapse navbar-collapse" id="navbarCollapse">
         <ul class="navbar-nav me-auto mb-2 mb-md-0">
-          <li class="nav-item active">
+          <li class="nav-item">
-            <a class="nav-link" aria-current="page" href="#">Home</a>
+            <a class="nav-link active" aria-current="page" href="#">Home</a>
           </li>
           <li class="nav-item">
             <a class="nav-link" href="#">Link</a>

site/content/docs/5.0/layout/breakpoints.md

@@ -1,7 +1,7 @@
 ---
 layout: docs
 title: Breakpoints
-description: Breakpoints are the triggers in Bootstrap for how your layout responsive changes across device or viewport sizes.
+description: Breakpoints are customizable widths that determine how your responsive layout behaves across device or viewport sizes in Bootstrap.
 group: layout
 aliases: "/docs/5.0/layout/"
 toc: true

site/data/sidebar.yml

@@ -1,3 +1,6 @@
+# This file holds all sidebar menu's entries.
+# The logic for the sidebar generation is in "site/layouts/partials/docs-sidebar.html".
+
 - title: Getting started
   pages:
     - title: Introduction
@@ -26,7 +29,6 @@
     - title: Breakpoints
     - title: Containers
     - title: Grid
-    # - title: Rows
     - title: Columns
     - title: Gutters
     - title: Utilities
@@ -117,3 +119,5 @@
     - title: Brand
     - title: License
     - title: Translations
+
+- title: Migration

site/layouts/partials/docs-sidebar.html

@@ -13,33 +13,33 @@
     {{- end -}}
 
     {{- $group_slug := $group.title | urlize -}}
-    {{- $is_active_group := eq $.Page.Params.group $group_slug }}
+    {{- $is_active_group := eq $.Page.Params.group $group_slug -}}
 
-    <li class="mb-1{{ if $is_active_group }} active{{ end }}">
+    {{- if $group.pages }}
-      <button class="btn d-inline-flex align-items-center rounded{{ if not $is_active_group }} collapsed{{ end }}" data-bs-toggle="collapse" data-bs-target="#{{ $group_slug }}-collapse" aria-expanded="{{ $is_active_group }}"{{ if $is_active_group }} aria-current="true"{{ end }}>
+      <li class="mb-1">
-        {{ $group.title }}
+        <button class="btn d-inline-flex align-items-center rounded{{ if not $is_active_group }} collapsed{{ end }}" data-bs-toggle="collapse" data-bs-target="#{{ $group_slug }}-collapse" aria-expanded="{{ $is_active_group }}"{{ if $is_active_group }} aria-current="true"{{ end }}>
-      </button>
+          {{ $group.title }}
+        </button>
 
-      {{- if $group.pages }}
+        <div class="collapse{{ if $is_active_group }} show{{ end }}" id="{{ $group_slug }}-collapse">
-      <div class="collapse{{ if $is_active_group }} show{{ end }}" id="{{ $group_slug }}-collapse">
+          <ul class="list-unstyled fw-normal pb-1 small">
-        <ul class="list-unstyled fw-normal pb-1 small">
+            {{- range $doc := $group.pages -}}
-          {{- range $doc := $group.pages -}}
+              {{- $doc_slug := $doc.title | urlize -}}
-            {{- $doc_slug := $doc.title | urlize -}}
+              {{- $is_active := and $is_active_group (eq $page_slug $doc_slug) -}}
-            {{- $is_active := and $is_active_group (eq $page_slug $doc_slug) -}}
+              {{- $href := printf "/docs/%s/%s/%s/" $.Site.Params.docs_version $group_slug $doc_slug }}
-            {{- $href := printf "/docs/%s/%s/%s/" $.Site.Params.docs_version $group_slug $doc_slug }}
+              <li><a href="{{ $href }}" class="d-inline-flex align-items-center rounded{{ if $is_active }} active{{ end }}"{{ if $is_active }} aria-current="page"{{ end }}>{{ $doc.title }}</a></li>
-            <li><a href="{{ $href }}" class="d-inline-flex align-items-center rounded{{ if $is_active }} active{{ end }}"{{ if $is_active }} aria-current="page"{{ end }}>{{ $doc.title }}</a></li>
+            {{- end }}
-          {{- end }}
+          </ul>
-        </ul>
+        </div>
-      </div>
+      </li>
-      {{- end }}
+    {{- else }}
-    </li>
+      <li class="my-3 mx-4 border-top"></li>
+      <li>
+        <a href="/docs/{{ $.Site.Params.docs_version }}/{{ $group_slug }}/" class="d-inline-flex align-items-center rounded{{ if $is_active_group }} active{{ end }}"{{ if $is_active_group }} aria-current="page"{{ end }}>
+          {{ $group.title }}
+        </a>
+      </li>
+    {{- end }}
   {{- end }}
-
-    <li class="my-3 mx-4 border-top"></li>
-    <li{{ if eq $page_slug "migration" }} class="active"{{ end }}>
-      <a href="/docs/{{ $.Site.Params.docs_version }}/migration/" class="d-inline-flex align-items-center rounded">
-        Migration
-      </a>
-    </li>
   </ul>
 </nav>