Adds new styling to ToC -- inspired by docusaurus (pytorch#38)

ericnakagawa · JoelMarcey · commit 3aec320b6a6e · 2018-09-13T18:38:52.000-07:00
diff --git a/_get_started/get-started-locally.md b/_get_started/get-started-locally.md
@@ -18,26 +18,26 @@ published: true
 ---
 
 {% capture mac %}
-<div class="inline_toc" markdown="1">
+<nav class="inline_toc" markdown="1">
 * TOC
 {:toc}
-</div>
+</nav>
 {% include_relative installation/mac.md %}
 {% endcapture %}
 
 {% capture linux %}
-<div class="inline_toc" markdown="1">
+<nav class="inline_toc" markdown="1">
 * TOC
 {:toc}
-</div>
+</nav>
 {% include_relative installation/linux.md %}
 {% endcapture %}
 
 {% capture windows %}
-<div class="inline_toc" markdown="1">
+<nav class="inline_toc" markdown="1">
 * TOC
 {:toc}
-</div>
+</nav>
 {% include_relative installation/windows.md %}
 {% endcapture %}
 
diff --git a/_get_started/get-started-via-cloud-partners.md b/_get_started/get-started-via-cloud-partners.md
@@ -17,26 +17,26 @@ published: true
 ---
 
 {% capture aws %}
-<div class="inline_toc" markdown="1">
+<nav class="inline_toc" markdown="1">
 * TOC
 {:toc}
-</div>
+</nav>
 {% include_relative installation/aws.md %}
 {% endcapture %}
 
 {% capture azure %}
-<div class="inline_toc" markdown="1">
+<nav class="inline_toc" markdown="1">
 * TOC
 {:toc}
-</div>
+</nav>
 {% include_relative installation/azure.md %}
 {% endcapture %}
 
 {% capture google-cloud %}
-<div class="inline_toc" markdown="1">
+<nav class="inline_toc" markdown="1">
 * TOC
 {:toc}
-</div>
+</nav>
 {% include_relative installation/google-cloud.md %}
 {% endcapture %}
 
diff --git a/_sass/article.scss b/_sass/article.scss
@@ -123,23 +123,42 @@ article.pytorch-article {
     border-left: 2px solid #000000;
   }
 
-  .inline-toc {
+  h3.no_toc {
+    margin: 0px;
+  }
+
+  nav {
     float: right;
+    display: block;
+    overflow-y: auto;
+    background-color: white;
+    margin-left: 20px;
+    border-left: 1px #717171;
+  }
+
+  nav li {
+    font-size: 12px;
+    line-height: 20px;
+    padding-top: 0px;
+    list-style: none;
+  }
+
+  nav a {
+    color: #717171;
+    font-weight: bold;
   }
 
   ul#markdown-toc {
     padding-left: 1em;
     margin: 0px;
-    line-height: 18px;
   }
 
   ul#markdown-toc ul {
-    margin: 10px;
+    margin: 0px;
     padding-left: 1em;
   }
 
   ul#markdown-toc li {
-    margin: 10px;
-    line-height: 16px;
+    margin: 0px;
   }
 }
