Add support for versions using the Pydata-Sphinx-Thme switcher

doc/_static/css/custom_styles.css

@@ -205,27 +205,10 @@ a[href="#join-our-community"] + ul li.toc-h3 {
   display: none;
 }
 
-/* Version selector and header */
+/* Version selector */
 
-#versions-header {
-  color: rgb(0 0 0 / 65%);
-  font-size: 0.8rem;
-  margin-top: 1.1rem;
-  text-transform: uppercase;
-}
-
-#select-versions {
-  background-color: transparent;
-  border: 1px solid rgb(0 0 0 / 15%);
-  color: rgb(0 0 0 / 65%);
-  font-size: 90%;
-  margin-bottom: 7px;
-  padding: 2px;
-}
-
-#select-versions,
-#select-versions option {
-  width: 98%;
+.version-switcher__button {
+  margin-bottom: 0 !important;
 }
 
 /*** Styles for video transcript dropdown elements ***/

doc/_static/versions.json

@@ -0,0 +1,15 @@
+[
+    {
+        "version": "5",
+        "preferred": true,
+        "url": "https://docs.spyder-ide.org/5/"
+    },
+    {
+        "version": "4",
+        "url": "https://docs.spyder-ide.org/4/"
+    },
+    {
+        "version": "3",
+        "url": "https://docs.spyder-ide.org/3/"
+    }
+]

doc/conf.py

@@ -143,7 +143,13 @@
 html_logo = "_static/images/spyder_logo.svg"
 html_theme_options = {
     "header_links_before_dropdown": 8,
+    "navbar_start": ["navbar-logo", "version-switcher"],
     "navigation_with_keys": False,
+    "show_version_warning_banner": True,
+    "switcher": {
+        "json_url": "https://docs.spyder-ide.org/versions.json",
+        "version_match": version,
+    },
 }
 html_context = {
     "github_user": "spyder-ide",