From fba2210bbd461e14b18dccfa85626bcf0d70cedd Mon Sep 17 00:00:00 2001
From: Marcus <marcus@deltalima.org>
Date: Sun, 27 Oct 2024 00:42:35 +0200
Subject: [PATCH] playground - i think using form and submit button for actions
 edit and delte looks good

---
 playground/html/root/cangrow.css | 14 ++++---
 playground/html/root/index.html  | 68 ++++++++++++++++++++++++++++----
 2 files changed, 69 insertions(+), 13 deletions(-)

diff --git a/playground/html/root/cangrow.css b/playground/html/root/cangrow.css
index cdde02c..96b4bf3 100644
--- a/playground/html/root/cangrow.css
+++ b/playground/html/root/cangrow.css
@@ -119,7 +119,8 @@ a:active {
   border-top-left-radius: 3px;
   border-bottom-left-radius: 3px;
 }
-.nav li a, .nav span, .subnav li a, .subnav span,  .button, .button:link, input[type=button], input[type=submit], input[type=reset] {
+.nav li a, .nav span, .subnav li a, .subnav span,  .button, .button:link, input[type=button], input[type=submit], 
+input[type=reset], .linkForm input[type=submit] {
   color: #ddd;
   display: block;
   font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
@@ -133,7 +134,8 @@ a:active {
   padding: 5px 10px;
 }
 
-.nav li a:hover, .subnav li a:hover, .activeNav, .button:link:hover, .button:visited:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover  {
+.nav li a:hover, .subnav li a:hover, .activeNav, .button:link:hover, .button:visited:hover, input[type=button]:hover, 
+input[type=submit]:hover, input[type=reset]:hover, .linkForm input[type=submit]:hover  {
   background: #04AA6D;
   color: #fff;
   border-radius: 3px;
@@ -152,7 +154,8 @@ a:active {
   background: #292929;
 }
 
-.button, .button:link, .button:visited, input[type=button], input[type=submit], input[type=reset] {
+.button, .button:link, .button:visited, input[type=button], input[type=submit],input[type=reset],
+.linkForm input[type=submit] {
   background: #026b45;
   color: #fff;
   border-radius: 3px;
@@ -163,7 +166,8 @@ a:active {
   border: none;
 }
 
-.button:link:active, .button:visited:active, input[type=button]:active, input[type=submit]:active, input[type=reset]:active {
+.button:link:active, .button:visited:active, input[type=button]:active, input[type=submit]:active,
+input[type=reset]:active, .linkForm input[type=submit]:active {
   background: #026b45;
   color: #cae0d0;
 }
@@ -191,4 +195,4 @@ input[type=text], input[type=date], input[type=number], input[type=password], se
 
 /*@media only screen and (min-width: 640px) {
   
-}*/
\ No newline at end of file
+}*/
diff --git a/playground/html/root/index.html b/playground/html/root/index.html
index 7c81e83..9198747 100644
--- a/playground/html/root/index.html
+++ b/playground/html/root/index.html
@@ -64,34 +64,86 @@
 <td>GPIO</td>
 <td>Light</td>
 <td>1</td>
-<td><form method='post' action='index.html'><input type='hidden' name='del' value='0'><input type='submit' value='&#x270F;&#xFE0F;'></form>
-<form method='post' action='index.html'><input type='hidden' name='del' value='0'><input type='submit' value='&#x274C;'></form></td></tr><tr><td>2</td>
+<td>
+  <form class='linkForm' action='add?edit=0'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x270F;&#xFE0F;'>
+  </form>
+  <form class='linkForm' method='post' action='index.html'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x274C;'  onclick="return confirmDelete('Tasmota LED1')">
+  </form>
+</td></tr><tr><td>2</td>
 <td>LED1 Dimmer</td>
 <td>I2C</td>
 <td>Light</td>
 <td>1</td>
-<td><form method='post' action='index.html'><input type='hidden' name='del' value='0'><input type='submit' value='&#x270F;&#xFE0F;'></form>
-<form method='post' action='index.html'><input type='hidden' name='del' value='0'><input type='submit' value='&#x274C;'></form></td></tr><tr><td>3</td>
+<td>
+  <form class='linkForm' action='add?edit=0'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x270F;&#xFE0F;'>
+  </form>
+  <form class='linkForm' method='post' action='index.html'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x274C;'  onclick="return confirmDelete('Tasmota LED1')">
+  </form>
+</td></tr><tr><td>3</td>
 <td>Fan exhaust</td>
 <td>GPIO</td>
 <td>Fan</td>
 <td>1</td>
-<td><a href='#3'>&#x270F;&#xFE0F;</a> <a href='#3'>&#x274C;</a></td></tr><tr><td>4</td>
+<td>
+  <form class='linkForm' action='add?edit=0'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x270F;&#xFE0F;'>
+  </form>
+  <form class='linkForm' method='post' action='index.html'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x274C;'  onclick="return confirmDelete('Tasmota LED1')">
+  </form>
+</td></tr><tr><td>4</td>
 <td>Fan inside</td>
 <td>GPIO</td>
 <td>Fan</td>
 <td>1</td>
-<td><a href='#4'>&#x270F;&#xFE0F;</a> <a href='#4'>&#x274C;</a></td></tr><tr><td>5</td>
+<td>
+  <form class='linkForm' action='add?edit=0'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x270F;&#xFE0F;'>
+  </form>
+  <form class='linkForm' method='post' action='index.html'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x274C;'  onclick="return confirmDelete('Tasmota LED1')">
+  </form>
+</td></tr><tr><td>5</td>
 <td>Tasmota Dehum</td>
 <td>Webcall</td>
 <td>Dehumidifier</td>
 <td>1</td>
-<td><a href='#5'>&#x270F;&#xFE0F;</a> <a href='#5'>&#x274C;</a></td></tr><tr><td>6</td>
+<td>
+  <form class='linkForm' action='add?edit=0'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x270F;&#xFE0F;'>
+  </form>
+  <form class='linkForm' method='post' action='index.html'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x274C;'  onclick="return confirmDelete('Tasmota LED1')">
+  </form>
+</td></tr><tr><td>6</td>
 <td>Test</td>
 <td>GPIO</td>
 <td>Humidifier</td>
 <td>0</td>
-<td><a href='#6'>&#x270F;&#xFE0F;</a> <a href='#6'>&#x274C;</a></td></tr>
+<td>
+  <form class='linkForm' action='add?edit=0'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x270F;&#xFE0F;'>
+  </form>
+  <form class='linkForm' method='post' action='index.html'>
+    <input type='hidden' name='del' value='0'>
+    <input class='linkForm' type='submit' value='&#x274C;'  onclick="return confirmDelete('Tasmota LED1')">
+  </form>
+</td></tr>
 </table>
 <div class='footer'><span>Build: 40d0175-esp8266-20241026222209</span></div>
 </div></body></html>