Merge pull request #9510 from ThomasWaldmann/new-version-selector-location-1.4

docs: move RTD version selector to sidebar top-left, fixes #8204

docs/_templates/layout.html

@@ -17,6 +17,7 @@
   {% if theme_touch_icon %}
   <link rel="apple-touch-icon" href="{{ pathto('_static/' ~ theme_touch_icon, 1) }}" />
   {% endif %}
+  <meta name="readthedocs-addons-api-version" content="1" />
   {{ super() }}
 {% endblock %}
 

docs/_templates/versionselector.html

@@ -0,0 +1,29 @@
+<div class="version-selector" id="borg-version-selector" style="display:none;">
+  <label for="version-select">Select your Borg version:</label>
+  <select id="version-select"></select>
+</div>
+<script type="text/javascript">
+  // Populate the version selector using ReadTheDocs data if available.
+  function borgInitVersionSelector(data) {
+    var versions = data && data.versions && data.versions.active;
+    if (!versions || !versions.length) return;
+    var current = data.versions && data.versions.current && data.versions.current.slug;
+    var select = document.getElementById("version-select");
+    if (!select) return;
+    versions.forEach(function(v) {
+      var opt = document.createElement("option");
+      opt.value = v.urls.documentation;
+      opt.textContent = v.slug;
+      if (v.slug === current) opt.selected = true;
+      select.appendChild(opt);
+    });
+    select.addEventListener("change", function() {
+      window.location.href = this.value;
+    });
+    document.getElementById("borg-version-selector").style.display = "";
+  }
+
+  document.addEventListener("readthedocs-addons-data-ready", function(event) {
+    borgInitVersionSelector(event.detail.data());
+  });
+</script>

docs/borg_theme/css/borg.css

@@ -194,3 +194,45 @@ cite {
 #common-options .option {
     white-space: nowrap;
 }
+/* Remove the right-column max-width cap so content fills the full available width. */
+#right-column {
+    max-width: none;
+}
+/* Hide the default RTD flyout since we show the version selector in the sidebar. */
+readthedocs-flyout {
+    display: none !important;
+}
+/* Version selector in the sidebar. */
+.version-selector {
+    padding: 0 22px;
+    margin: 7px 0 7px 0;
+    font-size: 14px;
+}
+.version-selector label {
+    display: block;
+    margin-bottom: 4px;
+    color: #000;
+}
+.version-selector select {
+    width: 100%;
+    padding: 4px;
+    background-color: #fafafa;
+    color: #000;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+}
+.version-selector::after {
+    content: '';
+    display: block;
+    border-top: 1px solid #ccc;
+    margin: 7px 0 0 0;
+}
+/* Reduce top and bottom margin of searchbox block to 7px to match separator spacing. */
+.sidebar-block:has(#main-search) {
+    margin-top: 7px;
+    margin-bottom: 7px;
+}
+/* Reduce the separator margin below the search block to 7px. */
+.sphinxsidebar > .sidebar-block:has(#main-search):after {
+    margin: 7px 22px 0 22px;
+}

docs/conf.py

@@ -161,7 +161,7 @@ smartquotes_action = 'qe'  # no D in there means "do not transform -- and ---"
 
 # Custom sidebar templates, maps document names to template names.
 html_sidebars = {
-    '**': ['logo-text.html', 'searchbox.html', 'globaltoc.html'],
+    '**': ['logo-text.html', "versionselector.html", 'searchbox.html', 'globaltoc.html'],
 }
 
 # Additional templates that should be rendered to pages, maps page names to