add docs versions

Author: fantix

.github/workflows/docs.yml

@@ -62,7 +62,7 @@ jobs:
         with open('docs/versions.json', 'w') as f:
             json.dump(versions, f)
     - name: Publish to GitHub Pages
-      uses: fantix/ghaction-github-pages@master
+      uses: python-gino/ghaction-github-pages@master
       with:
         repo: python-gino/python-gino.org
         target_branch: master

docs/theme/layout.html

@@ -111,7 +111,7 @@
                 }}<a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/">{{
                         "知识共享署名-相同方式共享 4.0 国际许可协议"
                         if language.startswith('zh') else
-                        "Creative Commons Attribution-ShareAlike 4.0 International License"
+                        " Creative Commons Attribution-ShareAlike 4.0 International License"
                 }}</a>{{ "进行许可。" if language.startswith('zh') else "." }}
             </p>
         </div>
@@ -121,6 +121,11 @@
                 {% if pagename != master_doc %}
                     {{ toc }}
                 {% endif %}
+                <div id="version-selector">
+                    {% if pagename != master_doc and toc.count('href') > 1 %}
+                        <hr>
+                    {% endif %}
+                </div>
             </div>
         </div>
 
@@ -132,9 +137,7 @@
               {{ (language or "EN")[:2].upper() }}
             </div>
         </a>
-        <ul>
-            <li><a href="/docs/en/{{ VERSION.split('/')[-1] }}/{{ pagename }}.html" class="btn-floating blue">EN</a></li>
-            <li><a href="/docs/zh/{{ VERSION.split('/')[-1] }}/{{ pagename }}.html" class="btn-floating red">ZH</a></li>
+        <ul id="lang-selector">
         </ul>
     </div>
 </main>
@@ -144,6 +147,11 @@
 <script id="documentation_options" data-url_root="{{ pathto('', 1) }}" src="{{ pathto('_static/js/documentation_options.js', 1) }}"></script>
 <script type="text/javascript" src="{{ pathto('_static/js/underscore.js', 1) }}"></script>
 <script type="text/javascript" src="{{ pathto('_static/js/jquery.js', 1) }}"></script>
+<script type="text/javascript">
+    var sver = '{{ '.'.join(VERSION.split('/')[-1].lstrip('v').split('.')[:2]) }}';
+    var language = '{{ language or "en" }}';
+    var pagename = '{{ pagename }}';
+</script>
 <script type="text/javascript" src="{{ pathto('_static/js/gino.js', 1) }}"></script>
 <script type="text/javascript" src="{{ pathto('searchindex.js', 1) }}"></script>
 </body>

docs/theme/static/css/gino.css

@@ -295,10 +295,6 @@ div.search i {
     overflow-y: auto;
 }
 
-.table-of-contents > ul {
-    padding-bottom: 80px;
-}
-
 .table-of-contents li {
     padding: 0;
 }
@@ -343,6 +339,37 @@ div.search i {
     font-weight: 500;
 }
 
+.table-of-contents #version-selector hr {
+    margin-top: 48px;
+}
+
+.table-of-contents #version-selector div {
+    margin-top: 16px;
+    color: #757575;
+}
+
+.table-of-contents #version-selector a {
+    color: #757575;
+}
+
+.table-of-contents #version-selector span,
+.table-of-contents #version-selector a,
+.table-of-contents #version-selector a:active,
+.table-of-contents #version-selector a:hover {
+    border-left: none;
+    padding: 8px;
+    margin-left: 16px;
+}
+
+.table-of-contents #version-selector a:active,
+.table-of-contents #version-selector a:hover {
+    color: var(--v-info-light);
+}
+
+.table-of-contents #version-selector span {
+    color: var(--v-info-light);
+}
+
 h1 {
     font-size: 32px;
     margin: 32px 0 20px 0;
@@ -637,6 +664,10 @@ nav a.sidenav-trigger hr {
     height: 2px;
 }
 
+.fixed-action-btn {
+    display: none;
+}
+
 @media (min-width: 993px) {
     main {
         padding-left: 300px;
@@ -738,6 +769,10 @@ nav a.sidenav-trigger hr {
     .sidenav {
         top: 56px;
     }
+
+    .fixed-action-btn {
+        display: block;
+    }
 }
 
 @media (max-width: 510px) {

docs/theme/static/js/gino.js

@@ -476,11 +476,6 @@ document.addEventListener('DOMContentLoaded', function () {
     }
     sidenav.scrollTop = current.offsetTop - sidenav.clientHeight / 2;
 
-    // language and version selector
-    M.FloatingActionButton.init(document.querySelectorAll('.fixed-action-btn'), {
-        hoverEnabled: false
-    });
-
     // customize ScrollSpy
     var ScrollSpy = M.ScrollSpy, $ = window.cash;
     ScrollSpy._last = null;
@@ -616,4 +611,32 @@ document.addEventListener('DOMContentLoaded', function () {
     jQuery('.boxed-nav li').each(function (i, li) {
         jQuery(li).wrapInner('<a href="' + jQuery('a:first', li).attr('href') + '"><div></div></a>');
     });
+    fetch('/docs/versions.json').then(function (r) {
+        r.json().then(function (resp) {
+            var langSel = jQuery('#lang-selector');
+            var verSel = jQuery('#version-selector');
+            var langColors = {zh: '#ff0000', en: '#0000ff'};
+            var langNames = {
+                zh: language.startsWith('zh') ? '中文' : 'Chinese',
+                en: language.startsWith('zh') ? '英文' : 'English'
+            }
+            Object.keys(resp).forEach(function (loc) {
+                langSel.append('<li><a href="/docs/' + loc + '/' + sver + '/' + pagename + '.html" class="btn-floating" style="background-color: ' + langColors[loc] + '!important">' + loc.toUpperCase() + '</a></li>');
+                var curLoc = verSel.append('<div>' + langNames[loc] + '</div>')
+                curLoc.append('<a href="https://python-gino.readthedocs.io/' + loc +  '/v0.8.5/" target="_blank">0.8</a>')
+                resp[loc].forEach(function (ver) {
+                    if (sver === ver && language.startsWith(loc)) {
+                        curLoc.append('<span>' + ver + '</span>')
+                    } else {
+                        curLoc.append('<a href="/docs/' + loc + '/' + ver + '/' + pagename + '.html">' + ver + '</a>')
+                    }
+                });
+            })
+
+            // language and version selector
+            M.FloatingActionButton.init(document.querySelectorAll('.fixed-action-btn'), {
+                hoverEnabled: false
+            });
+        })
+    });
 });