ddp/finplan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix up the alert-info width to be width of column its in, rather than hard-code it

Browse Source
This commit is contained in:
Damien De Paoli
2025-02-14 16:45:03 +11:00
parent 7751f29a0f
commit ffa7e509ed
1 changed files with 7 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
templates/index.html
View File

@@ -91,7 +91,7 @@
</h5> </h5>
<div class="row"> <div class="row">
<div class="col-auto"> <div class="pt-1 pb-1 mb-0 alert text-center" style="background:lemonchiffon">2025</div> <div id="info_col" class="col-auto"> <div class="pt-1 pb-1 mb-0 alert text-center" style="background:lemonchiffon">2025</div>
{% set first_yr=2025 %} {% set first_yr=2025 %}
{% for date, dollars in savings %} {% for date, dollars in savings %}
@@ -121,7 +121,7 @@
<div class="alert alert-success">Super kicks in!!!</div> <div class="alert alert-success">Super kicks in!!!</div>
{% endif %} {% endif %}
{% if COMP %} {% if COMP %}
<div style="width:168px" class="alert alert-info">Note: {{ '$%0.2f' % COMP['amount']|float }} is the final value of the compared to data. Hover over blue labels above to see what compared to values differed</div> <div id="info_alert" class="alert alert-info">Note: {{ '$%0.2f' % COMP['amount']|float }} is the final value of the compared to data. Hover over blue labels above to see what compared to values differed</div>
{% endif %} {% endif %}
</div> </div>
@@ -162,6 +162,11 @@
var tooltipTriggerList = [].slice.call(document.querySelectorAll("[data-bs-toggle='tooltip']")) var tooltipTriggerList = [].slice.call(document.querySelectorAll("[data-bs-toggle='tooltip']"))
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { return new bootstrap.Tooltip(tooltipTriggerEl) }) var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { return new bootstrap.Tooltip(tooltipTriggerEl) })
var parentWidth = $('#info_col').width();
// Set the alert's `max-width` to the parent's width
$('#info_alert').css('max-width', parentWidth + 'px');
}; };
document.addEventListener('DOMContentLoaded', function () { document.addEventListener('DOMContentLoaded', function () {