From d3aa8e03a2507d58fcbd935e3a6f91cdd474b00b Mon Sep 17 00:00:00 2001
From: liyasthomas <liyascthomas@gmail.com>
Date: Sun, 17 Nov 2019 11:58:40 +0530
Subject: [PATCH] :zap: Moved sidebar to left

---
 assets/css/styles.scss                | 12 ++++++------
 components/collections/collection.vue |  1 +
 components/history.vue                | 28 ++++++++++++---------------
 3 files changed, 19 insertions(+), 22 deletions(-)

diff --git a/assets/css/styles.scss b/assets/css/styles.scss
index 9a39c3f8c..cca0b33ea 100644
--- a/assets/css/styles.scss
+++ b/assets/css/styles.scss
@@ -1,4 +1,4 @@
-$responsiveWidth: 720px;
+$responsiveWidth: 768px;
 
 html {
   scroll-behavior: smooth;
@@ -751,15 +751,14 @@ input[type="radio"]:checked + label + .tab {
 
 .inner-left {
   display: flex;
-  order: 1;
-  margin-right: 16px;
+  order: 2;
+  margin-left: 16px;
 }
 
 .inner-right {
   display: flex;
   width: 25%;
-  order: 2;
-  height: calc(100vh - 80px);
+  order: 1;
 }
 
 @media (max-width: $responsiveWidth) {
@@ -813,6 +812,7 @@ input[type="radio"]:checked + label + .tab {
   }
 
   .inner-left {
-    margin-right: 0;
+    order: 0;
+    margin-left: 0;
   }
 }
diff --git a/components/collections/collection.vue b/components/collections/collection.vue
index bd29b59b7..0a7efe21c 100644
--- a/components/collections/collection.vue
+++ b/components/collections/collection.vue
@@ -19,6 +19,7 @@
               class="icon"
               @click="$emit('add-folder')"
               v-tooltip="'New Folder'"
+              v-close-popover
             >
               <i class="material-icons">create_new_folder</i>
               <span>New folder</span>
diff --git a/components/history.vue b/components/history.vue
index 8f7cdfd79..39b07ae9b 100644
--- a/components/history.vue
+++ b/components/history.vue
@@ -73,17 +73,15 @@
     >
       <ul v-for="(entry, index) in filteredHistory" :key="index" class="entry">
         <div class="show-on-large-screen">
-          <li>
-            <button
-              class="icon"
-              :class="{ stared: entry.star }"
-              @click="toggleStar(index)"
-              v-tooltip="{ content: !entry.star ? 'Add star' : 'Remove star' }"
-            >
-              <i class="material-icons" v-if="entry.star">star</i>
-              <i class="material-icons" v-else>star_border</i>
-            </button>
-          </li>
+          <button
+            class="icon"
+            :class="{ stared: entry.star }"
+            @click="toggleStar(index)"
+            v-tooltip="{ content: !entry.star ? 'Add star' : 'Remove star' }"
+          >
+            <i class="material-icons" v-if="entry.star">star</i>
+            <i class="material-icons" v-else>star_border</i>
+          </button>
           <li>
             <input
               aria-label="Label"
@@ -109,11 +107,9 @@
           </li>
 -->
           <v-popover>
-            <li>
-              <button class="tooltip-target icon" v-tooltip="'More'">
-                <i class="material-icons">more_vert</i>
-              </button>
-            </li>
+            <button class="tooltip-target icon" v-tooltip="'More'">
+              <i class="material-icons">more_vert</i>
+            </button>
             <template slot="popover">
               <div>
                 <button