Docs: enhance versions page to identify 5.3 as latest

diff --git a/site/data/docs-versions.yml b/site/data/docs-versions.yml
index f9cf66c8de38010ae25b1d72039e6d8b1da6d665..233c45de78f6b273b6eeea1d8719c61a62fc6099 100644 (file)
--- a/site/data/docs-versions.yml
+++ b/site/data/docs-versions.yml
@@ -57,6 +57,6 @@
 
 - group: v6.x
   baseurl: 'https://getbootstrap.com/docs'
-  description: 'Upcoming major release. First release will be v6.0.0-alpha1.'
+  description: 'Upcoming major release. First release is v6.0.0-alpha1.'
   versions:
     - '6.0'

diff --git a/site/src/pages/docs/versions.astro b/site/src/pages/docs/versions.astro
index e15f20a3ce5905e04a2c47b341fba92477463fd7..11fb1a416affd0dcc346c74f1c7d54ae32646871 100644 (file)
--- a/site/src/pages/docs/versions.astro
+++ b/site/src/pages/docs/versions.astro
@@ -29,18 +29,22 @@ function getVersionsSortedDesc<TKey extends string, TVersions extends Record<TKe
                 .slice()
                 .sort((a, b) => b.localeCompare(a))
                 .map((version) => {
-                  const isCurrentVersion = version === getConfig().docs_version
+                  // TODO: revert to getConfig().docs_version once we have v6.0.0 released
+                  // const isCurrentVersion = version === getConfig().docs_version
+                  const isCurrentVersion = version === '5.3'
+                  const isAlpha = version === '6.0'
 
                   return (
                     <a
                       class:list={[
                         'list-group-item list-group-item-action py-2 text-primary',
-                        isCurrentVersion && 'd-flex justify-content-between align-items-center'
+                        (isCurrentVersion || isAlpha) && 'd-flex justify-content-between align-items-center'
                       ]}
                       href={`${docsVersion.baseurl}/${version}/`}
                     >
                       {version}
                       {isCurrentVersion && <span class="badge text-bg-primary">Latest</span>}
+                      {isAlpha && <span class="badge text-bg-warning">Alpha</span>}
                     </a>
                   )
                 })}