77 lines
2.4 KiB
Plaintext
77 lines
2.4 KiB
Plaintext
<div class="np-course-outline">
|
|
<div class="small-heading">
|
|
Course outline
|
|
</div>
|
|
<div class="course-outline-content">
|
|
<ol class="np-course-outline-content-section">
|
|
{% for section in course.sections %}
|
|
<li class="np-course-outline-content-section-list">
|
|
<div class="outline-section-name">
|
|
{{ section.name }}
|
|
</div>
|
|
<ol class="course-outline-content-activity">
|
|
{% for activity in section.activities %}
|
|
|
|
<li class="np-course-outline-content-activity-list">
|
|
{% if activity.completed? %}
|
|
<i class="fas fa-circle np-course-outline-content-activity-icon np-button-color"></i>
|
|
{% if activity.locked? %}
|
|
{% include "course_activity_locked" %}
|
|
{% else %}
|
|
{% include "course_activity_unlocked", class: "course-outline-content-activity-link-completed" %}
|
|
{% endif %}
|
|
<div class="np-button-background-color np-course-outline-content-activity-list-bar"></div>
|
|
{% else %}
|
|
{% unless activity.locked? %}
|
|
<i class="far fa-circle np-course-outline-content-activity-icon"></i>
|
|
{% endunless %}
|
|
{% if activity.locked? %}
|
|
{% include "course_activity_locked" %}
|
|
{% else %}
|
|
{% include "course_activity_unlocked", class: "course-outline-content-activity-link" %}
|
|
{% endif %}
|
|
<div class="np-course-outline-content-activity-list-bar"></div>
|
|
{% endif %}
|
|
</li>
|
|
{% endfor %}
|
|
</ol>
|
|
</li>
|
|
{% endfor %}
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.course-outline-content {
|
|
margin-top: 50px;
|
|
}
|
|
.outline-section-name {
|
|
font-size: 24px;
|
|
font-weight: 400;
|
|
line-height: 30px;
|
|
letter-spacing: -0.015em;
|
|
color: #0F2B46;
|
|
}
|
|
.course-outline-content-activity {
|
|
padding: 0;
|
|
}
|
|
.np-course-outline-content-activity-list {
|
|
border-bottom: none;
|
|
|
|
}
|
|
.course-outline-content-activity-link {
|
|
font-size: 18px;
|
|
font-weight: 400;
|
|
line-height: 25.2px;
|
|
letter-spacing: -0.01em;
|
|
text-align: left;
|
|
color: #42A2FF;
|
|
text-decoration: none;
|
|
margin-left: 20px;
|
|
}
|
|
.np-course-outline-content-activity-icon {
|
|
width: 23px;
|
|
height: 23px;
|
|
color: #0F2B46
|
|
}
|
|
</style> |