From 6e4a008c5c17a39500a56571aaa44c897123dbc4 Mon Sep 17 00:00:00 2001
From: Peter Stockings <pstockings@jadeworld.com>
Date: Mon, 31 Jul 2023 22:02:26 +1000
Subject: [PATCH] Improve look of add topset/delete workout buttons on mobile

---
 templates/partials/workout_modal.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/templates/partials/workout_modal.html b/templates/partials/workout_modal.html
index 6c32c48..694bf1a 100644
--- a/templates/partials/workout_modal.html
+++ b/templates/partials/workout_modal.html
@@ -137,9 +137,9 @@
                                 id="grid-zip" type="number" name="weight" step="any">
                         </div>
                     </div>
-                    <div class="flex justify-between">
+                    <div class="grid grid-cols-1 sm:grid-cols-2 gap-4 pt-2 px-0 sm:px-2">
                         <button
-                            class="sm:inline-flex text-white bg-cyan-600 hover:bg-cyan-700 focus:ring-4 focus:ring-cyan-200 font-medium rounded-lg text-sm px-5 py-2.5 text-center items-center"
+                            class="py-2 px-3 mb-3 text-sm font-medium text-center text-gray-900 bg-cyan-600 hover:bg-cyan-700 rounded-lg border border-gray-300 hover:scale-[1.02] transition-transform"
                             type="submit">
                             Add top set
                         </button>
@@ -147,7 +147,7 @@
                         <button hx-confirm="Are you sure you wish to delete this workout?"
                             hx-delete="{{ url_for('delete_workout', person_id=workout['PersonId'], workout_id=workout['WorkoutId']) }}"
                             _='on click trigger closeModal'
-                            class="sm:inline-flex text-white bg-red-200 hover:bg-red-700 focus:ring-4 focus:ring-red-200 font-medium rounded-lg text-sm px-5 py-2.5 text-center items-center  cursor-pointer">Delete
+                            class="py-2 px-3 mb-3 text-sm font-medium text-center text-gray-900 bg-white rounded-lg border border-gray-300 hover:bg-gray-100 hover:scale-[1.02] transition-transform">Delete
                             workout</button>
                     </div>
                 </form>