From 2d40ac17207ad496719ab6ab17590cc3e46d4692 Mon Sep 17 00:00:00 2001
From: Peter Stockings <pstockings@jadeworld.com>
Date: Mon, 20 Mar 2023 22:44:47 +1100
Subject: [PATCH] Increase size of inputs on workout modal & list page

---
 templates/partials/page/person.html   |  8 ++++----
 templates/partials/workout_modal.html | 11 ++++++-----
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/templates/partials/page/person.html b/templates/partials/page/person.html
index 858ca5d..f1bee2c 100644
--- a/templates/partials/page/person.html
+++ b/templates/partials/page/person.html
@@ -34,8 +34,8 @@
                     <label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-city">
                         Exercises
                     </label>
-                    <select id="multiSelection" data-te-select-init data-te-select-filter="true" name="exercise_id"
-                        class="bg-gray-50 border border-gray-300 " multiple
+                    <select id="multiSelection" data-te-select-init data-te-select-filter="true"
+                        data-te-select-size="lg" name="exercise_id" class="bg-gray-50 border border-gray-300 " multiple
                         hx-get="{{ url_for('get_person', person_id=person['PersonId']) }}"
                         hx-include="[name='min_date'],[name='max_date']" hx-target="#container" hx-push-url="true">
                         {% for e in person['Exercises'] %}
@@ -64,7 +64,7 @@
                         </svg>
                     </div>
                     <input type="date"
-                        class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 py-2 px-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 w-full"
+                        class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 w-full"
                         name="min_date" value="{{ min_date }}"
                         hx-get="{{ url_for('get_person', person_id=person['PersonId']) }}"
                         hx-include="[name='exercise_id'],[name='min_date'],[name='max_date']" hx-target="#container"
@@ -85,7 +85,7 @@
                         </svg>
                     </div>
                     <input type="date"
-                        class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 py-2 px-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 w-full"
+                        class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 w-full"
                         name="max_date" value="{{ max_date }}"
                         hx-get="{{ url_for('get_person', person_id=person['PersonId']) }}"
                         hx-include="[name='exercise_id'],[name='min_date'],[name='max_date']" hx-target="#container"
diff --git a/templates/partials/workout_modal.html b/templates/partials/workout_modal.html
index 3a38086..2349b9e 100644
--- a/templates/partials/workout_modal.html
+++ b/templates/partials/workout_modal.html
@@ -90,8 +90,9 @@
 
 
                                     <div class="w-full">
-                                        <select id="workout-exercise-select" data-te-select-init
-                                            data-te-select-filter="true" name="exercise_id"
+                                        <select id="workout-exercise-select-{{ workout['WorkoutId'] }}"
+                                            data-te-select-init data-te-select-filter="true" data-te-select-size="lg"
+                                            name="exercise_id"
                                             class="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
                                             {% for e in workout['Exercises'] %}
                                             <option value="{{ e['ExerciseId'] }}">{{
@@ -101,7 +102,7 @@
                                         </select>
                                     </div>
                                     <script>
-                                        te.Select.getOrCreateInstance(document.querySelector("#workout-exercise-select"));
+                                        te.Select.getOrCreateInstance(document.querySelector("#workout-exercise-select-{{ workout['WorkoutId'] }}"));
                                     </script>
                                 </div>
                             </div>
@@ -112,7 +113,7 @@
                                     Reps
                                 </label>
                                 <input
-                                    class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-2 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
+                                    class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
                                     id="grid-city" type="number" name="repetitions">
                             </div>
 
@@ -122,7 +123,7 @@
                                     Weight
                                 </label>
                                 <input
-                                    class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-2 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
+                                    class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
                                     id="grid-zip" type="number" name="weight" step="any">
                             </div>
                         </div>