From 6aa485c3d87d716de448c95aa9f502f6cfde6b55 Mon Sep 17 00:00:00 2001
From: Luis Aleixo <luis.aleixo@cern.ch>
Date: Thu, 20 Jul 2023 17:06:17 +0200
Subject: [PATCH] use more css classes

---
 caimira/apps/calculator/static/js/co2_form.js         | 2 +-
 caimira/apps/templates/base/calculator.form.html.j2   | 8 ++++----
 caimira/apps/templates/base/calculator.report.html.j2 | 4 ++--
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/caimira/apps/calculator/static/js/co2_form.js b/caimira/apps/calculator/static/js/co2_form.js
index 518127c7..4618263c 100644
--- a/caimira/apps/calculator/static/js/co2_form.js
+++ b/caimira/apps/calculator/static/js/co2_form.js
@@ -88,7 +88,7 @@ const CO2_data_form = [
   }
   
   function insertErrorFor(referenceNode, text) {
-	const element = $('<span></span>').addClass('error_text red_text').html('&nbsp;&nbsp;' + text);
+	const element = $('<span></span>').addClass('error_text text-danger').html('&nbsp;&nbsp;' + text);
 	$(referenceNode).before(element);
   }
   
diff --git a/caimira/apps/templates/base/calculator.form.html.j2 b/caimira/apps/templates/base/calculator.form.html.j2
index 109e2c99..91be606c 100644
--- a/caimira/apps/templates/base/calculator.form.html.j2
+++ b/caimira/apps/templates/base/calculator.form.html.j2
@@ -310,7 +310,7 @@
           </ul>
         </div>
         <div class="align-self-center text-center">
-          <button id="button_fit_data" type="button" class="btn btn-primary" style="width: 60%" data-target="#DIVCO2_data_dialog" data-keyboard="false" data-backdrop="static" onclick="validateFormInputs(this)">Fitting Algorithm</button>
+          <button id="button_fit_data" type="button" class="btn btn-primary w-50" data-target="#DIVCO2_data_dialog" data-keyboard="false" data-backdrop="static" onclick="validateFormInputs(this)">Fitting Algorithm</button>
         </div>
       </div>
 
@@ -323,7 +323,7 @@
             </div>
             <div class="modal-body">    
               <div class="d-flex d-row justify-content-between">
-                <h5 style="margin-top: auto; margin-bottom: auto">Upload an Excel file to preview in HTML Table</h5>
+                <h5 class="mt-auto mb-auto">Upload an Excel file to preview in HTML Table</h5>
                 <button type="button" class="btn btn-primary btn-sm" onclick="downloadTemplate()">Download template</button>
               </div>
               <br>
@@ -355,11 +355,11 @@
               </div>
 
               <div id="DIVCO2_fitting_result" style="display: none">
-                <h5 style="margin-top: auto; margin-bottom: auto">Fitting result</h5><br>
+                <h5 class="mt-auto mb-auto">Fitting result</h5><br>
                 <p id="exhalation_rate_fit"></p>
                 <p>Ventilation values (ACH):</p><br>
                 <!-- table to display the ventilation result data -->
-                <table id="ventilation_rate_fit" border="1" style="width: 70%; margin-left: auto; margin-right: auto"></table>
+                <table id="ventilation_rate_fit" class="w-75 mr-auto ml-auto" border="1"></table>
               </div>
             </div>
             <div class="modal-footer">
diff --git a/caimira/apps/templates/base/calculator.report.html.j2 b/caimira/apps/templates/base/calculator.report.html.j2
index 9b1776f6..58bf8f68 100644
--- a/caimira/apps/templates/base/calculator.report.html.j2
+++ b/caimira/apps/templates/base/calculator.report.html.j2
@@ -531,7 +531,7 @@
 							<li><p class="data_text">From Fitting:
 							{% if form.ventilation_type == "from_fitting" %}
 							Yes
-							<table border="1" style="width: 20%; margin-left: 30px; margin-top: 20px">
+							<table class="w-25 mt-3 ml-4" border="1">
 								<tr><th> Time (HH:MM)</th><th>ACH value (h⁻¹)</th></tr>
 								{% for ventilation in form.CO2_fitting_result['ventilation_values'] %}
 									{% set transition_time = form.CO2_fitting_result['transition_times'] %}
@@ -596,7 +596,7 @@
 							Gym - For comparison only, all persons doing heavy physical exercise, breathing and not speaking.
 							{% endif %}
 							{% if form.ventilation_type == "from_fitting" %}
-							<p style="margin-left: 30px">Exhalation rate from fitting algorithm - {{form.CO2_fitting_result['exhalation_rate'] | round(2, 'floor')}} m³/h</p>
+							<p class="ml-5">Exhalation rate from fitting algorithm - {{form.CO2_fitting_result['exhalation_rate'] | round(2, 'floor')}} m³/h</p>
 							{% endif %}
 							</p></li>
 							{% if form.short_range_option == "short_range_yes" %}