291 lines
8.2 KiB
Plaintext
291 lines
8.2 KiB
Plaintext
{% include "header" %}
|
|
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
|
{% include "sub_navigation" %}
|
|
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
|
<div class="row np-flex-center">
|
|
<div class='my-webinars'>
|
|
<div class='section-title'>
|
|
My Webinars
|
|
</div>
|
|
{% if training_events.enrolled and training_events.enrolled.size > 0 %}
|
|
{% for training_event in training_events.enrolled %}
|
|
{% for session in training_event.sessions %}
|
|
{% if session.registered? %}
|
|
<div class='dashboard-event'>
|
|
On {{ session.month }} {{ session.day }} at {{ session.starts }} {{ session.time_zone }} is your {{ session.title }} event that is being held online
|
|
<a href='{{ session.session_url }}' class='dashboard-event-link'>Join</a>
|
|
</div>
|
|
{% endif %}
|
|
{% endfor %}
|
|
{% endfor %}
|
|
{% else %}
|
|
<div class='section-none-text'>
|
|
You haven't registered for any webinars yet.
|
|
</div>
|
|
<button class='section-none-button'>
|
|
<a class="section-none-link" href="/app/training_events">
|
|
Discover Webinars
|
|
</a>
|
|
</button>
|
|
{% endif %}
|
|
</div>
|
|
<div class='my-paths'>
|
|
<div class='section-title'>
|
|
My Paths
|
|
</div>
|
|
<div class='section-subtitle'>
|
|
Learning Paths in which you're currently enrolled
|
|
</div>
|
|
{% if learning_paths.enrolled and learning_paths.enrolled.size > 0 %}
|
|
<div class='section-content'>
|
|
<div class='filter-section'>
|
|
<div class='filter-title'>Filter by:</div>
|
|
{% assign lp_categories = '' | split: '' %}
|
|
{% for lp in learning_paths.enrolled %}
|
|
{% for cat in lp.categories %}
|
|
{% assign cat_name = cat.name | split: '!@#$%^&*()' %}
|
|
{% assign lp_categories = lp_categories | concat: cat_name %}
|
|
{% endfor %}
|
|
{% endfor %}
|
|
{% assign lp_categories = lp_categories | uniq %}
|
|
<div class='filter-element filter-element-selected' filter-type='lp' category-name='none'>
|
|
All
|
|
</div>
|
|
{% for cat in lp_categories %}
|
|
<div class='filter-element' filter-type='lp' category-name='{{cat}}'>
|
|
{{cat}}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
<div class='tiles-section'>
|
|
{% for learning_path in learning_paths.enrolled %}
|
|
{% include 'cards_learning_path_new' with learning_path %}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class='section-none-text'>
|
|
You haven't enrolled into any learning_paths yet.
|
|
</div>
|
|
<button class='section-none-button'>
|
|
<a class="section-none-link" href="/app/learning_paths">
|
|
Discover Paths
|
|
</a>
|
|
</button>
|
|
{% endif %}
|
|
</div>
|
|
<div class='my-courses'>
|
|
<div class='section-title'>
|
|
My Courses
|
|
</div>
|
|
<div class='section-subtitle'>
|
|
Courses in which you're currently enrolled
|
|
</div>
|
|
{% if courses.enrolled and courses.enrolled.size > 0 %}
|
|
<div class='section-content'>
|
|
<div class='filter-section'>
|
|
<div class='filter-title'>Filter by:</div>
|
|
{% assign lp_categories = '' | split: '' %}
|
|
{% for lp in courses.enrolled %}
|
|
{% for cat in lp.categories %}
|
|
{% assign cat_name = cat.name | split: '!@#$%^&*()' %}
|
|
{% assign lp_categories = lp_categories | concat: cat_name %}
|
|
{% endfor %}
|
|
{% endfor %}
|
|
{% assign lp_categories = lp_categories | uniq %}
|
|
<div class='filter-element filter-element-selected' filter-type='co' category-name='none'>
|
|
All
|
|
</div>
|
|
{% for cat in lp_categories %}
|
|
<div class='filter-element' filter-type='co' category-name='{{cat}}'>
|
|
{{cat}}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
<div class='tiles-section'>
|
|
{% for course in courses.enrolled %}
|
|
{% include 'cards_course_new' with course %}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class='section-none-text'>
|
|
You haven't enrolled into any courses yet.
|
|
</div>
|
|
<button class='section-none-button'>
|
|
<a class="section-none-link" href="/app/catalog">
|
|
Discover Courses
|
|
</a>
|
|
</button>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</main>
|
|
{% include "footer" %}
|
|
|
|
<style>
|
|
.np-dashboard {
|
|
background: white;
|
|
}
|
|
.row {
|
|
flex-direction: column;
|
|
margin-right: -1rem;
|
|
margin-left: -1rem;
|
|
display: inline-block;
|
|
}
|
|
.tiles-section {
|
|
display: flex;
|
|
width: 100%;
|
|
flex-wrap: wrap;
|
|
}
|
|
.section-content {
|
|
display: flex;
|
|
flex-direction: row;
|
|
border-top: 1px solid #ededed !important;
|
|
padding: 1rem 0;
|
|
}
|
|
.section-title {
|
|
margin-top: 30px;
|
|
font-size: 24px;
|
|
font-weight: 600;
|
|
line-height: 30px;
|
|
margin-bottom: 15px;
|
|
color: #444;
|
|
}
|
|
.section-subtitle {
|
|
font-size: 20px;
|
|
font-weight: 600;
|
|
line-height: 24px;
|
|
margin-bottom: 45px;
|
|
color: #444;
|
|
}
|
|
.section-none-text {
|
|
margin-bottom: 15px;
|
|
color: #606060;
|
|
font-size: 16px;
|
|
}
|
|
.section-none-button {
|
|
background: #9b4b87;
|
|
color: white;
|
|
padding: 0 20px;
|
|
text-align: center;
|
|
margin: auto;
|
|
font-size: 16px;
|
|
border: none;
|
|
border-radius: 2px;
|
|
cursor: pointer;
|
|
min-height: 30px;
|
|
line-height: 39px;
|
|
margin: 10px 0
|
|
}
|
|
.section-none-button:hover {
|
|
background: #4b2346 !important;
|
|
}
|
|
.section-none-link {
|
|
color: white;
|
|
text-decoration: none;
|
|
}
|
|
.section-none-link:hover {
|
|
color: white;
|
|
}
|
|
.dashboard-event {
|
|
padding: 10px 0;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
.dashboard-event-link {
|
|
color: #9b4b87;
|
|
margin-left: 15px;
|
|
text-decoration: none;
|
|
}
|
|
.dashboard-event-link:hover {
|
|
color: #4b2346;
|
|
}
|
|
.filter-section {
|
|
width: 25%;
|
|
}
|
|
.filter-element {
|
|
color: #9b4b87;
|
|
font-size: 18px;
|
|
margin-top: 8px;
|
|
cursor: pointer;
|
|
}
|
|
.filter-element:hover {
|
|
color: #4b2346;
|
|
}
|
|
.filter-element-selected {
|
|
font-weight: 700;
|
|
}
|
|
.filter-title {
|
|
font-size: 20px;
|
|
font-weight: 600;
|
|
}
|
|
@media (min-width:1200px) and (max-width:1640px) {
|
|
.row .np-card {
|
|
padding: 0 1rem 2rem;
|
|
}
|
|
}
|
|
@media (min-width:768px) and (max-width:1200px) {
|
|
.row .np-card {
|
|
padding: 0 0.7rem 1.4rem;
|
|
}
|
|
}
|
|
@media screen and (max-width: 1400px) {
|
|
.filter-section {
|
|
width: 20%;
|
|
}
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.section-content {
|
|
flex-direction: column;
|
|
}
|
|
.filter-section {
|
|
width: 100%;
|
|
margin-bottom: 15px;
|
|
}
|
|
}
|
|
.np-subpage-container {
|
|
padding:20px 4% 40px;
|
|
}
|
|
.my-webinars {
|
|
padding: 1rem;
|
|
border-top: 1px solid #ededed !important;
|
|
}
|
|
.my-paths {
|
|
padding: 1rem;
|
|
border-top: 1px solid #ededed !important;
|
|
}
|
|
.my-courses {
|
|
padding: 1rem;
|
|
border-top: 1px solid #ededed !important;
|
|
}
|
|
</style>
|
|
|
|
|
|
<script>
|
|
$('[filter-type]').each(function(x){
|
|
$(this).attr('category-name', $(this).attr('category-name').replaceAll(' ', '').replaceAll('+', ' '))
|
|
})
|
|
$('.filter-element[filter-type="co"]').click(function(){
|
|
$('.filter-element[filter-type="co"]').removeClass('filter-element-selected');
|
|
$(this).toggleClass('filter-element-selected');
|
|
if($(this).attr('category-name')=='none') {
|
|
$('.np-card[filter-type="co"]').show()
|
|
}
|
|
else {
|
|
$('.np-card[filter-type="co"]').hide();
|
|
$('.np-card[category-name~='+$(this).attr('category-name')+'][filter-type="co"]').show()
|
|
}
|
|
})
|
|
$('.filter-element[filter-type="lp"]').click(function(){
|
|
$('.filter-element[filter-type="lp"]').removeClass('filter-element-selected');
|
|
$(this).toggleClass('filter-element-selected');
|
|
if($(this).attr('category-name')=='none') {
|
|
$('.np-card[filter-type="lp"]').show()
|
|
}
|
|
else {
|
|
$('.np-card[filter-type="lp"]').hide();
|
|
$('.np-card[category-name~='+$(this).attr('category-name')+'][filter-type="lp"]').show()
|
|
}
|
|
})
|
|
</script> |