Fixed left bar's version number gray text on gray button background.

Author: AMDphreak

___README.md

@@ -0,0 +1,7 @@
+Are the docs for antora and asciidoctor and asciidoctor.js out of date? They need to mention the change in extension name from @antora/tabs-extension to @asciidoc/tabs
+
+I have clones, some of which are forked.
+
+Antora Gitlab fork: Z:\code\amdphreak\antora
+
+. Please fix them, commit, push, fork to the-dev-center org if needed (please check if remotes need to be updated first), and then find issues mentioning this problem. If none can be found, create a new issue, create a PR, and link the issue in PR description.

supplemental-ui/css/site-extra.css

@@ -182,7 +182,7 @@ html.dark-theme .doc .openblock>.content {
 /* Collapsible blocks (details/summary) */
 html.dark-theme .doc details,
 html.dark-theme .doc details[open],
-html.dark-theme .doc .exampleblock[%collapsible],
+html.dark-theme .doc .exampleblock.is-collapsible,
 html.dark-theme .doc details>summary {
   background-color: #1f2125 !important;
   background: #1f2125 !important;
@@ -442,11 +442,17 @@ html.dark-theme .nav-menu-toggle {
 
 /* Component/version selector in navigation */
 html.dark-theme .nav-panel-explore .context .version {
-  color: #909296;
+  color: #e9ecef;
+  background-color: #2c2e33;
+  padding: 0.1rem 0.5rem;
+  border-radius: 0.25rem;
+  border: 1px solid #373a40;
 }
 
 html.dark-theme .nav-panel-explore .context .version:hover {
-  color: #c1c2c5;
+  color: #ffffff;
+  background-color: #3b3d42;
+  border-color: #4dabf7;
 }
 
 /* Chevron icon in component/version selector */
@@ -460,32 +466,39 @@ html.dark-theme .nav-panel-explore .component,
 html.dark-theme .nav-panel-explore .component-menu,
 html.dark-theme .nav-panel-explore .versions,
 html.dark-theme .nav-panel-explore .component-menu ul,
-html.dark-theme .nav-panel-explore .component-menu li,
 html.dark-theme .nav-panel-explore .versions ul,
-html.dark-theme .nav-panel-explore .versions li,
-html.dark-theme .nav-panel-explore .context>*,
 html.dark-theme .nav-panel-explore .context div {
   background-color: #25262b;
   color: #c1c2c5;
 }
 
 html.dark-theme .nav-panel-explore .component-menu a,
 html.dark-theme .nav-panel-explore .versions a {
-  color: #c1c2c5;
+  color: #e9ecef;
+  background-color: #2c2e33;
+  padding: 0.25rem 0.6rem;
+  margin: 0.15rem 0;
+  display: block;
+  border-radius: 0.25rem;
+  border: 1px solid #373a40;
+  transition: all 0.2s ease;
 }
 
 html.dark-theme .nav-panel-explore .component-menu a:hover,
 html.dark-theme .nav-panel-explore .versions a:hover,
 html.dark-theme .nav-panel-explore .component-menu li:hover,
 html.dark-theme .nav-panel-explore .versions li:hover {
-  background-color: #2c2e33;
+  background-color: #3b3d42;
   color: #ffffff;
+  border-color: #4dabf7;
 }
 
 html.dark-theme .nav-panel-explore .component-menu .is-current,
 html.dark-theme .nav-panel-explore .versions .is-current {
-  background-color: #2c2e33;
-  color: #ffffff;
+  background-color: #141517;
+  color: #4dabf7;
+  font-weight: 600;
+  border-color: #4dabf7;
 }
 
 /* Reduce strong inner shadow on component/version dropdown */