[Website 2.0] General Version Dropdown (#17948)

* Added instructions for pulling & decompressing artifacts for static deployment * Added master dropdown to header HTML * Added CSS content to style master dropdown * Using full path for wget for Jenkins * Added install command for wget * Using sudo w/apt * Switching to git clone to satisfy Jenkins * Added step to archive artifacts * Reverting Jekyll Jenkinsfile * Switching to non-restricted nodes for dev Jenkins build * Final restricted change * Fixed styling for dropdown * Adding dropdown to Python docs header * Adding CSS for Python docs header version dropdown * Fixed text alignment for hamburger menu * Trying to get styling working for Python docs api dropdown * Trying to add css at _root * Trying to add styling to fonts, added inline styling * Trying style tags in layout * Changed font weight * Added missing semicolon in inline styling * Switched header to be consistent with older versions * Changed header in master * Switching hrefs to point to HTML files * Added 1.6 link to master * Dropping unnecessary changes * Revert _root.scss * Fixed routing bug * Reverting Jenkinsfile_website_full for PR * Switching from git clone to wget on S3 * Adding relevant build dependencies, fixing ruby version for Jekyll * Added caret for dropdown * Consolidating CSS into one file for general, one for Python API
apache · Apr 9, 2020 · 5ff2994 · 5ff2994
1 parent 664889a
commit 5ff2994
Show file tree

Hide file tree

Showing 6 changed files with 126 additions and 3 deletions.
diff --git a/ci/docker/Dockerfile.build.ubuntu_cpu_jekyll b/ci/docker/Dockerfile.build.ubuntu_cpu_jekyll
@@ -29,7 +29,9 @@ RUN apt-get update && apt-get install -y \
       git \
       zlib1g-dev \
       gnupg2 \
-      curl
+      curl \
+      wget \
+      unzip
 
 # Always last, except here to prevent conflicts with rvm
 ARG USER_ID=0
@@ -43,7 +45,7 @@ RUN curl -sSL https://rvm.io/mpapis.asc | gpg2 --import - && \
 
 RUN source /etc/profile.d/rvm.sh && \
     rvm requirements && \
-    rvm install 2.6 && \
+    rvm install 2.6.3 && \
     rvm use 2.6.3 --default
 
 ENV BUNDLE_HOME=/work/deps/bundle

diff --git a/docs/python_docs/themes/mx-theme/mxtheme/header_top.html b/docs/python_docs/themes/mx-theme/mxtheme/header_top.html
@@ -19,6 +19,23 @@
         <a class="page-link" href="{{theme_relative_url}}ecosystem">Ecosystem</a>
         <a class="page-link page-current" href="{{theme_relative_url}}api">Docs & Tutorials</a>
         <a class="page-link" href="https://github.com/apache/incubator-mxnet">GitHub</a>
+        <div class="dropdown">
+          <span class="dropdown-header">master
+            <svg class="dropdown-caret" viewBox="0 0 32 32" class="icon icon-caret-bottom" aria-hidden="true"><path class="dropdown-caret-path" d="M24 11.305l-7.997 11.39L8 11.305z"></path></svg>
+          </span>
+          <div class="dropdown-content">
+            <a class="dropdown-option-active" href="/">master</a><br>
+            <a class="dropdown-option" href="/versions/1.6/">1.6</a><br>
+            <a class="dropdown-option" href="/versions/1.5.0/">1.5.0</a><br>
+            <a class="dropdown-option" href="/versions/1.4.1/">1.4.1</a><br>
+            <a class="dropdown-option" href="/versions/1.3.1/">1.3.1</a><br>
+            <a class="dropdown-option" href="/versions/1.2.1/">1.2.1</a><br>
+            <a class="dropdown-option" href="/versions/1.1.0/">1.1.0</a><br>
+            <a class="dropdown-option" href="/versions/1.0.0/">1.0.0</a><br>
+            <a class="dropdown-option" href="/versions/0.12.1/">0.12.1</a><br>
+            <a class="dropdown-option" href="/versions/0.11.0/">0.11.0</a>
+          </div>
+        </div>
       </div>
     </nav>
   </div>

diff --git a/docs/python_docs/themes/mx-theme/mxtheme/layout.html b/docs/python_docs/themes/mx-theme/mxtheme/layout.html
@@ -7,6 +7,54 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <style>
+    .dropdown {
+        position: relative;
+        display: inline-block;
+    }
+
+    .dropdown-content {
+        display: none;
+        position: absolute;
+        background-color: #f9f9f9;
+        min-width: 160px;
+        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+        padding: 12px 16px;
+        z-index: 1;
+        text-align: left;
+    }
+
+    .dropdown:hover .dropdown-content {
+        display: block;
+    }
+
+    .dropdown-option:hover {
+        color: #FF4500;
+    }
+
+    .dropdown-option-active {
+        color: #FF4500;
+        font-weight: lighter;
+    }
+
+    .dropdown-option {
+        color: #000000;
+        font-weight: lighter;
+    }
+
+    .dropdown-header {
+        color: #FFFFFF;
+        display: inline-flex;
+    }
+
+    .dropdown-caret {
+        width: 18px;
+    }
+
+    .dropdown-caret-path {
+        fill: #FFFFFF;
+    }
+    </style>
     {{ super() }}
 {% endblock %}
 

diff --git a/docs/static_site/Makefile b/docs/static_site/Makefile
@@ -20,7 +20,7 @@ all: html
 html:
 	mkdir -p build
 	cd src && bundle install && JEKYLL_ENV=production bundle exec jekyll build --config _config_prod.yml -d ../build/html && cd ..
-
+	wget https://mxnet-static-artifacts.s3.amazonaws.com/versions.zip && unzip versions.zip -d build/html && rm -rf build/html/__MACOSX && rm versions.zip
 
 clean:
 	rm -rf build
diff --git a/docs/static_site/src/_includes/head.html b/docs/static_site/src/_includes/head.html
@@ -15,4 +15,43 @@
 
   <script src="{{'/assets/js/clipboard.js'|relative_url}}"></script>
   <script src="{{'/assets/js/copycode.js'|relative_url}}"></script>
+  <style>
+  .dropdown-option-active {
+      color: #FF4500 !important;
+      font-weight: lighter;
+  }
+
+  .dropdown {
+    position: relative;
+    display: inline-block;
+  }
+
+  .dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: #f9f9f9;
+    min-width: 160px;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+    padding: 12px 16px;
+    z-index: 1;
+    text-align: left;
+  }
+
+  .dropdown:hover .dropdown-content {
+    display: block;
+  }
+
+  .dropdown-header {
+      color: #FFFFFF;
+      display: inline-flex;
+  }
+
+  .dropdown-caret {
+      width: 18px;
+  }
+
+  .dropdown-caret-path {
+      fill: #FFFFFF;
+  }
+  </style>
 </head>
