#1932 Publish v13 Docs using mike

.github/workflows/deploy-docs.yml

@@ -32,15 +32,20 @@ jobs:
         working-directory: ./docs
     steps:
       - uses: actions/checkout@v4
-      - uses: actions/setup-python@v5
+       # We need to additionally fetch the gh-pages branch for mike deploy
         with:
-          python-version: 3.x
+          fetch-depth: 0
+      - name: Set up Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: 3.11
       - run: echo "cache_id=$(date --utc '+%V')" >> $GITHUB_ENV
       - uses: actions/cache@v4
         with:
           key: mkdocs-material-${{ env.cache_id }}
           path: .cache
           restore-keys: |
             mkdocs-material-
-      - run: pip install mkdocs-material
-      - run: mkdocs gh-deploy --force
+      - run: pip3 install mkdocs-material
+        run: pip3 install mike
+      - run: mike deploy --push --update-aliases v13 latest

README.md

@@ -66,11 +66,26 @@ npm install
 3. Install required mkdocs packages using pip3.
 ```
 pip3 install -r requirements.txt
+pip3 install mike
 ```
 
-4. Run below command to start mkdocs server.
-```
-mkdocs serve
+4. Run below commands to use `mike` to deploy multiple versions of docs.
+```sh
+# Initially delete everything from gh-pages branch to start creating version folders.
+mike delete --all 
+
+# If above command throws an error please run below mkdocs command and then run mike deploy
+mkdocs gh-deploy --force
+
+# This command will create a folder named as v13 in gh-pages branch.
+mike deploy --push --update-aliases v13 latest
+mike set-default v13
+
+# This command will create a folder named as v12.x in gh-pages branch.
+mike deploy --push --update-aliases v12.x
+
+# Test changes in local.
+mike serve
 ```
 
 5. When complete, open the browser: http://127.0.0.1:8000/

docs/mkdocs.yml

@@ -33,6 +33,8 @@ theme:
       - navigation.footer
 
 extra:
+  version:
+    provider: mike
   social:
     - icon: fontawesome/brands/github
       link: http://github.com/elyra-ai/canvas

docs/pages/css/styles.css

@@ -22,3 +22,12 @@ th {
   max-width: 71rem;
 }
 
+.md-version__list {
+  background-color: black;
+}
+
+.md-version__link {
+  background-color: black;
+  color: white;
+  transition: color 0.3s ease;
+}