From fd5b754a6785389dd58b9b458f8dca168f9642c6 Mon Sep 17 00:00:00 2001
From: Gregory Trullemans <redj@MacBook-Pro-de-Gregory.local>
Date: Wed, 24 Jan 2024 15:02:39 +0100
Subject: [PATCH] Opimize intensity detail for smartphone

---
 .../templates/intensities/details.html        | 52 +++++++++----------
 1 file changed, 26 insertions(+), 26 deletions(-)

diff --git a/jarvis/followup/templates/intensities/details.html b/jarvis/followup/templates/intensities/details.html
index c8e5ea9..e4ef030 100644
--- a/jarvis/followup/templates/intensities/details.html
+++ b/jarvis/followup/templates/intensities/details.html
@@ -9,27 +9,27 @@
                 <h4 class="card-title mb-0"><a href="{% url 'gymnast_details_tab' intensity.gymnast.id 'routine' %}">{{ intensity.gymnast }}</a>'s training intensity for the {{ intensity.date | date:"j F Y" }}</h4>
             </div>
             <div class="card-body row pb-0">
-                <div class="col-5 text-center"><b>Encoded data</b></div>
-                <div class="col-2"></div>
-                <div class="col-5 text-center"><b>Average</b></div>
+                <div class="col-6 col-sm-5 text-center"><b>Encoded data</b></div>
+                <div class="col-sm-2 d-none d-sm-block"></div>
+                <div class="col-6 col-sm-5 text-center"><b>Average</b></div>
 
-                <div class="col-3">Time (min)</div>
-                <div class="col-2 text-right">{{ intensity.time }}</div>
-                <div class="col-2"></div>
-                <div class="col-3">Diff/passe</div>
-                <div class="col-2 text-right"><b>{{ intensity.mean_difficulty_by_passe_in_unit | floatformat:3 }}</b></div>
+                <div class="col-4 col-sm-3 pr-0">Time (min)</div>
+                <div class="col-2 text-right pl-0">{{ intensity.time }}</div>
+                <div class="col-sm-2 d-none d-sm-block"></div>
+                <div class="col-4 col-sm-3 pr-0">Diff/passe</div>
+                <div class="col-2 text-right pl-0"><b>{{ intensity.mean_difficulty_by_passe_in_unit | floatformat:3 }}</b></div>
 
-                <div class="col-3">Difficulty</div>
-                <div class="col-2 text-right">{{ intensity.difficulty_in_unit }}</div>
-                <div class="col-2"></div>
-                <div class="col-3">Diff/Skill</div>
-                <div class="col-2 text-right"><b>{{ intensity.mean_difficulty_by_skill_in_unit | floatformat:3 }}</b></div>
+                <div class="col-4 col-sm-3 pr-0">Difficulty</div>
+                <div class="col-2 text-right pl-0">{{ intensity.difficulty_in_unit }}</div>
+                <div class="col-sm-2 d-none d-sm-block"></div>
+                <div class="col-4 col-sm-3 pr-0">Diff/Skill</div>
+                <div class="col-2 text-right pl-0"><b>{{ intensity.mean_difficulty_by_skill_in_unit | floatformat:3 }}</b></div>
 
-                <div class="col-3"># Skill</div>
-                <div class="col-2 text-right">{{ intensity.quantity_of_skill }}</div>
-                <div class="col-2"></div>
-                <div class="col-3">Skill/passe</div>
-                <div class="col-2 text-right">
+                <div class="col-4 col-sm-3 pr-0"># Skill</div>
+                <div class="col-2 text-right pl-0">{{ intensity.quantity_of_skill }}</div>
+                <div class="col-sm-2 d-none d-sm-block"></div>
+                <div class="col-4 col-sm-3 pr-0">Skill/passe</div>
+                <div class="col-2 text-right pl-0">
                     <b>
                         {% if intensity.quantity_of_skill_by_passe > 7.37 %}
                             <span class="text-danger">{{ intensity.quantity_of_skill_by_passe | floatformat:3 }}</span>
@@ -41,11 +41,11 @@
                     </b>
                 </div>
 
-                <div class="col-3"># Passes</div>
-                <div class="col-2 text-right">{{ intensity.number_of_passes }}</div>
-                <div class="col-2"></div>
-                <div class="col-3">Skill/time</div>
-                <div class="col-2 text-right">
+                <div class="col-4 col-sm-3 pr-0"># Passes</div>
+                <div class="col-2 text-right pl-0">{{ intensity.number_of_passes }}</div>
+                <div class="col-sm-2 d-none d-sm-block"></div>
+                <div class="col-4 col-sm-3 pr-0">Skill/time</div>
+                <div class="col-2 text-right pl-0">
                     <b>
                         {% if intensity.mean_quantity_of_skill_by_time > 2.37 %}
                             <span class="text-danger">{{ intensity.mean_quantity_of_skill_by_time | floatformat:3 }}</span>
@@ -57,10 +57,10 @@
                     </b>
                 </div>
 
-                <div class="col-3"></div>
+                <div class="col-4 col-sm-3"></div>
                 <div class="col-2"></div>
-                <div class="col-2"></div>
-                <div class="col-3">Time/passe</div>
+                <div class="col-sm-2 d-none d-sm-block"></div>
+                <div class="col-4 col-sm-3 pr-0">Time/passe</div>
                 <div class="col-2 text-right">
                     <b>
                         {% if intensity.mean_time_by_passe > 4.13 %}