From ff6a9215500a1111deaa2ed165272b3937a6b751 Mon Sep 17 00:00:00 2001
From: Peter Stockings <pstockings@jadeworld.com>
Date: Sat, 28 Feb 2026 16:33:43 +1100
Subject: [PATCH] Improve styling of exercise history/sparkline partials

---
 templates/partials/exercise_history.html | 6 +++---
 templates/partials/sparkline.html        | 6 +++---
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/templates/partials/exercise_history.html b/templates/partials/exercise_history.html
index 9d12ef4..086bd4b 100644
--- a/templates/partials/exercise_history.html
+++ b/templates/partials/exercise_history.html
@@ -2,13 +2,13 @@
 <div id="exercise-history-container"
     class="w-full bg-gray-50 p-4 border-t border-gray-200 shadow-inner overflow-x-auto">
     <div class="flex items-center justify-between sm:justify-center relative mb-1">
-        <div class="flex items-center justify-center gap-2 w-full">
-            <h4 class="text-l font-semibold text-blue-400">{{ title }}</h4>
+        <div class="flex flex-col sm:flex-row items-center justify-center w-full gap-x-2">
+            <h4 class="text-lg font-semibold text-blue-400">{{ title }}</h4>
             <div hx-get="{{ url_for('workout.get_topset_achievements', person_id=person_id, workout_id=latest_workout_id, topset_id=latest_topset_id) }}"
                 hx-trigger="load" hx-target="this" hx-swap="innerHTML" class="flex items-center">
             </div>
         </div>
-        <div class="absolute right-0 z-10">
+        <div class="absolute left-0 z-10">
             <button
                 class="inline-flex justify-center p-1 text-gray-500 rounded cursor-pointer hover:text-gray-900 hover:bg-gray-100"
                 title="Show Progress Graph"
diff --git a/templates/partials/sparkline.html b/templates/partials/sparkline.html
index 4b19643..3c06245 100644
--- a/templates/partials/sparkline.html
+++ b/templates/partials/sparkline.html
@@ -47,13 +47,13 @@
         <!-- Popover content will be dynamically inserted here -->
     </div>
     <div class="flex items-center justify-between sm:justify-center relative mb-1">
-        <div class="flex items-center justify-center gap-2 w-full">
-            <h4 class="text-l font-semibold text-blue-400">{{ title }}</h4>
+        <div class="flex flex-col sm:flex-row items-center justify-center w-full gap-x-2">
+            <h4 class="text-lg font-semibold text-blue-400">{{ title }}</h4>
             <div hx-get="{{ url_for('workout.get_topset_achievements', person_id=person_id, workout_id=latest_workout_id, topset_id=latest_topset_id) }}"
                 hx-trigger="load" hx-target="this" hx-swap="innerHTML" class="flex items-center">
             </div>
         </div>
-        <div class="absolute right-0 z-10">
+        <div class="absolute left-0 z-10">
             <button
                 class="inline-flex justify-center p-1 text-gray-500 rounded cursor-pointer hover:text-gray-900 hover:bg-gray-100 dark:text-gray-400 dark:hover:text-white dark:hover:bg-gray-600"
                 title="Show History"