From 12f4b297b3250745ea55982cbf13c22fb277f510 Mon Sep 17 00:00:00 2001
From: smcgrath0 <smcgrath7777@gmail.com>
Date: Tue, 1 Sep 2020 10:07:21 -0700
Subject: [PATCH] #156 added hover style to action buttons

---
 fragments/datalist/template.html               |  2 +-
 fragments/datalist/template.vue                |  2 +-
 .../components/datalist/template.vue           | 18 ++++++++++++++++--
 .../themecleanflex/pages/css/palette.css       |  3 +++
 4 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/fragments/datalist/template.html b/fragments/datalist/template.html
index 7fb2efba4..d48863cfa 100644
--- a/fragments/datalist/template.html
+++ b/fragments/datalist/template.html
@@ -2,7 +2,7 @@
     <div class="selected w-full flex justify-between p-3">
         <div class="selected-text">0 Selected</div>
         <div class="selected-actions">
-            <svg class="w-24 cursor-pointer" focusable="false" viewBox="0 0 24 24" aria-hidden="true">
+            <svg class="w-24 cursor-pointer action-btn" focusable="false" viewBox="0 0 24 24" aria-hidden="true">
                 <path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"></path>
             </svg>
         </div>
diff --git a/fragments/datalist/template.vue b/fragments/datalist/template.vue
index ef6c82bc3..bb769d25d 100644
--- a/fragments/datalist/template.vue
+++ b/fragments/datalist/template.vue
@@ -8,7 +8,7 @@
         <div class="selected-text">{{`${active.filter(element =&gt; element === true).length} selected`}}</div>
         <div
         class="selected-actions">
-          <svg class="w-24 cursor-pointer" focusable="false" viewBox="0 0 24 24"
+          <svg class="w-24 cursor-pointer action-btn" focusable="false" viewBox="0 0 24 24"
           aria-hidden="true" v-on:click="deleteAction">
             <path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
             />
diff --git a/ui.apps/src/main/content/jcr_root/apps/themecleanflex/components/datalist/template.vue b/ui.apps/src/main/content/jcr_root/apps/themecleanflex/components/datalist/template.vue
index 123ab687d..bb769d25d 100644
--- a/ui.apps/src/main/content/jcr_root/apps/themecleanflex/components/datalist/template.vue
+++ b/ui.apps/src/main/content/jcr_root/apps/themecleanflex/components/datalist/template.vue
@@ -8,7 +8,7 @@
         <div class="selected-text">{{`${active.filter(element =&gt; element === true).length} selected`}}</div>
         <div
         class="selected-actions">
-          <svg class="w-24 cursor-pointer" focusable="false" viewBox="0 0 24 24"
+          <svg class="w-24 cursor-pointer action-btn" focusable="false" viewBox="0 0 24 24"
           aria-hidden="true" v-on:click="deleteAction">
             <path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"
             />
@@ -197,7 +197,21 @@
             }
           },
           deleteAction: function() {
-            
+            if(this.model.endpointurl && this.model.endpointurl !== '') {
+              // load data from URL
+              axios.post(this.model.endpointurl, {
+                firstName: 'Fred',
+                lastName: 'Flinstone'
+              })
+              .then( (response) => {
+                  console.log(response)
+                  // Vue.set(this, 'storageData', response.data)
+                  // Vue.set(this, 'active', new Array(response.data.length).fill(false))
+              })
+              .catch( (error) => {
+                  console.log(error)
+              })
+            }
           }
         }
     }
diff --git a/ui.apps/src/main/content/jcr_root/content/themecleanflex/pages/css/palette.css b/ui.apps/src/main/content/jcr_root/content/themecleanflex/pages/css/palette.css
index 1668607cf..f1a37a303 100644
--- a/ui.apps/src/main/content/jcr_root/content/themecleanflex/pages/css/palette.css
+++ b/ui.apps/src/main/content/jcr_root/content/themecleanflex/pages/css/palette.css
@@ -249,4 +249,7 @@
 #peregrine-app [class$="-components-datalist"].theme-dark table.striped tbody tr:nth-of-type(2n) td:not(.mobile-header) *{
   color: var(--text-secondary-color);
   fill: var(--text-secondary-color);
+}
+#peregrine-app [class$="-components-datalist"] .action-btn:hover {
+  fill: var(--text-secondary-color);
 }
\ No newline at end of file