Files
Gainsight/Custom_Templates/customer_templates/OpenWallet/_completion_dashboard.html.liquid
2022-11-11 21:54:43 -05:00

57 lines
1.7 KiB
Plaintext

<div class="np-dashboard-resources">
{% if courses.enrolled.any? %}
<div class="">
{% assign countComplete = 0 %}
{% assign countInProgress = 0 %}
{% assign countNotStarted = 0 %}
{% assign countTotal = 0 | times: 1.0 %}
{% for course in courses.enrolled %}
{% assign countTotal = countTotal | plus: 1 %}
{% if course.progress == 100 %}
{% assign countComplete = countComplete | plus: 1 %}
{% endif %}
{% if course.progress > 0 and course.progress < 100 %}
{% assign countInProgress = countInProgress | plus: 1 %}
{% endif %}
{% if course.progress == 0 %}
{% assign countNotStarted = countNotStarted | plus: 1 %}
{% endif %}
{% endfor %}
<ul class="circle-list">
<li>
{% include "progress_circle", name:'Completed' , count: countComplete , total: countTotal %}
</li>
<li>
{% include "progress_circle", name:'In Progress' , count: countInProgress , total: countTotal %}
</li>
<li>
{% include "progress_circle", name:'Not Started' , count: countNotStarted , total: countTotal %}
</li>
</ul>
</div>
{% else %}
{% capture message %}
{% t shared.zero_state.courses.index,
key: current_school.course_vocabulary
%}
{% endcapture %}
{% include "courses_zero_state", message: message %}
{% endif %}
</div>
<style>
.circle-list {
list-style-type: none !important;
}
.align-center {
align-items: center !important;
}
.progress-ring__circle {
transition: stroke-dashoffset 0.35s;
}
.progress-ring__circle {
transition: stroke-dashoffset 0.35s;
transform: rotate(-90deg);
transform-origin: center;
}
</style>