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

77 lines
1.6 KiB
Plaintext

<div class="np-dashboard-resources" style="padding-bottom: 1rem;">
<div class="np-card">
<div class="np-card-container">
<div class="np-card-content-training-event">
<h3 class="np-card-content-title recent-achievements">
Recent Achievements
</h3>
<div style=" float: left;">
<button class="view-achievements-button" onclick="#" type="button">Total Points:{{ current_person.properties.learner_points }}</button>
</div>
</div>
<br>
<br>
<div class="achivements-carousel">
{% for course in courses.enrolled %}
{% if course.progress == 100 %}
<div>
<br>
<img src="{{course.properties.course_badge}}">
<div class="np-card-content-title recent-achievements col-12" style="text-align: center;">
<p>{{ course.name }}</p>
</div>
</div>
{% endif %}
{% endfor %}
</div>
</div>
</div>
</div>
<style>
.view-achievements-button {
background-color: #DC3713;
border: none;
color: white;
padding: 5px 8px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 12px;
cursor: pointer;
border-radius: 30px;
margin-top:12px;
}
.recent-achievements {
font-size: 16px;
}
.achievement-icon {
text-align: center;
color: #bec2c6;;
}
.horizontal-separator {
border-bottom: 1px solid grey;
}
@media screen and (max-width: 1200px) {
.recent-achievements {
font-size: 12px;
}
}
@media screen and (max-width: 800px) {
.view-achievements-button {
font-size: 9px;
}
}
</style>