{# https://github.com/tomik23/circular-progress-bar #}
<div class="row row-cols-1 justify-content-center">
	<div class="col mt-4 mb-5">
		<div class="progress-metercard progress-metercard-{{ vars.primary_meter_slug }}"
			 data-meter_slug="{{ vars.primary_meter_slug }}">
				{% include '/components/html/loading_placeholders/progress_meter.twig' %}
		</div>
  </div>
</div>

<div class="row">
	{% for meter_slug in vars.meter_slugs %}
		<div class="col-lg-12 col-xl-6 mb-4 pb-4">
			<div class="progress-metercard progress-metercard-{{ meter_slug }}"
				 style="height: 100%"
				 data-meter_slug="{{ meter_slug }}">
				{% include '/components/html/loading_placeholders/progress_meter.twig' %}
			</div>
		</div>
	{% endfor %}
</div>