Anthology back up
This commit is contained in:
Norm Rasmussen
@ -1,556 +0,0 @@
|
||||
{% if course.properties.product_names_for_course_cards == 'Anthology Reach' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Reach.svg' %}
|
||||
{% assign product_alt = 'Anthology Reach' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Radius' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F3798A' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Engage' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Engage.svg' %}
|
||||
{% assign product_alt = 'Anthology Engage' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F16423' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Beacon' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Beacon.svg' %}
|
||||
{% assign product_alt = 'Anthology Beacon' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F16423' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Milestone' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Milestone.svg' %}
|
||||
{% assign product_alt = 'Anthology Milestone' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F3798A' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Occupation Insight' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Occupation+Insight.svg' %}
|
||||
{% assign product_alt = 'Anthology Occupation Insight' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F58545' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Raise' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Raise.svg' %}
|
||||
{% assign product_alt = 'Anthology Raise' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Digital Assistant' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Digital+Assistant.svg' %}
|
||||
{% assign product_alt = 'Anthology Digital Assistant' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Baseline' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Baseline.svg' %}
|
||||
{% assign product_alt = 'Anthology Baseline' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#D94827' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Encompass' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Encompass.svg' %}
|
||||
{% assign product_alt = 'Anthology Encompass' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Talisma' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Student' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Student.svg' %}
|
||||
{% assign product_alt = 'Anthology Student' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#96CA51' %}
|
||||
{% assign color_light = '#F3E588' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'CVue' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#286734' %}
|
||||
{% assign color_light = '#F3E588' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Insight' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Insight.svg' %}
|
||||
{% assign product_alt = 'Anthology Insight' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#286734' %}
|
||||
{% assign color_light = '#82C342' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Finance & HCM' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Finance+%26+HCM.svg' %}
|
||||
{% assign product_alt = 'Anthology Finance & HCM' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#539542' %}
|
||||
{% assign color_light = '#C9BD2E' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Payroll' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Payroll.svg' %}
|
||||
{% assign product_alt = 'Anthology Payroll' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#82C342' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Academic Economics' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Academic+Economics.svg' %}
|
||||
{% assign product_alt = 'Anthology Academic Economics' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#286734' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Blackboard Learn' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/BBLearn.svg' %}
|
||||
{% assign product_alt = 'Blackboard Learn' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#1BA8E1' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Ally' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Ally.svg' %}
|
||||
{% assign product_alt = 'Anthology Ally' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#1BA8E1' %}
|
||||
{% assign color_light = '#A3DBDC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Course Evaluations' %}
|
||||
{% assign product_logo = 'https://s3.amazonaws.com/static.northpass.com/anthology/Course+Evaluations.svg' %}
|
||||
{% assign product_alt = 'Anthology Course Evaluations' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#004C6D' %}
|
||||
{% assign color_light = '#027BB6' %}
|
||||
{%- comment -%} NEED DIFF IMG FORMAT FOR THIS ONE {%- endcomment -%}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Evaluate' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#A3DBDC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Portfolio' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Portfolio.svg' %}
|
||||
{% assign product_alt = 'Anthology Portfolio' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#0090A1' %}
|
||||
{% assign color_light = '#5CC6CC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Program Review' %}
|
||||
{% assign product_logo = 'https://s3.amazonaws.com/static.northpass.com/anthology/Program+Review.svg' %}
|
||||
{% assign product_alt = 'Anthology Program Review' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#5CC6CC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Planning' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Planning.svg' %}
|
||||
{% assign product_alt = 'Anthology Planning' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#004C6D' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Accreditation' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Accreditation.svg' %}
|
||||
{% assign product_alt = 'Anthology Accreditation' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#0090A1' %}
|
||||
{% assign color_light = '#1BA8E1' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology 101' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#573376' %}
|
||||
{% assign color_light = '#7F59A5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Academy Use & Navigation' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#6283C2' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Data Strategy' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#573376' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Faculty Development' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#7F59A5' %}
|
||||
{% assign color_light = '#AA7FB8' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Power BI' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#573376' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Professional Development' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% else %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#DCE4E9' %}
|
||||
{% assign color_dark = '#747A7B' %}
|
||||
{% assign color_light = '#B2B7BA' %}
|
||||
{% endif %}
|
||||
|
||||
{% unless flag == 'dashboard' %}
|
||||
{% assign flag = '' %}
|
||||
{% endunless %}
|
||||
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
{% assign act_count = 0 %}
|
||||
{% for section in course.sections %}
|
||||
{% for activity in section.activities %}
|
||||
{% assign act_count = act_count | plus : 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
{% assign allCats = '' %}
|
||||
{% for category in course.categories %}
|
||||
{% assign allCats = allCats | append: category.name | append: ' || '%}
|
||||
{% endfor %}
|
||||
|
||||
|
||||
<div class="np-card course-card">
|
||||
<div class="np-progress-bar-container" style="background: {{ color_light }}">
|
||||
<div
|
||||
style="width: 75%; background: {{ color_dark }}"
|
||||
class="np-button-background-color np-card-progress-bar course-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-product-banner">
|
||||
{% if product_logo != 'blank' %}
|
||||
<img src='{{ product_logo }}' alt='{{ product_alt }}' class="product-logo"/>
|
||||
{% else %}
|
||||
Anthology
|
||||
{% endif %}
|
||||
</div>
|
||||
{% comment %} <div class="np-card-container">
|
||||
<div class="card-image-replacement"></div>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding course-card-info">
|
||||
<div class="np-flex-1">
|
||||
<h3 class="np-card-content-title course-card-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="card-bottom-details">
|
||||
{% if flag == 'dashboard' %}
|
||||
<div style="
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
padding-left: 15px;
|
||||
width: 70%;">
|
||||
<div style="
|
||||
background: #BACCE9;
|
||||
border-radius: 10px;
|
||||
height: 8px;
|
||||
margin-right: 15px;
|
||||
width: 60%;
|
||||
">
|
||||
<div
|
||||
style="height: 8px; background: {{ color_main }}; border-radius: 10px; width: {{ course.progress }}%; "
|
||||
class="np-button-background-color np-card-progress-bar course-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<span style="color: #757575; font-size: 14px">
|
||||
{% assign act_count = 0 %}
|
||||
{% for section in course.sections %}
|
||||
{% for activity in section.activities %}
|
||||
{% assign act_count = act_count| plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{{ act_count }} {% if act_count == 1 %}Activity{% else %}Activities{% endif %}
|
||||
</span>
|
||||
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
{% if course.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
<a class="np-button np-button-wide course-card-button"
|
||||
{% if course.properties.video_on_demand == true %}
|
||||
{% if course.enrolled? %}
|
||||
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
{% else %}
|
||||
href="{{ course_path }}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
View
|
||||
{% endif %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div> {% endcomment %}
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="card-image-replacement"></div>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding course-card-info">
|
||||
<div class="np-flex-1">
|
||||
<h3 class="np-card-content-title course-card-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-bottom-details">
|
||||
{% if flag == 'dashboard' %}
|
||||
<div style="
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
padding-left: 15px;
|
||||
width: 70%;">
|
||||
<div style="
|
||||
background: #BACCE9;
|
||||
border-radius: 10px;
|
||||
height: 8px;
|
||||
margin-right: 15px;
|
||||
width: 60%;
|
||||
">
|
||||
<div
|
||||
style="height: 8px; background: {{ color_main }}; border-radius: 10px; width: {{ course.progress }}%; "
|
||||
class="np-button-background-color np-card-progress-bar course-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<span style="color: #757575; font-size: 14px">
|
||||
{% assign act_count = 0 %}
|
||||
{% for section in course.sections %}
|
||||
{% for activity in section.activities %}
|
||||
{% assign act_count = act_count| plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{{ act_count }} {% if act_count == 1 %}Activity{% else %}Activities{% endif %}
|
||||
</span>
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
<a class="np-button np-button-wide course-card-button"
|
||||
{% if course.properties.video_on_demand == true %}
|
||||
{% if course.enrolled? %}
|
||||
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
{% else %}
|
||||
href="{{ course_path }}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
View
|
||||
{% endif %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{% comment %} <style>
|
||||
.course-card-wrapper{
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.course-card{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.card-product-banner{
|
||||
align-items: center;
|
||||
background: #FFF;
|
||||
box-shadow: 0 3px 30px rgba(0,0,0,.1);
|
||||
display: flex;
|
||||
height: 32px;
|
||||
overflow: hidden;
|
||||
padding: 6px 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.product-logo{
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.course-card-info{
|
||||
height: 100%;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.course-card-title{
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
line-height: 25px;
|
||||
margin-top: 8px !important;
|
||||
}
|
||||
|
||||
.course-card-button{
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
height: 100%;
|
||||
line-height: 21px;
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.course-card-button:focus{
|
||||
border: 2px solid blue;
|
||||
}
|
||||
|
||||
.np-progress-bar-container,
|
||||
.np-card-progress-bar{
|
||||
border-radius: 0;
|
||||
height: 6px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.np-card-content-progress{
|
||||
height: 25px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.course-card-progress-bar{
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.np-card-content-progress{
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px){
|
||||
.course-card-wrapper{
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.course-card{
|
||||
height: 100%;
|
||||
margin-bottom: 0;
|
||||
padding: 0 10px !important;
|
||||
}
|
||||
}
|
||||
</style> {% endcomment %}
|
||||
|
||||
<style>
|
||||
.course-card .np-card-container{
|
||||
padding: 8px 12px 8px 8px;
|
||||
}
|
||||
|
||||
.card-product-banner{
|
||||
align-items: center;
|
||||
background: #FFF;
|
||||
box-shadow: 0 3px 30px rgba(0,0,0,.1);
|
||||
display: flex;
|
||||
height: 32px;
|
||||
overflow: hidden;
|
||||
padding: 6px 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.product-logo{
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.card-image-replacement{
|
||||
background: linear-gradient(325deg, rgba(255,255,255,1) 0%, rgb(225 235 343 / 30%) 60%);
|
||||
height: 12rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 550px) and (max-width: 649px){
|
||||
.card-image-replacement{
|
||||
height: 15rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 650px) and (max-width: 767px){
|
||||
.card-image-replacement{
|
||||
height: 20rem;
|
||||
}
|
||||
}
|
||||
|
||||
.course-card-info{
|
||||
height: calc(100% - 38px);
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: unset;
|
||||
}
|
||||
|
||||
.course-card-title{
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
line-height: 25px;
|
||||
margin-top: 8px !important;
|
||||
}
|
||||
|
||||
.course-card-button{
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
height: 100%;
|
||||
line-height: 21px;
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.course-card-button:focus{
|
||||
border: 2px solid blue;
|
||||
}
|
||||
|
||||
.np-progress-bar-container,
|
||||
.np-card-progress-bar{
|
||||
border-radius: 0;
|
||||
height: 6px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.np-card-content-progress{
|
||||
height: 25px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.course-card-progress-bar{
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.np-card-content-progress{
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.card-bottom-details{
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px){
|
||||
/* .np-card{
|
||||
margin-bottom: 15px !important;
|
||||
min-width: unset;
|
||||
} */
|
||||
|
||||
.course-card .np-card-container{
|
||||
padding: 16px 24px 16px 16px;
|
||||
}
|
||||
|
||||
.course-card-wrapper{
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.course-card{
|
||||
padding: 0 10px !important;
|
||||
}
|
||||
|
||||
.course-card-wrapper,
|
||||
.course-card{
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,93 +0,0 @@
|
||||
<div class="np-filter" tabindex="0">
|
||||
<div class="dropdown">
|
||||
<select
|
||||
class="category-filter-dropdown np-input"
|
||||
type="text"
|
||||
name="category-filter-dropdown"
|
||||
id="category-filter-dropdown"
|
||||
onchange="filterByCategory()"
|
||||
>
|
||||
{% assign sorted_categories = current_school.filterable_categories | sort: "name" %}
|
||||
<option class="category-filter-entry" value="Default" selected>All Categories</option>
|
||||
|
||||
{% for category in sorted_categories %}
|
||||
{% assign renderCat = false %}
|
||||
|
||||
{% for course in courses.enrolled %}
|
||||
{% for course_category in course.categories %}
|
||||
{% if course_category.id == category.id %}
|
||||
{% assign renderCat = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
{% comment %} Need to iterate over all filterable categories, target all searched cards, check if cat exists, render if found {% endcomment %}
|
||||
|
||||
{% comment %} Need to generate category entires dynamically? Might not be possible because liquid is server side. Would need to pull all cats before load but all Searched Results after render {% endcomment %}
|
||||
|
||||
{%if renderCat %}
|
||||
<option class="category-filter-entry" value="{{ category.name }}">{{ category.name }}</option>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('document').ready(function(){
|
||||
let allCategoryFilters = document.querySelectorAll('.category-filter-entry');
|
||||
let allSearchedResults = document.querySelectorAll('.course-card');
|
||||
for(let i = 1; i < allCategoryFilters.length; i++){
|
||||
let catFound = false;
|
||||
for(let j = 0; j < allSearchedResults.length; j++){
|
||||
|
||||
if(allSearchedResults[j].dataset.categories.indexOf(allCategoryFilters[i].getAttribute('value')) > -1){
|
||||
catFound = true;
|
||||
}
|
||||
}
|
||||
|
||||
if(!catFound){
|
||||
// if(allCategoryFilters[i].textContent != 'All Categories'){
|
||||
// allCategoryFilters[i].style.display = 'none';
|
||||
// }
|
||||
allCategoryFilters[i].style.display = 'none';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
let filterByCategory = () => {
|
||||
// console.log(event.target.value);
|
||||
|
||||
let allLearning = document.querySelector('.np-catalog-courses').children;
|
||||
|
||||
// console.log(allLearning);
|
||||
|
||||
for(let i = 0; i < allLearning.length; i++){
|
||||
if(event.target.value == 'Default'){
|
||||
// if(!allLearning[i].classList.contains('hidden-by-search')){
|
||||
// allLearning[i].style.display = 'block';
|
||||
// }
|
||||
|
||||
if(!allLearning[i].classList.contains('hidden-by-product')){
|
||||
allLearning[i].style.display = 'block';
|
||||
}
|
||||
allLearning[i].classList.remove('filtered');
|
||||
} else {
|
||||
console.log(allLearning[i].dataset)
|
||||
if(allLearning[i].dataset.categories.indexOf(event.target.value) == -1){
|
||||
allLearning[i].style.display = 'none';
|
||||
allLearning[i].classList.add('filtered');
|
||||
} else {
|
||||
// if(!allLearning[i].classList.contains('hidden-by-search')){
|
||||
// allLearning[i].style.display = 'block';
|
||||
// }
|
||||
|
||||
if(!allLearning[i].classList.contains('hidden-by-product')){
|
||||
allLearning[i].style.display = 'block';
|
||||
}
|
||||
allLearning[i].classList.remove('filtered');
|
||||
};
|
||||
};
|
||||
};
|
||||
}
|
||||
</script>
|
||||
@ -1,183 +0,0 @@
|
||||
<div class="np-filter product-filter-container">
|
||||
<div class="dropdown">
|
||||
<select
|
||||
class="product-filter-dropdown np-input"
|
||||
type="text"
|
||||
name="product-filter-dropdown"
|
||||
id="product-filter-dropdown"
|
||||
onchange="filterByProduct()"
|
||||
>
|
||||
<option class="product-filter-entry" value="Default" selected>All Products</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let allProductTypesHome = ['Anthology-Default'];
|
||||
let allProductTypesDash = ['Anthology-Default'];
|
||||
let productFilterEl = document.querySelector("#product-filter-dropdown");
|
||||
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 0 or course.properties.most_popular == true %}
|
||||
if('{{ course.properties.product_names_for_course_cards }}' != 'Anthology [Catch-all]'){
|
||||
if(!allProductTypesHome.includes('{{ course.properties.product_names_for_course_cards }}')){
|
||||
allProductTypesHome.push("{{ course.properties.product_names_for_course_cards }}");
|
||||
}
|
||||
}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% for course in courses.enrolled %}
|
||||
{% unless course.progress == 0 %}
|
||||
if('{{ course.properties.product_names_for_course_cards }}' != 'Anthology [Catch-all]'){
|
||||
if(!allProductTypesDash.includes('{{ course.properties.product_names_for_course_cards }}')){
|
||||
allProductTypesDash.push("{{ course.properties.product_names_for_course_cards }}");
|
||||
}
|
||||
}
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
|
||||
allProductTypesHome = allProductTypesHome.sort();
|
||||
allProductTypesDash = allProductTypesDash.sort();
|
||||
|
||||
{% if page == 'Homepage' or page == 'Search' %}
|
||||
if(allProductTypesHome.length > 1){
|
||||
allProductTypesHome.map((product) => {
|
||||
if(product != 'Anthology-Default'){
|
||||
if(product.indexOf('&') > -1){
|
||||
product = product.replaceAll('&', '&');
|
||||
}
|
||||
let productOption = document.createElement('option');
|
||||
productOption.classList.add('product-filter-entry');
|
||||
productOption.setAttribute('value', product);
|
||||
//productionOption.setAttribute('href', `/search/23777883-6b85-449d-8d25-2e548c6e9ecc?q=${product}`);
|
||||
productOption.innerHTML = `${product}`;
|
||||
productFilterEl.appendChild(productOption);
|
||||
}
|
||||
})
|
||||
} else {
|
||||
productFilterEl.style.display = 'none';
|
||||
}
|
||||
|
||||
let filterByProduct = () => {
|
||||
let allLearning = document.querySelector('.np-catalog-courses').children;
|
||||
|
||||
for(let i = 0; i < allLearning.length; i++){
|
||||
if(event.target.value == 'Default'){
|
||||
// if(!allLearning[i].classList.contains('hidden-by-search')){
|
||||
// allLearning[i].style.display = 'block';
|
||||
// }
|
||||
|
||||
allLearning[i].style.display = 'block';
|
||||
allLearning[i].classList.remove('hidden-by-product');
|
||||
allLearning[i].classList.remove('filtered');
|
||||
} else {
|
||||
if(allLearning[i].dataset.product != event.target.value){
|
||||
allLearning[i].style.display = 'none';
|
||||
allLearning[i].classList. add('hidden-by-product');
|
||||
allLearning[i].classList.add('filtered');
|
||||
} else {
|
||||
// if(!allLearning[i].classList.contains('hidden-by-search')){
|
||||
// allLearning[i].style.display = 'block';
|
||||
// }
|
||||
allLearning[i].style.display = 'block';
|
||||
allLearning[i].classList.remove('hidden-by-product');
|
||||
allLearning[i].classList.remove('filtered');
|
||||
};
|
||||
};
|
||||
|
||||
console.log($("#product-filter-dropdown > option:selected").text());
|
||||
|
||||
|
||||
|
||||
let allCategoryFiltersProduct = document.querySelectorAll('.category-filter-entry');
|
||||
let allSearchedResultsProduct = document.querySelectorAll('.course-card');
|
||||
|
||||
for(let i = 1; i < allCategoryFiltersProduct.length; i++){
|
||||
allCategoryFiltersProduct[i].style.display = 'block';
|
||||
}
|
||||
|
||||
for(let i = 1; i < allCategoryFiltersProduct.length; i++){
|
||||
let catFound = false;
|
||||
|
||||
for(let j = 0; j < allSearchedResultsProduct.length; j++){
|
||||
|
||||
if(allSearchedResultsProduct[j].dataset.categories.indexOf(allCategoryFiltersProduct[i].getAttribute('value')) > -1){
|
||||
if(allSearchedResultsProduct[j].style.display == 'block'){
|
||||
catFound = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(!catFound){
|
||||
allCategoryFiltersProduct[i].style.display = 'none';
|
||||
} else {
|
||||
allCategoryFiltersProduct[i].style.display = 'block';
|
||||
}
|
||||
|
||||
$('#category-filter-dropdown > option:nth-child(1)').attr('selected', true);
|
||||
|
||||
// Last step is to return cat dropdown to always be all cats on product selection
|
||||
// This will prevent cats that shouldnt be present from remaining selected
|
||||
|
||||
// $('#category-filter-dropdown > option:nth-child(1)').text('All Categories');
|
||||
$('#category-filter-dropdown').val('Default');
|
||||
}
|
||||
};
|
||||
}
|
||||
{% elsif page == 'Dashboard' %}
|
||||
if(allProductTypesDash.length > 1){
|
||||
allProductTypesDash.map((product) => {
|
||||
if(product != 'Anthology-Default'){
|
||||
if(product.indexOf('&') > -1){
|
||||
product = product.replace('&', '&');
|
||||
}
|
||||
let productOption = document.createElement('option');
|
||||
productOption.classList.add('product-filter-entry');
|
||||
productOption.setAttribute('value', product)
|
||||
productOption.innerHTML = `${product}`;
|
||||
|
||||
productFilterEl.appendChild(productOption);
|
||||
}
|
||||
})
|
||||
} else {
|
||||
productFilterEl.style.display = 'none';
|
||||
document.querySelector('.view-swapper-container').style.marginBottom = '0';
|
||||
}
|
||||
|
||||
let filterByProduct = () => {
|
||||
let inProgressCourses = document.querySelector('.courses-in-prog').children;
|
||||
let completedCourses = document.querySelector('.courses-completed').children;
|
||||
|
||||
for(let i = 0; i < inProgressCourses.length; i++){
|
||||
if(event.target.value == 'Default'){
|
||||
inProgressCourses[i].style.display = 'block';
|
||||
} else {
|
||||
if(inProgressCourses[i].dataset.product != event.target.value){
|
||||
inProgressCourses[i].style.display = 'none';
|
||||
} else {
|
||||
inProgressCourses[i].style.display = 'block';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for(let i = 0; i < completedCourses.length; i++){
|
||||
if(event.target.value == 'Default'){
|
||||
completedCourses[i].style.display = 'block';
|
||||
} else {
|
||||
if(completedCourses[i].dataset.product != event.target.value){
|
||||
completedCourses[i].style.display = 'none';
|
||||
} else {
|
||||
completedCourses[i].style.display = 'block';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
{% endif %}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.filtered{
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,260 +0,0 @@
|
||||
{% if course.properties.product_names_for_course_cards == 'Anthology Reach' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Reach.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Radius' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F3798A' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Engage' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Engage.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F16423' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Beacon' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Beacon.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F16423' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Milestone' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Milestone.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F3798A' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Occupation Insight' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Occupation+Insight.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F58545' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Raise' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Raise.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Digital Assistant' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Digital+Assistant.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Baseline' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Baseline.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#D94827' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Encompass' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Encompass.svg' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Talisma' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Student' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Student.svg' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#96CA51' %}
|
||||
{% assign color_light = '#F3E588' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'CVue' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#286734' %}
|
||||
{% assign color_light = '#F3E588' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Insight' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Insight.svg' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#286734' %}
|
||||
{% assign color_light = '#82C342' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Finance & HCM' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Finance+%26+HCM.svg' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#539542' %}
|
||||
{% assign color_light = '#C9BD2E' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Payroll' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Payroll.svg' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#82C342' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Academic Economics' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Academic+Economics.svg' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#286734' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Blackboard Learn' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/BBLearn.svg' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#1BA8E1' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Ally' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Ally.svg' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#1BA8E1' %}
|
||||
{% assign color_light = '#A3DBDC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Course Evaluations' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Course+Evaluations.svg' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#004C6D' %}
|
||||
{% assign color_light = '#027BB6' %}
|
||||
{%- comment -%} NEED DIFF IMG FORMAT FOR THIS ONE {%- endcomment -%}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Evaluate' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#A3DBDC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Portfolio' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Portfolio.svg' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#0090A1' %}
|
||||
{% assign color_light = '#5CC6CC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Program Review' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Program+Review.svg' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#5CC6CC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Planning' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Planning.svg' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#004C6D' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Accreditation' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Accreditation.svg' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#0090A1' %}
|
||||
{% assign color_light = '#1BA8E1' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology 101' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#573376' %}
|
||||
{% assign color_light = '#7F59A5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Academy Use & Navigation' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#6283C2' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Data Strategy' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#573376' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Faculty Development' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#7F59A5' %}
|
||||
{% assign color_light = '#AA7FB8' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Power BI' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#573376' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Professional Development' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% else %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#DCE4E9' %}
|
||||
{% assign color_dark = '#747A7B' %}
|
||||
{% assign color_light = '#B2B7BA' %}
|
||||
{% endif %}
|
||||
|
||||
<div class="np-card-container">
|
||||
<div class="np-resource-header np-course-header np-card-padding-large">
|
||||
{% include "course_header" %}
|
||||
</div>
|
||||
<div class="np-divider"></div>
|
||||
<div class="row np-course-content np-card-padding-dynamic">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
{%- comment -%} <div class="np-progress-bar-container" style="background: {{ color_light }}; border-radius: 0;">
|
||||
<div
|
||||
style="width: {{ course.progress }}%; background: {{ color_dark }}"
|
||||
class="np-button-background-color np-card-progress-bar course-card-progress-bar">
|
||||
</div>
|
||||
</div> {%- endcomment -%}
|
||||
<div class="product-banner">
|
||||
{% if product_logo != 'blank' %}
|
||||
<img src='{{ product_logo }}' class="product-logo" style="height: 36px;"/>
|
||||
{% else %}
|
||||
Anthology
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-top-image np-top-image-spacing course-image-replacement" style="border-radius: 0;">
|
||||
<div class="course-cover-info">
|
||||
<div class="np-flex-1">
|
||||
<h3 class="course-cover-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
{% assign act_count = 0 %}
|
||||
{% for section in course.sections %}
|
||||
{% for activity in section.activities %}
|
||||
{% assign act_count = act_count| plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
<span style="color: #757575; font-size: 18px">
|
||||
{{ act_count }} {% if act_count == 1 %}Activity{% else %}Activities{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
{% if course.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{%- comment -%} <img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/> {%- endcomment -%}
|
||||
{% include "course_description" %}
|
||||
|
||||
{% if course.categories.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_categories" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.instructors.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_instructors" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.events.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_events" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-6">
|
||||
<div class="np-top-cta">
|
||||
{% include "course_progress_and_cta" %}
|
||||
</div>
|
||||
{% include "course_outline" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.course-image-replacement{
|
||||
/* background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(225,235,243,1) 60%); */
|
||||
background: linear-gradient(325deg, rgba(255,255,255,1) 0%, rgb(225 235 343 / 30%) 60%);
|
||||
}
|
||||
|
||||
.course-cover-title{
|
||||
font-size: 2em;
|
||||
line-height: 45px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.course-cover-info{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 25em;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
@ -1,185 +1,102 @@
|
||||
{% if course.properties.product_names_for_course_cards == 'Anthology Reach' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Reach.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Reach.png' %}
|
||||
{% assign product_alt = 'Anthology Reach' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Radius' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F3798A' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Engage' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Engage.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Engage.png' %}
|
||||
{% assign product_alt = 'Anthology Engage' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F16423' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Beacon' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Beacon.svg' %}
|
||||
{% assign product_alt = 'Anthology Beacon' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F16423' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Milestone' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Milestone.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Milestone.png' %}
|
||||
{% assign product_alt = 'Anthology Milestone' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F3798A' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Occupation Insight' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Occupation+Insight.svg' %}
|
||||
{% assign product_alt = 'Anthology Occupation Insight' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#F58545' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Raise' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Raise.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Raise.png' %}
|
||||
{% assign product_alt = 'Anthology Raise' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F9B5B5' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Digital Assistant' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Digital+Assistant.svg' %}
|
||||
{% assign product_alt = 'Anthology Digital Assistant' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F58545' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Baseline' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Baseline.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Baseline.png' %}
|
||||
{% assign product_alt = 'Anthology Baseline' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#D94827' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Encompass' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Encompass.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Encompass.png' %}
|
||||
{% assign product_alt = 'Anthology Encompass' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#731013' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Talisma' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#F06A32' %}
|
||||
{% assign color_dark = '#D94827' %}
|
||||
{% assign color_light = '#F3798A' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Student' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Student.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Student.png' %}
|
||||
{% assign product_alt = 'Anthology Student' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#96CA51' %}
|
||||
{% assign color_light = '#F3E588' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'CVue' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#286734' %}
|
||||
{% assign color_light = '#F3E588' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Insight' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Insight.svg' %}
|
||||
{% assign product_alt = 'Anthology Insight' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#286734' %}
|
||||
{% assign color_light = '#82C342' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Finance & HCM' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Finance+%26+HCM.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_FinanceHCM.png' %}
|
||||
{% assign product_alt = 'Anthology Finance & HCM' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#539542' %}
|
||||
{% assign color_light = '#C9BD2E' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Payroll' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Payroll.svg' %}
|
||||
{% assign product_alt = 'Anthology Payroll' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#82C342' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Academic Economics' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Academic+Economics.svg' %}
|
||||
{% assign product_alt = 'Anthology Academic Economics' %}
|
||||
{% assign color_main = '#82C342' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#286734' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Blackboard' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/BBLearn.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Blackboard.png' %}
|
||||
{% assign product_alt = 'Blackboard' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#1BA8E1' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Ally' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Ally.svg' %}
|
||||
{% assign product_alt = 'Anthology Ally' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#1BA8E1' %}
|
||||
{% assign color_light = '#A3DBDC' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Course Evaluations' %}
|
||||
{% assign product_logo = 'https://s3.amazonaws.com/static.northpass.com/anthology/Course+Evaluations.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_CourseEvaluation.png' %}
|
||||
{% assign product_alt = 'Anthology Course Evaluations' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#004C6D' %}
|
||||
{% assign color_light = '#027BB6' %}
|
||||
{%- comment -%} NEED DIFF IMG FORMAT FOR THIS ONE {%- endcomment -%}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Evaluate' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#A3DBDC' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Evaluate.png' %}
|
||||
{% assign product_alt = 'Anthology Evaluate' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Portfolio' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Portfolio.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Portfolio.png' %}
|
||||
{% assign product_alt = 'Anthology Portfolio' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#0090A1' %}
|
||||
{% assign color_light = '#5CC6CC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Program Review' %}
|
||||
{% assign product_logo = 'https://s3.amazonaws.com/static.northpass.com/anthology/Program+Review.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_ProgramReview.png' %}
|
||||
{% assign product_alt = 'Anthology Program Review' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#027BB6' %}
|
||||
{% assign color_light = '#5CC6CC' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Planning' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Planning.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Planning.png' %}
|
||||
{% assign product_alt = 'Anthology Planning' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#004C6D' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Accreditation' %}
|
||||
{% assign product_logo = 'https://cdn.northpass.io/anthology/Accreditation.svg' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Accreditation.png' %}
|
||||
{% assign product_alt = 'Anthology Accreditation' %}
|
||||
{% assign color_main = '#1BA8E1' %}
|
||||
{% assign color_dark = '#0090A1' %}
|
||||
{% assign color_light = '#1BA8E1' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Outcomes' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Outcomes.png' %}
|
||||
{% assign product_alt = 'Anthology Outcomes' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology 101' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#573376' %}
|
||||
{% assign color_light = '#7F59A5' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Anthology101.png' %}
|
||||
{% assign product_alt = 'Anthology 101' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Academy Use & Navigation' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#6283C2' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Data Strategy' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#573376' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Faculty Development' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#7F59A5' %}
|
||||
{% assign color_light = '#AA7FB8' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Power BI' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#573376' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_PowerBI.png' %}
|
||||
{% assign product_alt = 'Power BI' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Professional Development' %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#7F59A5' %}
|
||||
{% assign color_dark = '#000000' %}
|
||||
{% assign color_light = '#87ADDB' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_ProfesionalLearning.png' %}
|
||||
{% assign product_alt = 'Professional Learning' %}
|
||||
{% else %}
|
||||
{% assign product_logo = 'blank' %}
|
||||
{% assign color_main = '#DCE4E9' %}
|
||||
{% assign color_dark = '#747A7B' %}
|
||||
{% assign color_light = '#B2B7BA' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% endif %}
|
||||
|
||||
{% unless flag == 'dashboard' %}
|
||||
@ -200,35 +117,41 @@
|
||||
{% endfor %}
|
||||
|
||||
|
||||
<div class="np-card course-card" data-product="{{course.properties.product_names_for_course_cards}}" data-categories="{{ allCats }}">
|
||||
{% comment %} <div class="np-card course-card" data-product="{{course.properties.product_names_for_course_cards}}" data-categories="{{ allCats }}"> {% endcomment %}
|
||||
<div class="np-card course-card">
|
||||
{%- comment -%} {% unless flag == 'catalog' %}
|
||||
{% endunless %} {%- endcomment -%}
|
||||
<div class="np-progress-bar-container" style="background: {{ color_light }}">
|
||||
<div
|
||||
<div class="np-progress-bar-container">{% comment %} style="background: {{ color_light }}" {% endcomment %}
|
||||
{% comment %} <div
|
||||
style="width: 75%; background: {{ color_dark }}"
|
||||
class="np-button-background-color np-card-progress-bar course-card-progress-bar">
|
||||
</div>
|
||||
</div> {% endcomment %}
|
||||
</div>
|
||||
<div class="card-product-banner">
|
||||
{% comment %} <div class="card-product-banner">
|
||||
{% if product_logo != 'blank' %}
|
||||
<img src='{{ product_logo }}' alt='{{ product_alt }}' class="product-logo"/>
|
||||
{% else %}
|
||||
Anthology
|
||||
{% endif %}
|
||||
</div>
|
||||
</div> {% endcomment %}
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="card-image-replacement"></div>
|
||||
{% comment %} <div class="card-image-replacement"></div> {% endcomment %}
|
||||
{%- comment -%} <img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
> {%- endcomment -%}
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding course-card-info">
|
||||
{% if product_logo != 'blank' %}
|
||||
<img src='{{ product_logo }}' alt='{{ product_alt }}' class="product-logo-banner"/>
|
||||
{% else %}
|
||||
<img src='https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' alt='Anthology' class="product-logo-banner"/>
|
||||
{% endif %}
|
||||
<div class="np-flex-1">
|
||||
<h3 class="np-card-content-title course-card-title">
|
||||
{{ course.name }}
|
||||
@ -249,7 +172,7 @@
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-bottom-details">
|
||||
{% if flag == 'dashboard' %}<div class="card-bottom-details">{% else %}<div class="card-bottom-details card-bottom-details-plain">{% endif %}
|
||||
{% if flag == 'dashboard' %}
|
||||
<div style="
|
||||
align-items: center;
|
||||
@ -278,9 +201,9 @@
|
||||
{%- comment -%} <div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div> {%- endcomment -%}
|
||||
<div style="padding-left: 15px">
|
||||
{%- comment -%} {{course.properties.course_duration}} duration {%- endcomment -%}
|
||||
</div>
|
||||
{%- comment -%} <div style="padding-left: 15px">
|
||||
{{course.properties.course_duration}} duration
|
||||
</div> {%- endcomment -%}
|
||||
{% endif %}
|
||||
<a class="np-button np-button-wide course-card-button"
|
||||
{% if course.properties.video_on_demand == true %}
|
||||
@ -305,6 +228,12 @@
|
||||
|
||||
|
||||
<style>
|
||||
.np-card-ribbon {
|
||||
background: #0054bc !important;
|
||||
border: 1px solid #07a9cb;
|
||||
z-index: 99999999;
|
||||
padding: 5px !important;
|
||||
}
|
||||
.card-product-banner{
|
||||
align-items: center;
|
||||
background: #FFF;
|
||||
@ -316,10 +245,47 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.product-logo{
|
||||
.product-logo {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.product-logo-banner {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.np-flex-1 {
|
||||
padding: 10px 20px 20px;
|
||||
}
|
||||
|
||||
.np-catalog-courses {
|
||||
display: grid !important;
|
||||
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1000px) {
|
||||
.np-catalog-courses {
|
||||
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
.np-catalog-courses {
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
.np-catalog-courses .col-lg-4,
|
||||
.np-catalog-courses .col-sm-6 {
|
||||
max-width: 100% !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.np-max-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-image-replacement{
|
||||
/* background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(225,235,243,1) 60%); */
|
||||
background: linear-gradient(325deg, rgba(255,255,255,1) 0%, rgb(225 235 343 / 30%) 60%);
|
||||
@ -340,10 +306,12 @@
|
||||
}
|
||||
|
||||
.course-card-info{
|
||||
height: calc(100% - 38px);
|
||||
max-height: 100% !important;
|
||||
height: auto; /*calc(100% - 38px);*/
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
position: relative;
|
||||
top: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.course-card-title{
|
||||
@ -369,8 +337,9 @@
|
||||
.np-progress-bar-container,
|
||||
.np-card-progress-bar{
|
||||
border-radius: 0;
|
||||
height: 6px;
|
||||
height: 3px;
|
||||
margin: 0;
|
||||
background: linear-gradient(81.13deg, #0054bc 45.35%, #0dac14 94.86%);
|
||||
}
|
||||
|
||||
.np-card-content-progress{
|
||||
@ -388,15 +357,34 @@
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.np-card-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.card-bottom-details-plain {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.card-bottom-details-plain .course-card-button {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background-color: #0054bc;
|
||||
}
|
||||
|
||||
.card-bottom-details-plain .course-card-button:hover {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px){
|
||||
.course-card-wrapper{
|
||||
margin-bottom: 32px;
|
||||
/* max-height: 315px;
|
||||
/* margin-bottom: 32px;
|
||||
max-height: 315px;
|
||||
max-width: 445px; */
|
||||
}
|
||||
|
||||
.course-card{
|
||||
padding: 0 10px !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.course-card-wrapper,
|
||||
@ -0,0 +1,395 @@
|
||||
{% if course.properties.product_names_for_course_cards == 'Anthology Reach' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Reach.png' %}
|
||||
{% assign product_alt = 'Anthology Reach' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Radius' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Engage' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Engage.png' %}
|
||||
{% assign product_alt = 'Anthology Engage' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Beacon' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Milestone' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Milestone.png' %}
|
||||
{% assign product_alt = 'Anthology Milestone' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Occupation Insight' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Raise' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Raise.png' %}
|
||||
{% assign product_alt = 'Anthology Raise' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Digital Assistant' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Baseline' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Baseline.png' %}
|
||||
{% assign product_alt = 'Anthology Baseline' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Encompass' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Encompass.png' %}
|
||||
{% assign product_alt = 'Anthology Encompass' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Talisma' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Student' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Student.png' %}
|
||||
{% assign product_alt = 'Anthology Student' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'CVue' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Insight' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Finance & HCM' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_FinanceHCM.png' %}
|
||||
{% assign product_alt = 'Anthology Finance & HCM' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Payroll' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Academic Economics' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Blackboard' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Blackboard.png' %}
|
||||
{% assign product_alt = 'Blackboard' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Ally' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Course Evaluations' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_CourseEvaluation.png' %}
|
||||
{% assign product_alt = 'Anthology Course Evaluations' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Evaluate' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Evaluate.png' %}
|
||||
{% assign product_alt = 'Anthology Evaluate' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Portfolio' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Portfolio.png' %}
|
||||
{% assign product_alt = 'Anthology Portfolio' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Program Review' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_ProgramReview.png' %}
|
||||
{% assign product_alt = 'Anthology Program Review' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Planning' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Planning.png' %}
|
||||
{% assign product_alt = 'Anthology Planning' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Accreditation' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Accreditation.png' %}
|
||||
{% assign product_alt = 'Anthology Accreditation' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Outcomes' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Outcomes.png' %}
|
||||
{% assign product_alt = 'Anthology Outcomes' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology 101' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Anthology101.png' %}
|
||||
{% assign product_alt = 'Anthology 101' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Academy Use & Navigation' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Data Strategy' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Faculty Development' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Power BI' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_PowerBI.png' %}
|
||||
{% assign product_alt = 'Power BI' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Professional Development' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_ProfesionalLearning.png' %}
|
||||
{% assign product_alt = 'Professional Learning' %}
|
||||
{% else %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% endif %}
|
||||
|
||||
{% unless flag == 'dashboard' %}
|
||||
{% assign flag = '' %}
|
||||
{% endunless %}
|
||||
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
{% assign act_count = 0 %}
|
||||
{% for section in course.sections %}
|
||||
{% for activity in section.activities %}
|
||||
{% assign act_count = act_count | plus : 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
{% assign allCats = '' %}
|
||||
{% for category in course.categories %}
|
||||
{% assign allCats = allCats | append: category.name | append: ' || '%}
|
||||
{% endfor %}
|
||||
|
||||
|
||||
{% comment %} <div class="np-card course-card" data-product="{{course.properties.product_names_for_course_cards}}" data-categories="{{ allCats }}"> {% endcomment %}
|
||||
<div class="np-card course-card">
|
||||
{%- comment -%} {% unless flag == 'catalog' %}
|
||||
{% endunless %} {%- endcomment -%}
|
||||
<div class="np-progress-bar-container">{% comment %} style="background: {{ color_light }}" {% endcomment %}
|
||||
{% comment %} <div
|
||||
style="width: 75%; background: {{ color_dark }}"
|
||||
class="np-button-background-color np-card-progress-bar course-card-progress-bar">
|
||||
</div> {% endcomment %}
|
||||
</div>
|
||||
{% comment %} <div class="card-product-banner">
|
||||
{% if product_logo != 'blank' %}
|
||||
<img src='{{ product_logo }}' alt='{{ product_alt }}' class="product-logo"/>
|
||||
{% else %}
|
||||
Anthology
|
||||
{% endif %}
|
||||
</div> {% endcomment %}
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% comment %} <div class="card-image-replacement"></div> {% endcomment %}
|
||||
{%- comment -%} <img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
> {%- endcomment -%}
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding course-card-info">
|
||||
{% if product_logo != 'blank' %}
|
||||
<img src='{{ product_logo }}' alt='{{ product_alt }}' class="product-logo-banner"/>
|
||||
{% else %}
|
||||
<img src='https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' alt='Anthology' class="product-logo-banner"/>
|
||||
{% endif %}
|
||||
<div class="np-flex-1">
|
||||
<h3 class="np-card-content-title course-card-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
{% assign act_count = 0 %}
|
||||
{% for section in course.sections %}
|
||||
{% for activity in section.activities %}
|
||||
{% assign act_count = act_count| plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
<span style="color: #757575; font-size: 14px">
|
||||
{{ act_count }} {% if act_count == 1 %}Activity{% else %}Activities{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
{% if course.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if flag == 'dashboard' %}<div class="card-bottom-details">{% else %}<div class="card-bottom-details card-bottom-details-plain">{% endif %}
|
||||
{% if flag == 'dashboard' %}
|
||||
<div style="
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
padding-left: 15px;
|
||||
width: 70%;">
|
||||
<div style="
|
||||
background: #BACCE9;
|
||||
border-radius: 10px;
|
||||
height: 8px;
|
||||
margin-right: 15px;
|
||||
width: 60%;
|
||||
">
|
||||
<div
|
||||
style="height: 8px; background: {{ color_main }}; border-radius: 10px; width: {{ course.progress }}%; "
|
||||
class="np-button-background-color np-card-progress-bar course-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{%- comment -%} {{course.properties.course_duration}} left {%- endcomment -%}
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
{%- comment -%} <div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div> {%- endcomment -%}
|
||||
{%- comment -%} <div style="padding-left: 15px">
|
||||
{{course.properties.course_duration}} duration
|
||||
</div> {%- endcomment -%}
|
||||
{% endif %}
|
||||
<a class="np-button np-button-wide course-card-button"
|
||||
{% if course.properties.video_on_demand == true %}
|
||||
{% if course.enrolled? %}
|
||||
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
{% else %}
|
||||
href="{{ course_path }}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
View
|
||||
{% endif %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<style>
|
||||
.np-card-ribbon {
|
||||
background: #0054bc !important;
|
||||
border: 1px solid #07a9cb;
|
||||
z-index: 99999999;
|
||||
padding: 5px !important;
|
||||
}
|
||||
.card-product-banner{
|
||||
align-items: center;
|
||||
background: #FFF;
|
||||
box-shadow: 0 3px 30px rgba(0,0,0,.1);
|
||||
display: flex;
|
||||
height: 32px;
|
||||
overflow: hidden;
|
||||
padding: 6px 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.product-logo {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.product-logo-banner {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.np-flex-1 {
|
||||
padding: 10px 20px 20px;
|
||||
}
|
||||
|
||||
.np-catalog-courses {
|
||||
display: grid !important;
|
||||
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1000px) {
|
||||
.np-catalog-courses {
|
||||
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
.np-catalog-courses {
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
.np-catalog-courses .col-lg-4,
|
||||
.np-catalog-courses .col-sm-6 {
|
||||
max-width: 100% !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.np-max-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-image-replacement{
|
||||
/* background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(225,235,243,1) 60%); */
|
||||
background: linear-gradient(325deg, rgba(255,255,255,1) 0%, rgb(225 235 343 / 30%) 60%);
|
||||
height: 12rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 550px) and (max-width: 649px){
|
||||
.card-image-replacement{
|
||||
height: 15rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 650px) and (max-width: 767px){
|
||||
.card-image-replacement{
|
||||
height: 20rem;
|
||||
}
|
||||
}
|
||||
|
||||
.course-card-info{
|
||||
max-height: 100% !important;
|
||||
height: auto; /*calc(100% - 38px);*/
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
top: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.course-card-title{
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
line-height: 25px;
|
||||
margin-top: 8px !important;
|
||||
}
|
||||
|
||||
.course-card-button{
|
||||
border-radius: 0;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
height: 100%;
|
||||
line-height: 21px;
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.course-card-button:focus{
|
||||
border: 2px solid blue;
|
||||
}
|
||||
|
||||
.np-progress-bar-container,
|
||||
.np-card-progress-bar{
|
||||
border-radius: 0;
|
||||
height: 3px;
|
||||
margin: 0;
|
||||
background: linear-gradient(81.13deg, #0054bc 45.35%, #0dac14 94.86%);
|
||||
}
|
||||
|
||||
.np-card-content-progress{
|
||||
height: 25px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.course-card-progress-bar{
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.np-card-content-progress{
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.np-card-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.card-bottom-details-plain {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.card-bottom-details-plain .course-card-button {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background-color: #0054bc;
|
||||
}
|
||||
|
||||
.card-bottom-details-plain .course-card-button:hover {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px){
|
||||
.course-card-wrapper{
|
||||
/* margin-bottom: 32px;
|
||||
max-height: 315px;
|
||||
max-width: 445px; */
|
||||
}
|
||||
|
||||
.course-card{
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.course-card-wrapper,
|
||||
.course-card{
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,223 @@
|
||||
{% if course.properties.product_names_for_course_cards == 'Anthology Reach' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Reach.png' %}
|
||||
{% assign product_alt = 'Anthology Reach' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Radius' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Engage' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Engage.png' %}
|
||||
{% assign product_alt = 'Anthology Engage' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Beacon' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Milestone' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Milestone.png' %}
|
||||
{% assign product_alt = 'Anthology Milestone' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Occupation Insight' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Raise' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Raise.png' %}
|
||||
{% assign product_alt = 'Anthology Raise' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Digital Assistant' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Baseline' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Baseline.png' %}
|
||||
{% assign product_alt = 'Anthology Baseline' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Encompass' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Encompass.png' %}
|
||||
{% assign product_alt = 'Anthology Encompass' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Talisma' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Student' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Student.png' %}
|
||||
{% assign product_alt = 'Anthology Student' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'CVue' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Insight' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Finance & HCM' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_FinanceHCM.png' %}
|
||||
{% assign product_alt = 'Anthology Finance & HCM' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Payroll' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Academic Economics' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Blackboard' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Blackboard.png' %}
|
||||
{% assign product_alt = 'Blackboard' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Ally' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Course Evaluations' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_CourseEvaluation.png' %}
|
||||
{% assign product_alt = 'Anthology Course Evaluations' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Evaluate' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Evaluate.png' %}
|
||||
{% assign product_alt = 'Anthology Evaluate' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Portfolio' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Portfolio.png' %}
|
||||
{% assign product_alt = 'Anthology Portfolio' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Program Review' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_ProgramReview.png' %}
|
||||
{% assign product_alt = 'Anthology Program Review' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Planning' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Planning.png' %}
|
||||
{% assign product_alt = 'Anthology Planning' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Accreditation' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Accreditation.png' %}
|
||||
{% assign product_alt = 'Anthology Accreditation' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology Outcomes' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Outcomes.png' %}
|
||||
{% assign product_alt = 'Anthology Outcomes' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Anthology 101' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_Anthology101.png' %}
|
||||
{% assign product_alt = 'Anthology 101' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Academy Use & Navigation' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Data Strategy' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Faculty Development' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Power BI' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_PowerBI.png' %}
|
||||
{% assign product_alt = 'Power BI' %}
|
||||
{% elsif course.properties.product_names_for_course_cards == 'Professional Development' %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology_ProfesionalLearning.png' %}
|
||||
{% assign product_alt = 'Professional Learning' %}
|
||||
{% else %}
|
||||
{% assign product_logo = 'https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' %}
|
||||
{% assign product_alt = 'Anthology' %}
|
||||
{% endif %}
|
||||
|
||||
<div class="np-card-container">
|
||||
<div class="np-resource-header np-course-header np-card-padding-large">
|
||||
{% include "course_header" %}
|
||||
</div>
|
||||
<div class="np-divider"></div>
|
||||
<div class="row np-course-content np-card-padding-dynamic">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
{%- comment -%} <div class="np-progress-bar-container" style="background: {{ color_light }}; border-radius: 0;">
|
||||
<div
|
||||
style="width: {{ course.progress }}%; background: {{ color_dark }}"
|
||||
class="np-button-background-color np-card-progress-bar course-card-progress-bar">
|
||||
</div>
|
||||
</div> {%- endcomment -%}
|
||||
<div class="product-banner">
|
||||
{% if product_logo != 'blank' %}
|
||||
<img src='{{ product_logo }}' alt='{{ product_alt }}' class="product-logo-banner"/>
|
||||
{% else %}
|
||||
<img src='https://shelves.s3.us-east-1.amazonaws.com/academy/imgs/Anthology.png' alt='Anthology' class="product-logo-banner"/>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-top-image np-top-image-spacing course-image-replacement" style="border-radius: 0;">
|
||||
<div class="course-cover-info">
|
||||
<div class="np-flex-1">
|
||||
<h3 class="course-cover-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
{% assign act_count = 0 %}
|
||||
{% for section in course.sections %}
|
||||
{% for activity in section.activities %}
|
||||
{% assign act_count = act_count| plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
<span style="color: #757575; font-size: 18px">
|
||||
{{ act_count }} {% if act_count == 1 %}Activity{% else %}Activities{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
{% if course.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{%- comment -%} <img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/> {%- endcomment -%}
|
||||
{% include "course_description" %}
|
||||
|
||||
{% if course.categories.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_categories" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.instructors.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_instructors" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.events.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_events" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-6">
|
||||
<div class="np-top-cta">
|
||||
{% include "course_progress_and_cta" %}
|
||||
</div>
|
||||
{% include "course_outline" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.course-image-replacement{
|
||||
/* background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(225,235,243,1) 60%); */
|
||||
/* background: linear-gradient(325deg, rgba(255,255,255,1) 0%, rgb(225 235 343 / 30%) 60%); */
|
||||
}
|
||||
|
||||
.course-cover-title{
|
||||
font-size: 2em;
|
||||
line-height: 45px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.product-logo-banner {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.np-course-content .np-top-cta {
|
||||
background: #0054bc10 !important;
|
||||
}
|
||||
|
||||
.np-course-content .np-button-font-color,
|
||||
.np-course-content .np-button-background-color {
|
||||
background: #0054bc !important;
|
||||
}
|
||||
|
||||
.np-course-content .np-button-font-color:hover,
|
||||
.np-course-content .np-button-font-color:focus {
|
||||
background: #000 !important;
|
||||
}
|
||||
|
||||
.np-content-categories-content-item {
|
||||
line-height: 1.25rem !important;
|
||||
padding: 15px !important;
|
||||
background: #0054bc10 !important;
|
||||
}
|
||||
|
||||
.course-cover-info{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
/* height: 25em; */
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
@ -18,9 +18,9 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if external_course_url != '' and external_course_url != null %}
|
||||
{% if external_course_url != '' and external_course_url != 'missing property: external_course_url' and external_course_url != null %}
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button np-button-big"
|
||||
class="np-top-button np-button-font-color np-button np-button-big this-is-not-our-cta"
|
||||
href="{{external_course_url}}"
|
||||
target="_blank"
|
||||
>
|
||||
@ -60,4 +60,4 @@
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
@ -14,6 +14,8 @@
|
||||
{%- comment -%} {% unless course.progress > 0 %}
|
||||
{% endunless %} {%- endcomment -%}
|
||||
<div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content course-card-wrapper" data-product="{{ course.properties.product_names_for_course_cards}}" data-categories="{{ allCats }}">
|
||||
{% comment %} <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content course-card-wrapper"> {% endcomment %}
|
||||
|
||||
{%- comment -%} {% include "cards_course" with course, flag: 'catalog' %} {%- endcomment -%}
|
||||
{% if current_person.email contains '+preview' or current_person.email == 'kfelton@anthology.com'%}
|
||||
{% include "cards_course_revamped" with course, flag: 'null' %}
|
||||
@ -0,0 +1,153 @@
|
||||
<div class="np-filter" tabindex="0">
|
||||
<div class="dropdown">
|
||||
<select
|
||||
class="category-filter-dropdown np-input"
|
||||
type="text"
|
||||
name="category-filter-dropdown"
|
||||
id="category-filter-dropdown"
|
||||
onchange="filterByCategory()"
|
||||
>
|
||||
{% assign sorted_categories = current_school.filterable_categories | sort: "name" %}
|
||||
<option class="category-filter-entry" value="Default" selected>All Categories</option>
|
||||
|
||||
{% for category in sorted_categories %}
|
||||
{% assign renderCat = false %}
|
||||
|
||||
{% for course in courses.enrolled %}
|
||||
{% for course_category in course.categories %}
|
||||
{% if course_category.id == category.id %}
|
||||
{% assign renderCat = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
{% comment %} Need to iterate over all filterable categories, target all searched cards, check if cat exists, render if found {% endcomment %}
|
||||
|
||||
{% comment %} Need to generate category entires dynamically? Might not be possible because liquid is server side. Would need to pull all cats before load but all Searched Results after render {% endcomment %}
|
||||
|
||||
{%if renderCat %}
|
||||
<option class="category-filter-entry" value="{{ category.name }}">{{ category.name }}</option>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('document').ready(function(){
|
||||
let allCategoryFilters = document.querySelectorAll('.category-filter-entry');
|
||||
let allSearchedResults = document.querySelectorAll('.course-card');
|
||||
let allCourses = document.querySelector('.np-catalog-courses').children;
|
||||
|
||||
// for(let i = 0; i < allCourses.length; i++){
|
||||
// allCourses[i].style.display = 'block';
|
||||
// }
|
||||
|
||||
for(let i = 1; i < allCategoryFilters.length; i++){
|
||||
let productFound = false;
|
||||
for(let j = 0; j < allSearchedResults.length; j++){
|
||||
|
||||
if(allSearchedResults[j].parentNode.dataset.categories.indexOf(allCategoryFilters[i].getAttribute('value')) > -1){
|
||||
productFound = true;
|
||||
}
|
||||
}
|
||||
|
||||
if(!productFound){
|
||||
allCategoryFilters[i].style.display = 'none';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
let filterByCategory = () => {
|
||||
let allLearning = document.querySelector('.np-catalog-courses').children;
|
||||
|
||||
for(let i = 0; i < allLearning.length; i++){
|
||||
if(event.target.value == 'Default'){
|
||||
allLearning[i].classList.remove('filtered');
|
||||
if(!allLearning[i].classList.contains('hidden-by-product')){
|
||||
allLearning[i].style.display = 'block';
|
||||
}
|
||||
} else {
|
||||
if(allLearning[i].dataset.categories.indexOf(event.target.value) == -1){
|
||||
allLearning[i].classList.add('filtered');
|
||||
if(allLearning[i].classList.contains('hidden-by-product')){
|
||||
allLearning[i].style.display = 'none';
|
||||
}
|
||||
} else {
|
||||
allLearning[i].classList.remove('filtered');
|
||||
if(!allLearning[i].classList.contains('hidden-by-product')){
|
||||
allLearning[i].style.display = 'block';
|
||||
}
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
// This will adjust and recreate the filters with the proper values
|
||||
|
||||
let allProductFiltersEntry = document.querySelectorAll(".product-filter-entry");
|
||||
// let allCategoryFiltersEntry = document.querySelectorAll('.category-filter-entry');
|
||||
let allFilteredResults = document.querySelector('.np-catalog-courses').children;
|
||||
|
||||
for(let i = 1; i < allProductFiltersEntry.length; i++){
|
||||
allProductFiltersEntry[i].style.display = 'block';
|
||||
}
|
||||
|
||||
if(event.target.value != 'Default'){
|
||||
for(let i = 1; i < allProductFiltersEntry.length; i++){
|
||||
let productFound = false;
|
||||
|
||||
for(let j = 0; j < allFilteredResults.length; j++){
|
||||
|
||||
if(allFilteredResults[j].dataset.product){
|
||||
if(allFilteredResults[j].dataset.product.indexOf(allProductFiltersEntry[i].getAttribute('value')) > -1){
|
||||
if(!allFilteredResults[j].classList.contains('filtered')){
|
||||
productFound = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(!productFound){
|
||||
allProductFiltersEntry[i].style.display = 'none';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// -------------------------------------------------------------------------------------------
|
||||
// this section is to update the category filter based on category filter changes
|
||||
// commented out because the control of category filter entries should be solely on the product filter
|
||||
|
||||
// for(let i = 1; i < allCategoryFiltersEntry.length; i++){
|
||||
// allCategoryFiltersEntry[i].style.display = 'none';
|
||||
// }
|
||||
|
||||
// for(let i = 1; i < allCategoryFiltersEntry.length; i++){
|
||||
// let catFound = false;
|
||||
|
||||
// for(let j = 0; j < allFilteredResults.length; j++){
|
||||
// if(allFilteredResults[j].dataset.categories){
|
||||
// if(allFilteredResults[j].dataset.categories.indexOf(allCategoryFiltersEntry[i].getAttribute('value')) > -1){
|
||||
// console.log(allCategoryFiltersEntry[i].getAttribute('value'));
|
||||
// catFound = true;
|
||||
|
||||
// // if(allFilteredResults[j].style.display == 'none'){
|
||||
// // catFound = true;
|
||||
// // }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// if(catFound){
|
||||
// allCategoryFiltersEntry[i].style.display = 'block';
|
||||
// }
|
||||
// }
|
||||
|
||||
// Last step is to return cat dropdown to always be all cats on product selection
|
||||
// This will prevent cats that shouldnt be present from remaining selected
|
||||
|
||||
// $('#category-filter-dropdown > option:nth-child(1)').text('All Categories');
|
||||
|
||||
// $('#product-filter-dropdown > option:nth-child(1)').attr('selected', true);
|
||||
// $('#product-filter-dropdown').val('Default');
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,201 @@
|
||||
<div class="np-filter product-filter-container">
|
||||
<div class="dropdown">
|
||||
<select
|
||||
class="product-filter-dropdown np-input"
|
||||
type="text"
|
||||
name="product-filter-dropdown"
|
||||
id="product-filter-dropdown"
|
||||
onchange="filterByProduct()"
|
||||
>
|
||||
<option class="product-filter-entry" value="Default" selected>All Products</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let allProductTypesHome = ['Anthology-Default'];
|
||||
let allProductTypesDash = ['Anthology-Default'];
|
||||
let productFilterEl = document.querySelector("#product-filter-dropdown");
|
||||
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 0 or course.properties.most_popular == true %}
|
||||
if('{{ course.properties.product_names_for_course_cards }}' != 'Anthology [Catch-all]'){
|
||||
if(!allProductTypesHome.includes('{{ course.properties.product_names_for_course_cards }}')){
|
||||
allProductTypesHome.push("{{ course.properties.product_names_for_course_cards }}");
|
||||
}
|
||||
}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% for course in courses.enrolled %}
|
||||
{% unless course.progress == 0 %}
|
||||
if('{{ course.properties.product_names_for_course_cards }}' != 'Anthology [Catch-all]'){
|
||||
if(!allProductTypesDash.includes('{{ course.properties.product_names_for_course_cards }}')){
|
||||
allProductTypesDash.push("{{ course.properties.product_names_for_course_cards }}");
|
||||
}
|
||||
}
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
|
||||
allProductTypesHome = allProductTypesHome.sort();
|
||||
allProductTypesDash = allProductTypesDash.sort();
|
||||
|
||||
{% if page == 'Homepage' or page == 'Search' %}
|
||||
if(allProductTypesHome.length > 1){
|
||||
allProductTypesHome.map((product) => {
|
||||
if(product != 'Anthology-Default'){
|
||||
if(product.indexOf('&') > -1){
|
||||
product = product.replaceAll('&', '&');
|
||||
}
|
||||
let productOption = document.createElement('option');
|
||||
productOption.classList.add('product-filter-entry');
|
||||
productOption.setAttribute('value', product);
|
||||
//productionOption.setAttribute('href', `/search/23777883-6b85-449d-8d25-2e548c6e9ecc?q=${product}`);
|
||||
productOption.innerHTML = `${product}`;
|
||||
productFilterEl.appendChild(productOption);
|
||||
}
|
||||
})
|
||||
} else {
|
||||
productFilterEl.style.display = 'none';
|
||||
}
|
||||
|
||||
let filterByProduct = () => {
|
||||
let allLearning = document.querySelector('.np-catalog-courses').children;
|
||||
|
||||
for(let i = 0; i < allLearning.length; i++){
|
||||
if(event.target.value == 'Default'){
|
||||
allLearning[i].classList.remove('hidden-by-product');
|
||||
if(!allLearning[i].classList.contains('filtered')){
|
||||
allLearning[i].style.display = 'block';
|
||||
}
|
||||
} else {
|
||||
if(allLearning[i].dataset.product != event.target.value){
|
||||
allLearning[i].style.display = 'none';
|
||||
allLearning[i].classList. add('hidden-by-product');
|
||||
} else {
|
||||
allLearning[i].classList.remove('hidden-by-product');
|
||||
if(!allLearning[i].classList.contains('filtered')){
|
||||
allLearning[i].style.display = 'block';
|
||||
}
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
// let allProductFiltersEntry = document.querySelectorAll(".product-filter-entry");
|
||||
let allCategoryFiltersEntry = document.querySelectorAll('.category-filter-entry');
|
||||
let allFilteredResults = document.querySelector('.np-catalog-courses').children;
|
||||
|
||||
for(let i = 1; i < allCategoryFiltersEntry.length; i++){
|
||||
allCategoryFiltersEntry[i].style.display = 'block';
|
||||
}
|
||||
|
||||
if(event.target.value != 'Default'){
|
||||
for(let i = 1; i < allCategoryFiltersEntry.length; i++){
|
||||
let catFound = false;
|
||||
|
||||
for(let j = 0; j < allFilteredResults.length; j++){
|
||||
if(allFilteredResults[j].dataset.categories){
|
||||
if(allFilteredResults[j].dataset.categories.indexOf(allCategoryFiltersEntry[i].getAttribute('value')) > -1){
|
||||
if(!allFilteredResults[j].classList.contains('hidden-by-product')){
|
||||
catFound = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(!catFound){
|
||||
allCategoryFiltersEntry[i].style.display = 'none';
|
||||
}
|
||||
}
|
||||
}
|
||||
// -------------------------------------------------------------------------------------------
|
||||
// this section is to update the product filter based on product filter changes
|
||||
// commented out because the control of product filter entries should be solely on the category filter
|
||||
|
||||
|
||||
// for(let i = 1; i < allProductFiltersEntry.length; i++){
|
||||
// allProductFiltersEntry[i].style.display = 'none';
|
||||
// }
|
||||
|
||||
// for(let i = 1; i < allProductFiltersEntry.length; i++){
|
||||
// let productFound = false;
|
||||
|
||||
// for(let j = 0; j < allFilteredResults.length; j++){
|
||||
// if(allFilteredResults[j].dataset.product){
|
||||
// if(allFilteredResults[j].dataset.product.indexOf(allProductFiltersEntry[i].getAttribute('value')) > -1){
|
||||
// if(allFilteredResults[j].style.display == 'none'){
|
||||
// productFound = true;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// if(!productFound){
|
||||
// allProductFiltersEntry[i].style.display = 'block';
|
||||
// }
|
||||
// }
|
||||
|
||||
// Last step is to return cat dropdown to always be all cats on product selection
|
||||
// This will prevent cats that shouldnt be present from remaining selected
|
||||
|
||||
// $('#category-filter-dropdown > option:nth-child(1)').text('All Categories');
|
||||
|
||||
// $('#category-filter-dropdown > option:nth-child(1)').attr('selected', true);
|
||||
// $('#category-filter-dropdown').val('Default');
|
||||
};
|
||||
{% elsif page == 'Dashboard' %}
|
||||
// if(allProductTypesDash.length > 1){
|
||||
// allProductTypesDash.map((product) => {
|
||||
// if(product != 'Anthology-Default'){
|
||||
// if(product.indexOf('&') > -1){
|
||||
// product = product.replace('&', '&');
|
||||
// }
|
||||
// let productOption = document.createElement('option');
|
||||
// productOption.classList.add('product-filter-entry');
|
||||
// productOption.setAttribute('value', product)
|
||||
// productOption.innerHTML = `${product}`;
|
||||
|
||||
// productFilterEl.appendChild(productOption);
|
||||
// }
|
||||
// })
|
||||
// } else {
|
||||
// productFilterEl.style.display = 'none';
|
||||
// document.querySelector('.view-swapper-container').style.marginBottom = '0';
|
||||
// }
|
||||
|
||||
// let filterByProduct = () => {
|
||||
// let inProgressCourses = document.querySelector('.courses-in-prog').children;
|
||||
// let completedCourses = document.querySelector('.courses-completed').children;
|
||||
|
||||
// for(let i = 0; i < inProgressCourses.length; i++){
|
||||
// if(event.target.value == 'Default'){
|
||||
// inProgressCourses[i].style.display = 'block';
|
||||
// } else {
|
||||
// if(inProgressCourses[i].dataset.product != event.target.value){
|
||||
// inProgressCourses[i].style.display = 'none';
|
||||
// } else {
|
||||
// inProgressCourses[i].style.display = 'block';
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// for(let i = 0; i < completedCourses.length; i++){
|
||||
// if(event.target.value == 'Default'){
|
||||
// completedCourses[i].style.display = 'block';
|
||||
// } else {
|
||||
// if(completedCourses[i].dataset.product != event.target.value){
|
||||
// completedCourses[i].style.display = 'none';
|
||||
// } else {
|
||||
// completedCourses[i].style.display = 'block';
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
{% endif %}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.filtered{
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
@ -98,7 +98,7 @@
|
||||
//Final user data
|
||||
let userData = {
|
||||
learner_uuid: '{{current_person.id}}',
|
||||
learner_name: '{{current_person.first_name}} {{current_person.last_name}}',
|
||||
learner_name: "{{current_person.first_name}} {{current_person.last_name}}",
|
||||
learner_email: '{{current_person.email}}',
|
||||
learner_title: '',
|
||||
primaryRole: '',
|
||||
@ -13,7 +13,7 @@
|
||||
{% endfor %}
|
||||
</div>
|
||||
</nav> {% endcomment %}
|
||||
<nav class="np-sub-navigation custom-home-subnav" style="background: rgba(68, 68, 68, 1); margin: 0; padding: 15px 15px 0;">
|
||||
<nav class="np-sub-navigation custom-home-subnav" style="background: #0054bc; margin: 0; padding: 15px 15px 0;">
|
||||
<div class="np-sub-navigation-content" style="align-items: center;">
|
||||
{% for link in navigations.sub_navigation %}
|
||||
{% unless link.label == 'Catalog' or link.label == 'Learning Paths' %}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user