From c6edfc2661186bcf488ce662b02342d8b44c4129 Mon Sep 17 00:00:00 2001
From: Sam <sam@samr1.net>
Date: Wed, 12 Jul 2023 09:06:45 +0200
Subject: [PATCH] Client - make arrow buttons wider on workout card

---
 .../Workout/WorkoutDetail/WorkoutCardTitle.vue | 18 +++++++++++++-----
 .../components/Workout/WorkoutDetail/index.vue |  3 +++
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutCardTitle.vue b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutCardTitle.vue
index 2089778f..fe8aca4a 100644
--- a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutCardTitle.vue
+++ b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutCardTitle.vue
@@ -131,6 +131,7 @@
 
     .workout-arrow {
       cursor: pointer;
+      padding: $default-padding;
       &.inactive {
         color: var(--disabled-color);
         cursor: default;
@@ -168,12 +169,19 @@
         cursor: pointer;
         padding: 0 $default-padding * 0.3;
       }
+    }
 
-      @media screen and (max-width: $small-limit) {
-        .fa-download,
-        .fa-trash,
-        .fa-edit {
-          padding: 0 $default-padding * 0.7;
+    @media screen and (max-width: $small-limit) {
+      .workout-arrow {
+        padding: $default-padding * 0.5;
+      }
+      .workout-card-title {
+        @media screen and (max-width: $small-limit) {
+          .fa-download,
+          .fa-trash,
+          .fa-edit {
+            padding: 0 $default-padding * 0.7;
+          }
         }
       }
     }
diff --git a/fittrackee_client/src/components/Workout/WorkoutDetail/index.vue b/fittrackee_client/src/components/Workout/WorkoutDetail/index.vue
index da89f52f..4b02fa4c 100644
--- a/fittrackee_client/src/components/Workout/WorkoutDetail/index.vue
+++ b/fittrackee_client/src/components/Workout/WorkoutDetail/index.vue
@@ -184,6 +184,9 @@
     display: flex;
     ::v-deep(.card) {
       width: 100%;
+      .card-title {
+        padding: $default-padding $default-padding * 1.5;
+      }
       .card-content {
         display: flex;
         flex-direction: row;