⚡ Better tooltip color, Added scroll to History section

assets/css/styles.scss

@@ -69,7 +69,7 @@ h3 {
   z-index: 10000;
 
   .tooltip-inner {
-    background: black;
+    background: #353535;
     color: white;
     border-radius: 16px;
     padding: 5px 10px 4px;
@@ -81,7 +81,7 @@ h3 {
     border-style: solid;
     position: absolute;
     margin: 5px;
-    border-color: black;
+    border-color: #353535;
     z-index: 1;
   }
 
@@ -150,10 +150,10 @@ h3 {
 
     .popover-inner {
       background: $color;
-      color: black;
+      color: #353535;
       padding: 24px;
       border-radius: 5px;
-      box-shadow: 0 5px 30px rgba(black, .1);
+      box-shadow: 0 5px 30px rgba(#353535, .1);
     }
 
     .popover-arrow {

pages/index.vue

@@ -144,6 +144,10 @@
           <i class="material-icons">import_export</i>
           <span>Import cURL</span>
         </button>
+        <button class="icon" id="goto-history" @click="gotoHistory()">
+          <i class="material-icons">history</i>
+          <span>History</span>
+        </button>
         <button class="icon" @click="clearContent">
           <i class="material-icons">clear_all</i>
           <span>Clear all</span>
@@ -855,6 +859,11 @@
           }
         }
       },
+      gotoHistory() {
+        this.$refs.historyComponent.$el.scrollIntoView({
+          behavior: 'smooth'
+        });
+      },
       getQueryStringFromPath() {
         let queryString,
             pathParsed = url.parse(this.path);