From 0c4b8f1b98033dcfa870cc80d28647aea4658a6c Mon Sep 17 00:00:00 2001
From: Sam <sam@samr1.net>
Date: Sun, 19 Nov 2023 11:58:45 +0100
Subject: [PATCH] Client - fix chart display on mobile

---
 .../src/components/Common/StatsChart/Chart.vue             | 7 +++++++
 .../src/components/Common/StatsChart/index.vue             | 5 +++--
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/fittrackee_client/src/components/Common/StatsChart/Chart.vue b/fittrackee_client/src/components/Common/StatsChart/Chart.vue
index 955e4b38..62cfe446 100644
--- a/fittrackee_client/src/components/Common/StatsChart/Chart.vue
+++ b/fittrackee_client/src/components/Common/StatsChart/Chart.vue
@@ -203,15 +203,22 @@
   @import '~@/scss/vars.scss';
 
   .bar-chart {
+    position: relative;
     min-height: 400px;
+    width: 100%;
     &.minimal {
       min-height: 300px;
     }
 
     @media screen and (max-width: $small-limit) {
+      min-height: 268px;
       &.minimal {
         min-height: 290px;
       }
     }
+
+    @media screen and (max-width: 420px) {
+      width: calc(100vw - 95px);
+    }
   }
 </style>
diff --git a/fittrackee_client/src/components/Common/StatsChart/index.vue b/fittrackee_client/src/components/Common/StatsChart/index.vue
index e382aceb..9f179f8f 100644
--- a/fittrackee_client/src/components/Common/StatsChart/index.vue
+++ b/fittrackee_client/src/components/Common/StatsChart/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="start-chart">
+  <div class="stats-chart">
     <div v-if="hideChartIfNoData && emptyStats">
       {{ $t('workouts.NO_WORKOUTS') }}
     </div>
@@ -185,7 +185,8 @@
 
 <style lang="scss" scoped>
   @import '~@/scss/vars';
-  .start-chart {
+  .stats-chart {
+    width: 100%;
     .chart-radio {
       display: flex;
       justify-content: space-between;