DOC: Style version switcher button (numpy#21451)

* DOC: use PR ref as version name in CircleCI preview

* DOC: style version button depending on release

* DOC: fix logic for switcher_version.

[skip actions] [skip azp] [skip travis]

* DOC: provision empty dataset attribute and simplify not.

[skip actions] [skip azp] [skip travis]

Author: tupui

doc/source/_static/numpy.css

@@ -32,6 +32,36 @@ h3 {
   letter-spacing: -.03em;
 }
 
+/* Style the active version button.
+
+- dev: orange
+- stable: green
+- old, PR: red
+
+Colors from:
+
+Wong, B. Points of view: Color blindness.
+Nat Methods 8, 441 (2011). https://doi.org/10.1038/nmeth.1618
+*/
+
+/* If the active version has the name "dev", style it orange */
+#version_switcher_button[data-active-version-name*="dev"] {
+  background-color: #E69F00;
+  border-color: #E69F00;
+}
+
+/* green for `stable` */
+#version_switcher_button[data-active-version-name*="stable"] {
+  background-color: #009E73;
+  border-color: #009E73;
+}
+
+/* red for `old` */
+#version_switcher_button:not([data-active-version-name*="stable"], [data-active-version-name*="dev"], [data-active-version-name=""]) {
+  background-color: #980F0F;
+  border-color: #980F0F;
+}
+
 /* Main page overview cards */
 
 .intro-card {

doc/source/conf.py

@@ -172,7 +172,11 @@ def setup(app):
 html_favicon = '_static/favicon/favicon.ico'
 
 # Set up the version switcher.  The versions.json is stored in the devdocs.
-if ".dev" in version:
+if os.environ.get('CIRCLE_JOB', False) and \
+        os.environ.get('CIRCLE_BRANCH', '') != 'main':
+    # For PR, name is set to its ref
+    switcher_version = os.environ['CIRCLE_BRANCH']
+elif ".dev" in version:
     switcher_version = "devdocs"
 else:
     switcher_version = f"doc/{version}"