160 lines
3.4 KiB
Plaintext
160 lines
3.4 KiB
Plaintext
{% include "header", current_page_orgin: "learning_paths" %}
|
|
|
|
{% assign lp_items_all_optional = true %}
|
|
{% for item in learning_path.items %}
|
|
{% unless item.optional? %}
|
|
{% assign lp_items_all_optional = false %}
|
|
{% endunless %}
|
|
{% endfor %}
|
|
|
|
<main class="np-main np-page-container page--learning-path-overview">
|
|
|
|
{% include "learning_path_banners" %}
|
|
|
|
{% assign learning_path_image_full_size = learning_path.image_url | replace: '/resize=width:820,height:500,fit:crop/', '/' %}
|
|
|
|
<div class="blocks-layout">
|
|
|
|
<div class="col-md-5 col-lg-6">
|
|
<div class="np-card">
|
|
<div class="details-card__card-container np-card-container">
|
|
<div class="np-resource-header details-card__header np-card-padding-dynamic">
|
|
<div class="np-top-title">
|
|
{{ learning_path.name }}
|
|
</div>
|
|
</div>
|
|
<div class="np-divider"></div>
|
|
<div class="details-card__card-content np-card-padding-dynamic">
|
|
{% if learning_path.description and learning_path.description.size > 0 %}
|
|
{% include "learning_path_description" %}
|
|
{% endif %}
|
|
|
|
{% if learning_path.instructors and learning_path.instructors.any? %}
|
|
<div class="np-card-content-divider">
|
|
{% include "learning_path_instructors" %}
|
|
</div>
|
|
|
|
{% endif %}
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-7 col-lg-6">
|
|
<div class="cta__container cta--outline {% if lp_items_all_optional %}all-optional-items{% endif %}">
|
|
{% include "learning_path_progress_and_cta" %}
|
|
</div>
|
|
{% include "learning_path_outline" %}
|
|
</div>
|
|
|
|
</div>
|
|
</main>
|
|
{% include "footer" %}
|
|
|
|
<style>
|
|
|
|
.cta__container.cta--outline.all-optional-items {
|
|
display:none;
|
|
}
|
|
|
|
.page--learning-path-overview {
|
|
background: #8B78FA;
|
|
}
|
|
|
|
.np-learning-path-outline-item .np-card-container {
|
|
flex-direction: column;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.np-learning-path-outline-item .card__image {
|
|
width:100%;
|
|
padding:16px;
|
|
text-align:center;
|
|
}
|
|
|
|
.np-learning-path-outline-item .card__image > img {
|
|
max-width:100%;
|
|
max-height:200px;
|
|
}
|
|
|
|
.np-learning-path-outline-item .card__image .np-card-ribbon {
|
|
right:22px;
|
|
top:22px;
|
|
}
|
|
|
|
.np-learning-path-outline-content {
|
|
margin-left: 0;
|
|
padding: 0 16px 16px;
|
|
}
|
|
|
|
.np-learning-path-outline-item .np-card-content-title {
|
|
font-size:18px;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.outline-card__icon-container {
|
|
width: auto;
|
|
border-radius: 30px;
|
|
padding: 6px 16px;
|
|
min-width: 115px;
|
|
text-align: center;
|
|
margin-right:0;
|
|
}
|
|
|
|
.np-learning-path-outline-item .np-card-content-progress {
|
|
font-size:14px;
|
|
}
|
|
|
|
@media (min-width:768px) {
|
|
|
|
.np-learning-path-outline-item .np-card-container {
|
|
flex-direction: row;
|
|
align-items: stretch;
|
|
}
|
|
|
|
.np-learning-path-outline-item .card__image {
|
|
width:40%;
|
|
max-width: 300px;
|
|
}
|
|
|
|
.np-learning-path-outline-item .card__image > img {
|
|
max-height:130px;
|
|
}
|
|
|
|
.np-learning-path-outline-content {
|
|
padding: 16px;
|
|
display:flex;
|
|
flex-direction:row;
|
|
justify-content: space-between;
|
|
height:auto;
|
|
}
|
|
|
|
.np-learning-path-outline-content .text-wrapper {
|
|
display:flex;
|
|
flex-direction:column;
|
|
}
|
|
|
|
.np-learning-path-outline-item .np-card-content-title {
|
|
font-size:16px;
|
|
flex:1;
|
|
}
|
|
|
|
.outline-card__icon-container {
|
|
margin-left:16px;
|
|
}
|
|
|
|
}
|
|
|
|
@media (min-width:1400px) {
|
|
.np-learning-path-outline-item .np-card-content-title,
|
|
.np-learning-path-session-card .np-learning-path-outline-name {
|
|
font-size:18px;
|
|
}
|
|
|
|
.np-learning-path-outline-item .np-card-content-progress {
|
|
font-size: 16px;
|
|
}
|
|
}
|
|
|
|
</style>
|