HabitTracker/templates/components/heatmap.html

<div class="flex-fill col-md-5 col-lg-4 col-12 card bg-light mb-6">
    <div class="card-body">
        <h5 class="card-title">📅 Heatmap</h5>
        <div id="heatmap"></div>
    </div>
</div>

<script>
    // Generates activity based on the Values given by the Backend
    const activityData = {{ heatmap_values }};
    const day = {{ day }};
    const color = "{{ color }}";
</script>