112 lines
2.7 KiB
Plaintext
112 lines
2.7 KiB
Plaintext
{% include "header" %}
|
|
<main class="course">
|
|
<div class="course-header">
|
|
<div class="course-header-title">
|
|
{{ course.name }}
|
|
</div>
|
|
{% unless course.properties.subtitle contains 'missing property' %}
|
|
<div class="course-header-subtitle">
|
|
{{ course.properties.subtitle }}
|
|
</div>
|
|
{% endunless %}
|
|
</div>
|
|
<div class="container">
|
|
<div class="course-content row">
|
|
<div class="course-content-left col-md-6">
|
|
<img
|
|
src="{{ course.image_url }}"
|
|
alt="{{ course.name }}"
|
|
class="course-content-left-image"
|
|
/>
|
|
<div class="course-content-left-description-title">
|
|
About the Module
|
|
</div>
|
|
<div class="course-content-left-description">
|
|
{{ course.full_description }}
|
|
</div>
|
|
{% if course.categories.any? %}
|
|
<div class="course-content-left-categories">
|
|
{% include "course_categories" %}
|
|
</div>
|
|
{% endif %}
|
|
{% if course.instructors.any? %}
|
|
<div class="course-content-left-instructors">
|
|
{% include "course_instructors" %}
|
|
</div>
|
|
{% endif %}
|
|
{% if course.events.any? %}
|
|
<div class="course-content-left-events">
|
|
{% include "course_events" %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
<div class="course-content-right col-md-6">
|
|
<div class="course-content-right-cta">
|
|
{% include "course_progress_and_cta" %}
|
|
</div>
|
|
<div class="course-content-right-outline">
|
|
{% include "course_outline" %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<style>
|
|
.course-header{
|
|
text-align: center;
|
|
margin: 40px 0 100px;
|
|
}
|
|
.course-header-title {
|
|
font-family: 'Playfair Display', serif;
|
|
font-size: 3.1rem;
|
|
font-weight: 500;
|
|
margin-bottom: 10px;
|
|
}
|
|
.course-header-subtitle {
|
|
font-size: 1.5rem;
|
|
font-weight: 400;
|
|
}
|
|
.container {
|
|
max-width: 1440px;
|
|
width: 90%;
|
|
}
|
|
.course-content {
|
|
margin: 40px 5%;
|
|
}
|
|
.course-content-left-image {
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
}
|
|
.course-content-left-description-title {
|
|
font-family: 'Playfair Display', serif;
|
|
font-size: 2.25rem;
|
|
font-weight: 500;
|
|
margin-bottom: 20px;
|
|
}
|
|
.course-content-left-description {
|
|
font-weight: 300;
|
|
}
|
|
.course-content-right-cta {
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.course-content-right {
|
|
margin-top: 60px;
|
|
}
|
|
.course-button {
|
|
margin: auto;
|
|
}
|
|
.progress-text {
|
|
margin: 20px auto;
|
|
}
|
|
.progress-bar {
|
|
justify-content: center;
|
|
}
|
|
.course-content-right-cta {
|
|
margin-bottom: 60px;
|
|
}
|
|
}
|
|
</style> |