From f4b84d55e2485bd875796b302bd281e1f4c93e3e Mon Sep 17 00:00:00 2001
From: Philipp Oppermann <dev@phil-opp.com>
Date: Sun, 17 Jul 2016 16:22:31 +0200
Subject: [PATCH] Fixate the ToC on the left side and show only on wide screens

---
 static/css/main.css | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/static/css/main.css b/static/css/main.css
index be51f807..4f6966dc 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -114,3 +114,43 @@ sup, sub {
 a.anchorjs-link:hover {
     text-decoration: none;
 }
+
+aside#toc {
+  display: none;
+}
+
+@media (min-width: 80rem) {
+  aside#toc {
+    display: block;
+    width: 15em;
+    position: fixed;
+    left:1rem;
+    top: 4rem;
+    font-size: 90%;
+    line-height: 1.1;
+  }
+
+  aside#toc:before {
+    content: "Table of Contents";
+    font-weight: bold;
+  }
+
+  aside#toc ol {
+    margin: 0 0 .2rem 0;
+    padding: 0 0 0 1rem;
+    list-style:none;
+  }
+
+  aside#toc ol li:before {
+    content: "";
+    border-color: transparent #008eef;
+    border-style: solid;
+    border-width: 0.35em 0 0.35em 0.45em;
+    display: block;
+    height: 0;
+    width: 0;
+    left: -1em;
+    top: 0.9em;
+    position: relative;
+  }
+}