added reset button

static/css/main.css

@@ -8,6 +8,10 @@ body{
   height: 100vh;
 }
 
+a {
+  text-decoration: none;
+  color: black;
+}
 
 .main-column-left {
   padding: 1.7em 0em;
@@ -57,7 +61,7 @@ li span.nav-button {
 }
 
 li span.nav-button:hover {
-  color: #8048b7;
+  color: #ea4f2b;;
 }
 
 .nav-top {
@@ -66,6 +70,7 @@ li span.nav-button:hover {
   width: 100%;
   position: fixed;
   cursor: pointer;
+  z-index: 1;
 }
 
 .nav-bottom{
@@ -76,6 +81,7 @@ li span.nav-button:hover {
   position: fixed;
   z-index: 10000;
   cursor: pointer;
+  z-index: 1;
 }
 
 span.librarian-names, span.file-names {
@@ -97,6 +103,7 @@ span.librarian-names:hover, span.file-names:hover {
   padding: 0em;
   top: 25px;
   left: 0;
+  z-index: 1;
 }
 
 .file-names-container {
@@ -109,7 +116,7 @@ span.librarian-names:hover, span.file-names:hover {
   transform-origin: top left;
   /* border:blue 1px solid; */
   height: 50vw;
-  width: 35vw;
+  width: 40vw;
   overflow-y: scroll;
   overflow-x: hidden;
   position: absolute;
@@ -139,21 +146,40 @@ object.listed-pdf {
   color: blue !important;
 }
 
+button {
+    border-radius: 0;
+    border: 0;
+    padding: 0;
+    z-index: 2;
+}
+
+button:hover {
+  background: white !important;
+  cursor: pointer;
+}
 
 button#listoffiles {
   position: fixed;
-  left: 46%;
-  top: 48%;
+  left: 46.3%;
+  top: 46%;
   transform: rotate(90deg);
-  width: 6.3%;
-  z-index: 1;
+  width: 6.4%;
+  background: #8048b7;
 }
 
 button#about {
   position: fixed;
-  left: 47.65%;
-  top: 48%;
+  left: 47.25%;
+  top: 46%;
   width: 6.4%;
   transform: rotate(270deg);
-  z-index: 1;
+  background: #ea4f2b;
+}
+
+button#reset {
+  position: fixed;
+  left: 48.3%;
+  top: 33%;
+  border-radius: 100%;
+  padding: 1.5em 0.8em;
 }

templates/layout.html

@@ -264,6 +264,7 @@ $.ajax({
 <!-- submit data -->
       <button id="about">About</button>
       <button id="listoffiles">Print</button>
+      <button id="reset"><a href="/">Reset</a></button>
 
 
         <br>