From be47be8f410de1f5926e45b1085e23c9b951f0cc Mon Sep 17 00:00:00 2001
From: Zachary Klosko <kloskoz@vcu.edu>
Date: Sun, 21 Jun 2020 11:32:11 -0400
Subject: [PATCH] Added responsive sidebar

---
 docs/_layouts/default.html    | 24 ++++++++++++++++++++----
 docs/backing-up-the-server.md |  1 +
 docs/css/creative.min.css     |  6 ++++++
 docs/live-broadcast.md        |  2 +-
 4 files changed, 28 insertions(+), 5 deletions(-)

diff --git a/docs/_layouts/default.html b/docs/_layouts/default.html
index 3d3f868f3..36d5f906f 100644
--- a/docs/_layouts/default.html
+++ b/docs/_layouts/default.html
@@ -23,27 +23,43 @@
     
     <div class="container">
       <div class="row bg-dark text-white">
-        <div class="col-9">
+        <div class="col">
           <br>
           <a href="guides"><svg class="bi bi-arrow-left-circle-fill" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
             <path fill-rule="evenodd" d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-7.646 2.646a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L6.207 7.5H11a.5.5 0 0 1 0 1H6.207l2.147 2.146z"/>
-          </svg> Back to Docs
+          </svg> Back
           </a>
           <br>
           <p></p>
         </div>
-        <div class="col">
+        <div class="col white-text center text-footer">
+          <h5 class="allcaps">{{ page.title }}</h5>
+        </div>
+        <div class="col white-text center text-footer">
+          {% if page.git %}
+          <a href="https://github.com/LibreTime/libretime/edit/master/docs/{{page.git}}" target="_blank">
+            <i class="far fa-edit"></i> Edit on Github
+          </a>
+          {% endif %}
         </div>
       </div>
     </div>
     <div class="container">
       <div class="row no-gutters">
         <div class="col-9">
+          <div class="d-block d-sm-none d-sm-block d-md-block d-lg-none">
+            <hr class="my-4">
+            <div class="text-footer">
+              <h5 class="allcaps">Contents</h5>
+            </div>
+            <div class="toc" >{% include toc.html html=content class=toc %}</div>
+            <hr class="my-4">
+          </div>
           <nav class="content">
             {{ content }}
           </nav>
         </div>
-        <div class="col">
+        <div class="col d-none d-sm-none d-md-none d-lg-block">
           <hr class="my-4">
           <div class="text-footer">
             <h5 class="allcaps">Contents</h5>
diff --git a/docs/backing-up-the-server.md b/docs/backing-up-the-server.md
index a2c268283..9b3b7fb45 100644
--- a/docs/backing-up-the-server.md
+++ b/docs/backing-up-the-server.md
@@ -1,6 +1,7 @@
 ---
 layout: default
 title: Backing Up The Server
+git: backing-up-the-server.md
 ---
 
 ## Database Backup
diff --git a/docs/css/creative.min.css b/docs/css/creative.min.css
index f42e69115..376e90bb0 100755
--- a/docs/css/creative.min.css
+++ b/docs/css/creative.min.css
@@ -327,4 +327,10 @@ padding: 10px 20px;
 /* Page Title */
 .allcaps {
   text-transform: uppercase
+}
+
+ .center {
+  margin: auto;
+  width: 50%;
+  padding: 10px;
 }
\ No newline at end of file
diff --git a/docs/live-broadcast.md b/docs/live-broadcast.md
index a936fe24a..eb69bbf5d 100644
--- a/docs/live-broadcast.md
+++ b/docs/live-broadcast.md
@@ -1,7 +1,7 @@
 ---
 layout: default
 title: Broadcasting live with MIXXX or B.U.T.T.
-
+git: live-broadcast.md
 ---
 
 ## Live shows with MIXXX {#mixxx}