simple visual treatment of key dates

main.py

@@ -102,7 +102,8 @@ def index():
 
     # now work out how much padding we need in the first year to align the last dates for all years
     padding=second_count - first_count
-    return render_template('index.html', now=now, first_yr=first_yr, padding=padding, finance=finance_data, depletion_date=depletion_date, savings=savings_per_fortnight, BUDGET=BUDGET, COMP=COMP, DISP=DISP)
+    key_dates = calc_key_dates( finance_data )
+    return render_template('index.html', now=now, first_yr=first_yr, padding=padding, finance=finance_data, depletion_date=depletion_date, savings=savings_per_fortnight, BUDGET=BUDGET, COMP=COMP, DISP=DISP, key_dates=key_dates)
 
 @app.route('/save', methods=['POST'])
 def save():

templates/index.html

@@ -99,19 +99,38 @@
          <br>
       {% endfor %}
 
+      {% set car_done=namespace( val=0 ) %}
+
       {% for date, dollars in savings %}
           {% set yr=date[:4] %}
           {% set mon=date[5:7] %}
           {% set day=date[8:10 ] %}
 
+          {% set car_yr=key_dates['D_hyundai_owned'][:4] %}
+          {% set car_mon=key_dates['D_hyundai_owned'][5:7] %}
+          {% set car_day=key_dates['D_hyundai_owned'][8:10 ] %}
+
           {% if yr|int > first_yr|int and mon == '01' and day|int <= 14 %}
             </div><div class="col-auto">
             <div class="pt-1 pb-1 mb-0 alert text-center bg-secondary text-light">{{yr}}</div>
           {% endif %}
+
+
+          {% if date == key_dates['D_quit_date'] %}
+          <font class="text-info">
+            <label data-bs-toggle="tooltip" title="D quits">
+          {% elif (yr == car_yr and mon == car_mon and day >= car_day and car_done.val == 0) %}
+          {%set car_done.val=1 %}
+          <font class="text-info">
+            <label data-bs-toggle="tooltip" title="We own car">
+          {% else %}
           <font class="text-secondary">
+            <label>
+          {% endif %}
             {{ date }}:&nbsp;
             {{ '$%0.2f' % dollars|float }}<br>
-          </font>
+            </label>
+          </font><br>
           {% if comp_done.val == 0 and yr == comp_yr and mon == comp_mon and day|int >= comp_day|int %}
             <font class="text-info">
             {{ COMP['date'] }}:&nbsp;