Listview and User Fields

src/components/admin/property/userDefinedField.vue

 <template>
-  <div>
+  <main id="main">
     <div class="container">
       <br />
       <div class="row">
           </form>
         </div>
       </div>
+      <div class="row">
+        <div align="center" class="col">
+          <button type="button" @click="SubmitData()" class="btn-solid-blue mb-5">
+            Save
+          </button>
+        </div>
+      </div>
     </div>
-    <button
-      type="button"
-      @click="SubmitData()"
-      class="btn btn-b-n"
-      style="width: 85px; height:40px;"
-    >
-      Save
-    </button>
-  </div>
+  </main>
 </template>
 
 <script>
 export default {
-  name: 'UserField',
+  name: "UserField",
   props: {
-    field: {},
+    field: {}
   },
   data() {
     return {
-      userField: {},
+      userField: {}
     };
   },
   mounted() {
   },
   methods: {
     SubmitData() {
-      this.$emit('UpdateUserField', this.userField);
-    },
-  },
+      this.$emit("UpdateUserField", this.userField);
+    }
+  }
 };
 </script>

src/components/admin/property/userDefinedGroupPage.vue

           @onNew="newItem"
         />
       </div>
-      <button
-        type="button"
-        @click="SubmitData()"
-        class="btn btn-b-n"
-        style="width: 85px; height:40px;"
-      >
+      <button type="button" @click="SubmitData()" class="btn-solid-blue mb-5">
         Save
       </button>
-      <button type="button" @click="Close()" class="btn btn-b-n" style="width: 85px; height:40px;">
+      <button type="button" @click="Close()" class="btn-solid-blue">
         Close
       </button>
     </div>

src/components/property/residential/singleView/contentSection.vue

               </div>
             </div>
 
-            <div class="btn-white-border">
-              <i class="fa fa-search"></i>BOOK A VIEWING
-            </div>
+            <div class="btn-white-border"><i class="fa fa-search"></i>BOOK A VIEWING</div>
           </div>
           <div class="panel-left px-5 pb-5 text-center">
             <h4 class="text-white">Share this Property</h4>
         <div></div>
         <div class="col-md-8 p-5 resort-profile">
           <h2 v-if="property.showAddress">
-            <div
-              style="display:inline"
-              v-if="property.propertyName !== null"
-            >{{ property.propertyName }} /</div>
+            <div style="display:inline" v-if="property.propertyName !== null">
+              {{ property.propertyName }} /
+            </div>
             {{ property.streetNumber }} {{ property.streetName }}
           </h2>
           <h2 v-else>{{ property.propertyName }}</h2>
               style="float:right"
               class="btn-solid-blue mt-3"
               :to="{ name: 'EnquireNow', params: { id: $route.params.id } }"
-            >MORE INFO...</router-link>
+              >MORE INFO...</router-link
+            >
             <h4>Property Features</h4>
-
+            {{ propertyFeatures }}
             <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
               <div v-for="(field, j) in data.values" :key="j" class="col-md-6">
                 <div v-if="field.value.toUpperCase() != 'TRUE'">
 export default {
   components: {
     gallery,
-    ShareFacebook,
+    ShareFacebook
   },
   props: {
     property: {},
-    propertyImages: {},
+    propertyImages: {}
   },
   created() {
     //this.getListsForPropertyEdit(this.property.id);
     return {
       index: null,
       date: new Date(),
-      currentUrl: "",
+      currentUrl: ""
     };
   },
   methods: {
       }
       return "";
     },
+    propertyFeatures() {
+      this.property.displayData.forEach(data => {
+        console.log(data);
+      });
+    },
     Images() {
       const list = [];
       for (let i = 0; i < this.propertyImages.length; i++) {
         list.push(this.propertyImages[i].image);
       }
       return list;
-    },
+    }
   },
   created() {
     this.$emit("Loaded", true);
-  },
+  }
 };
 </script>
 

src/components/shared/listView.vue

               </button>
             </td>
             <td v-if="editable" class="my-width">
-              <button type="button" class="btn my-btn" @click="onEdit(item)">Edit</button>
+              <a @click="onEdit(item)" class="p-3">
+                <img src="../../../public/img/icons/Edit.png" height="25" width="25" />
+              </a>
+              <!-- <button type="button" class="btn my-btn" @click="onEdit(item)">Edit</button> -->
             </td>
             <td v-if="deleteable" class="my-width">
-              <button type="button" class="btn my-btn" @click="onDelete(item)">Delete</button>
+              <a @click="onDelete(item)" class="p-3">
+                <img src="../../../public/img/icons/delete.png" height="25" width="25" />
+              </a>
+              <!-- <button type="button" class="btn my-btn" @click="onDelete(item)">Delete</button> -->
             </td>
           </tr>
         </tbody>