templates/components/github-heatmap.hbs

<section class="category category-level-1 gh-heatmap-category" data-type="heatmap">
    <div class="category-header">
        <div class="gh-heatmap-header">
            <h2>
                <i class="fab fa-github"></i>
                <span class="gh-text-desktop">GitHub Contributions</span>
                <span class="gh-text-mobile">Contributions</span>
                <span class="gh-heatmap-username">@{{username}}</span>
            </h2>

            <div class="gh-legend" aria-hidden="true">
                <span>
                    <span class="gh-text-desktop">Less</span>
                    <span class="gh-text-mobile">L</span>
                </span>
                <div class="gh-legend-item level-0"></div>
                <div class="gh-legend-item level-1"></div>
                <div class="gh-legend-item level-2"></div>
                <div class="gh-legend-item level-3"></div>
                <div class="gh-legend-item level-4"></div>
                <span>
                    <span class="gh-text-desktop">More</span>
                    <span class="gh-text-mobile">M</span>
                </span>
            </div>
        </div>
    </div>

    <div class="category-content">
        <div class="gh-heatmap-wrapper">
            <div class="calendar gh-calendar" data-github-username="{{username}}" id="github-calendar-{{username}}">
                {{#if html}}
                    {{{html}}}
                {{else}}
                    Loading data...
                {{/if}}
            </div>
        </div>
    </div>
</section>