93 lines
2.3 KiB
Plaintext
93 lines
2.3 KiB
Plaintext
{% assign content_expired = false %}
|
|
{% assign now = "now" | date: "%m/%d/%Y" %}
|
|
|
|
{% if now >= course.properties.content_expiration %}
|
|
{% assign content_expired = true %}
|
|
{% endif %}
|
|
|
|
{% unless content_expired %}
|
|
<div class="np-card">
|
|
<div class="np-card-container">
|
|
{% if course.ribbon %}
|
|
<div class="np-card-ribbon">
|
|
{{ course.ribbon }}
|
|
</div>
|
|
{% endif %}
|
|
<div class="np-card-image-content-top"></div>
|
|
<img
|
|
class="np-card-image"
|
|
alt="{{ course.name }}"
|
|
src="{{ course.image_url }}"
|
|
>
|
|
</div>
|
|
<div class="np-card-content np-card-content-vertical np-card-padding course-card-content">
|
|
<div class="course-title-vision">
|
|
{{ course.name }}
|
|
</div>
|
|
<div class="course-desc">
|
|
{{ course.full_description }}
|
|
</div>
|
|
<div class="np-card-content-footer">
|
|
<div class="np-card-content-progress np-button-color">
|
|
{% if course.progress > 0 and course.progress < 100 %}
|
|
In progress
|
|
{% elsif course.completed? %}
|
|
Viewed
|
|
{% else %}
|
|
Not viewed
|
|
{% endif %}
|
|
|
|
</div>
|
|
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
|
<a
|
|
class="np-button-font-color np-button" href="{{course_path}}"
|
|
>
|
|
{% if course.started? == false %}
|
|
Start
|
|
{% elsif course.progress > 0 and course.progress < 100 %}
|
|
{% t shared.continue %}
|
|
{% elsif course.completed? %}
|
|
Resume
|
|
{% endif %}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endunless %}
|
|
|
|
<style>
|
|
|
|
.course-card-content {
|
|
color: black!important;
|
|
padding: 22px 16px 16px;
|
|
}
|
|
|
|
.np-card-image {
|
|
border-radius:0;
|
|
}
|
|
|
|
.np-card {
|
|
margin-bottom: 10px!important;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.course-title-vision {
|
|
font-family: "PlusJakartaSans-Bold", sans-serif!important;
|
|
font-weight: 700;
|
|
margin-bottom:8px;
|
|
font-size:18px;
|
|
}
|
|
|
|
.course-desc {
|
|
flex:2;
|
|
}
|
|
|
|
.np-card .np-card-content-footer .np-button {
|
|
background-color:#cc0033;
|
|
width:auto;
|
|
color:#fff!important;
|
|
}
|
|
</style>
|