From 3208cec882213eaad25bdd2ce5b3f69ee9981c24 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyascthomas@gmail.com>
Date: Tue, 22 Oct 2019 21:27:48 +0530
Subject: [PATCH] :art: Minor UI update on collections

---
 components/collections/addCollection.vue    |  2 +-
 components/collections/addFolder.vue        | 16 +++++++++++++---
 components/collections/collection.vue       |  8 ++------
 components/collections/exportCollection.vue |  6 +++---
 components/collections/folder.vue           |  8 ++------
 components/collections/saveRequest.vue      | 20 +++++++++++++++-----
 6 files changed, 36 insertions(+), 24 deletions(-)

diff --git a/components/collections/addCollection.vue b/components/collections/addCollection.vue
index e17b894f..311ce57e 100644
--- a/components/collections/addCollection.vue
+++ b/components/collections/addCollection.vue
@@ -19,7 +19,7 @@
             <div slot="body">
             <ul>
                 <li>
-                    <input type="text" v-model="newCollection.name" placeholder="My New Collection" />
+                  <input type="text" v-model="newCollection.name" placeholder="My New Collection" />
                 </li>
             </ul>
             </div>
diff --git a/components/collections/addFolder.vue b/components/collections/addFolder.vue
index b318d0b4..4a147622 100644
--- a/components/collections/addFolder.vue
+++ b/components/collections/addFolder.vue
@@ -23,8 +23,18 @@
             </ul>
         </div>
         <div slot="footer">
-            <button @click="addNewFolder" v-if='!newFolder.hasOwnProperty("folderIndex")'>Add</button>
-            <button @click="saveFolder" v-if='newFolder.hasOwnProperty("folderIndex")'>Save</button>
+          <ul>
+            <li>
+            <button class="icon" @click="addNewFolder" v-if='!newFolder.hasOwnProperty("folderIndex")'>
+              <i class="material-icons">add</i>
+              <span>Create</span>
+            </button>
+            <button class="icon" @click="saveFolder" v-if='newFolder.hasOwnProperty("folderIndex")'>
+              <i class="material-icons">save</i>
+              <span>Save</span>
+            </button>
+            </li>
+          </ul>
         </div>
     </modal>
 </template>
@@ -76,4 +86,4 @@ export default {
         },
     },
 };
-</script>
\ No newline at end of file
+</script>
diff --git a/components/collections/collection.vue b/components/collections/collection.vue
index 14b18c90..717f6d72 100644
--- a/components/collections/collection.vue
+++ b/components/collections/collection.vue
@@ -11,13 +11,9 @@
 
         <div class="flex-wrap">
           <div>
-            <button class="icon" @click="toggleShowChildren" v-show='!showChildren'>
-              <i class="material-icons">arrow_right</i>
-            </button>
-            <button class="icon" @click="toggleShowChildren" v-show='showChildren'>
-              <i class="material-icons">arrow_drop_down</i>
-            </button>
             <button class="icon" @click="toggleShowChildren">
+              <i class="material-icons" v-show='!showChildren'>arrow_right</i>
+              <i class="material-icons" v-show='showChildren'>arrow_drop_down</i>
               <i class="material-icons">folder</i>
               <span>{{collection.name}}</span>
             </button>
diff --git a/components/collections/exportCollection.vue b/components/collections/exportCollection.vue
index a24fc0db..4b58921f 100644
--- a/components/collections/exportCollection.vue
+++ b/components/collections/exportCollection.vue
@@ -16,8 +16,8 @@
             </ul>
             </div>
             <div slot="body">
-                <textarea v-model='collectionJson'>
-                </textarea>
+              <textarea v-model='collectionJson' rows="8">
+              </textarea>
             </div>
             <div slot="footer">
             </div>
@@ -46,4 +46,4 @@ export default {
         },
     },
 };
-</script>
\ No newline at end of file
+</script>
diff --git a/components/collections/folder.vue b/components/collections/folder.vue
index be03a670..f396c400 100644
--- a/components/collections/folder.vue
+++ b/components/collections/folder.vue
@@ -2,13 +2,9 @@
     <div>
         <div class="flex-wrap">
           <div>
-            <button class="icon" @click="toggleShowChildren" v-show='!showChildren'>
-              <i class="material-icons">arrow_right</i>
-            </button>
-            <button class="icon" @click="toggleShowChildren" v-show='showChildren'>
-              <i class="material-icons">arrow_drop_down</i>
-            </button>
             <button class="icon" @click="toggleShowChildren">
+              <i class="material-icons" v-show='!showChildren'>arrow_right</i>
+              <i class="material-icons" v-show='showChildren'>arrow_drop_down</i>
               <i class="material-icons">folder_open</i>
               <span>{{folder.name}}</span>
             </button>
diff --git a/components/collections/saveRequest.vue b/components/collections/saveRequest.vue
index 7f5d3103..d44522ed 100644
--- a/components/collections/saveRequest.vue
+++ b/components/collections/saveRequest.vue
@@ -21,7 +21,7 @@
                     <li>
                         <input type="text" v-model="request.name" placeholder="My New Request" />
                         <select type="text" v-model="request.collection" >
-                            <option 
+                            <option
                                 v-for="collection in collections"
                                 :key="collection.collectionIndex"
                                 :value="collection.collectionIndex">
@@ -29,7 +29,7 @@
                             </option>
                         </select>
                         <select type="text" v-model="request.folder" >
-                            <option 
+                            <option
                                 v-for="folder in folders"
                                 :key="folder.folderIndex"
                                 :value="folder.folderIndex">
@@ -40,8 +40,18 @@
                 </ul>
             </div>
             <div slot="footer">
-                <button @click="addRequest" v-if='!request.hasOwnProperty("requestIndex")'>Add</button>
-                <button @click="saveRequest" v-if='request.hasOwnProperty("requestIndex")'>Save</button>
+              <ul>
+                <li>
+                <button class="icon" @click="addRequest" v-if='!request.hasOwnProperty("requestIndex")'>
+                  <i class="material-icons">add</i>
+                  <span>Create</span>
+                </button>
+                <button class="icon" @click="saveRequest" v-if='request.hasOwnProperty("requestIndex")'>
+                  <i class="material-icons">save</i>
+                  <span>Save</span>
+                </button>
+                </li>
+              </ul>
             </div>
         </modal>
     </div>
@@ -145,4 +155,4 @@ export default {
         },
     },
 };
-</script>
\ No newline at end of file
+</script>