diff --git a/docs/static_site/src/_includes/header.html b/docs/static_site/src/_includes/header.html
@@ -43,6 +43,23 @@
         <a class="page-link" href="{{'/ecosystem' | relative_url }}">Ecosystem</a>
         <a class="page-link" href="{{'/api' | relative_url }}">Docs & Tutorials</a>
         <a class="page-link" href="https://github.com/apache/incubator-mxnet">GitHub</a>
+        <div class="dropdown">
+          <span class="dropdown-header">master
+            <svg class="dropdown-caret" viewBox="0 0 32 32" class="icon icon-caret-bottom" aria-hidden="true"><path class="dropdown-caret-path" d="M24 11.305l-7.997 11.39L8 11.305z"></path></svg>
+          </span>
+          <div class="dropdown-content">
+            <a class="dropdown-option-active" href="/">master</a>
+            <a href="/versions/1.6/">1.6</a>
+            <a href="/versions/1.5.0/">1.5.0</a>
+            <a href="/versions/1.4.1/">1.4.1</a>
+            <a href="/versions/1.3.1/">1.3.1</a>
+            <a href="/versions/1.2.1/">1.2.1</a>
+            <a href="/versions/1.1.0/">1.1.0</a>
+            <a href="/versions/1.0.0/">1.0.0</a>
+            <a href="/versions/0.12.1/">0.12.1</a>
+            <a href="/versions/0.11.0/">0.11.0</a>
+          </div>
+        </div>
       </div>
     </nav>
   </div>