54 lines
1.3 KiB
Plaintext
54 lines
1.3 KiB
Plaintext
<a class="np-card" href="{% route course_enrollment, code: course.enrollment_code %}">
|
|
<div class="np-card-container">
|
|
{% if course.ribbon %}
|
|
<div class="np-card-ribbon">
|
|
{{ course.ribbon }}
|
|
</div>
|
|
{% endif %}
|
|
<img
|
|
class="np-card-image"
|
|
alt="{{ course.name }}"
|
|
src="{{ course.image_url }}"
|
|
>
|
|
<div class="np-card-content-bottom">
|
|
<h3 class="np-card-content-title np-color-white">
|
|
{{ course.name }}
|
|
</h3>
|
|
<div class="np-card-content-subtitle np-color-white">
|
|
{{ course.instructor_names }}
|
|
</div>
|
|
<div class='np-card-content-description'>
|
|
{{ course.full_description }}
|
|
</div>
|
|
|
|
<div class="np-card-content-progress np-button-color">
|
|
{% t shared.progress, count: course.progress %}
|
|
</div>
|
|
<div class="np-card-content-category">
|
|
{{course.categories.first.name}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
<style>
|
|
.np-card {
|
|
text-decoration: none;
|
|
color: white;
|
|
}
|
|
.np-card-content-category {
|
|
border-top: 1px solid lightgray;
|
|
padding: 10px;
|
|
}
|
|
.np-card-content-description {
|
|
display: block;
|
|
color: lightgray;
|
|
}
|
|
.np-card-content-bottom {
|
|
padding: 15px;
|
|
}
|
|
.np-button-color {
|
|
color: lightslategray;
|
|
font-size: 15px;
|
|
padding-bottom: 10px;
|
|
}
|
|
</style> |