feat(14): easy htmx automatic timed request

14-rock-paper-scissors/src/input.css

@@ -2,6 +2,6 @@
 @tailwind components;
 @tailwind utilities;
 
-div, section, span, p {
+/* div, section, span, p { */
-    outline: 1px solid red;
+/*     outline: 1px solid red; */
-}
+/* } */

14-rock-paper-scissors/src/main/resources/public/output.css

@@ -579,14 +579,6 @@ video {
   margin-top: 1.5rem;
 }
 
-.mt-\[4\.5rem\] {
-  margin-top: 4.5rem;
-}
-
-.mt-\[0\.5rem\] {
-  margin-top: 0.5rem;
-}
-
 .mt-\[1rem\] {
   margin-top: 1rem;
 }
@@ -603,8 +595,8 @@ video {
   display: grid;
 }
 
-.hidden {
+.h-0 {
-  display: none;
+  height: 0px;
 }
 
 .h-10 {
@@ -639,16 +631,16 @@ video {
   height: var(--diameter);
 }
 
-.h-screen {
-  height: 100vh;
-}
-
 .h-full {
   height: 100%;
 }
 
-.h-0 {
+.h-screen {
-  height: 0px;
+  height: 100vh;
+}
+
+.w-0 {
+  width: 0px;
 }
 
 .w-1\/3 {
@@ -687,16 +679,12 @@ video {
   width: var(--diameter);
 }
 
-.w-screen {
-  width: 100vw;
-}
-
 .w-full {
   width: 100%;
 }
 
-.w-0 {
+.w-screen {
-  width: 0px;
+  width: 100vw;
 }
 
 .grow {
@@ -936,6 +924,8 @@ video {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
-div, section, span, p {
+/* div, section, span, p { */
-  outline: 1px solid red;
+
-}
+/*     outline: 1px solid red; */
+
+/* } */

14-rock-paper-scissors/src/main/resources/templates/showdown.html

@@ -117,6 +117,7 @@
                 th:hx-get="'/house-choice/' + ${showdownState.playersChoice.c.name}"
                 hx-get="/house-choice/paper"
                 hx-target="#showdown-table"
+                hx-trigger="load delay:3s"
                 hx-swap="outerHTML"
               >
                 <div