Anthology back up
This commit is contained in:
@ -0,0 +1,277 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
||||
{% include "sub_navigation" %}
|
||||
{% comment %} {% if current_person.email contains '+preview' or current_person.email == 'kfelton@anthology.com'%}
|
||||
{% assign sub_levels_length = current_person.properties.subscription_levels | size %}
|
||||
{% if sub_levels_length > 0 %}
|
||||
{% include "product_bar" %}
|
||||
{% endif %}
|
||||
{% endif %} {% endcomment %}
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div class="row np-flex-center">
|
||||
{% include "profile_card" %}
|
||||
|
||||
<div class="col-xs-12 col-sm-7 col-md-8 col-lg-9 dashboard-learning-content">
|
||||
<div class="dashboard-main-title">
|
||||
Dashboard
|
||||
</div>
|
||||
<div class="dashboard-subtitle">
|
||||
Track Progress and Continue Learning
|
||||
</div>
|
||||
|
||||
<div class='dashboard-control-panel' style="
|
||||
">
|
||||
{%- comment -%} =============== THIS IS WHERE THE SWAPPER WILL LIVE =============== {%- endcomment -%}
|
||||
<div class="view-swapper-container">
|
||||
<div id="dashboard-view-button" class="view-swapper-button view-swapper-button-active" onclick="swapView()">
|
||||
Resources
|
||||
</div>
|
||||
<div id="events-view-button" class="view-swapper-button" onclick="swapView()">
|
||||
Live Events
|
||||
</div>
|
||||
{% assign completedCourseFound = false %}
|
||||
{% if courses.enrolled.any? %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 %}
|
||||
{% assign completedCourseFound = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% if completedCourseFound %}
|
||||
<div id="completed-view-button" class="view-swapper-button" onclick="swapView()">
|
||||
Completed
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{%- comment -%} =============== THIS IS WHERE THE PRODUCT FILTER WILL LIVE =============== {%- endcomment -%}
|
||||
<div class="filter-buttons-container">
|
||||
<div class="dashboard-filter-label">Filter By: </div>
|
||||
{% include "filter_by_product", page: 'Dashboard' %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="dashboard-resources-pane">
|
||||
<div class="np-dashboard-resources-title">
|
||||
Your Resources
|
||||
</div>
|
||||
{% assign ipCourseFound = false %}
|
||||
{% if courses.enrolled.any? %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress > 0 and course.progress < 100 %}
|
||||
{% assign ipCourseFound = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% if ipCourseFound %}
|
||||
{% include "courses_index_in_prog", outerClass: "dashboard-courses-index" %}
|
||||
{% endif %}
|
||||
|
||||
{%- comment -%} {% if courses.enrolled.any? %}
|
||||
{% include "courses_index", outerClass: "dashboard-courses-index" %}
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %} {%- endcomment -%}
|
||||
</div>
|
||||
|
||||
<div id="dashboard-events-pane">
|
||||
{% include "training_events_index" %}
|
||||
</div>
|
||||
|
||||
<div id="dashboard-completed-pane">
|
||||
{% assign completedCourseFound = false %}
|
||||
{% if courses.enrolled.any? %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 %}
|
||||
{% assign completedCourseFound = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% if completedCourseFound %}
|
||||
{% include "courses_index_completed", outerClass: "dashboard-courses-index" %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<script>
|
||||
let swapView = () => {
|
||||
console.log(event.target.classList);
|
||||
|
||||
if(!event.target.classList.contains('view-swapper-button-active')){
|
||||
if(event.target.id == 'dashboard-view-button'){
|
||||
|
||||
document.getElementById('events-view-button').classList.remove('view-swapper-button-active');
|
||||
if(document.getElementById('completed-view-button')){
|
||||
document.getElementById('completed-view-button').classList.remove('view-swapper-button-active');
|
||||
}
|
||||
event.target.classList.add('view-swapper-button-active');
|
||||
|
||||
document.getElementById('dashboard-events-pane').style.display = 'none';
|
||||
document.getElementById('dashboard-completed-pane').style.display = 'none';
|
||||
document.getElementById('dashboard-resources-pane').style.display = 'block';
|
||||
|
||||
} else if(event.target.id == 'events-view-button'){
|
||||
document.getElementById('dashboard-view-button').classList.remove('view-swapper-button-active');
|
||||
if(document.getElementById('completed-view-button')){
|
||||
document.getElementById('completed-view-button').classList.remove('view-swapper-button-active');
|
||||
}
|
||||
event.target.classList.add('view-swapper-button-active');
|
||||
|
||||
document.getElementById('dashboard-resources-pane').style.display = 'none';
|
||||
document.getElementById('dashboard-completed-pane').style.display = 'none';
|
||||
document.getElementById('dashboard-events-pane').style.display = 'block';
|
||||
|
||||
} else if(event.target.id == 'completed-view-button'){
|
||||
document.getElementById('dashboard-view-button').classList.remove('view-swapper-button-active');
|
||||
document.getElementById('events-view-button').classList.remove('view-swapper-button-active');
|
||||
event.target.classList.add('view-swapper-button-active');
|
||||
|
||||
document.getElementById('dashboard-resources-pane').style.display = 'none';
|
||||
document.getElementById('dashboard-events-pane').style.display = 'none';
|
||||
document.getElementById('dashboard-completed-pane').style.display = 'block';
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
{%- comment -%} {% assign swapper_spacer = 0 %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% unless course.progress == 0 %}
|
||||
{% assign swapper_spacer = 1 %}
|
||||
{% endunless %}
|
||||
{% endfor %} {%- endcomment -%}
|
||||
|
||||
<style>
|
||||
.dashboard-main-title{
|
||||
color: #0a0a0a;
|
||||
font-size: 2em;
|
||||
font-weight: 900;
|
||||
line-height: 2.375REM;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.dashboard-subtitle{
|
||||
color: #595959;
|
||||
font-size: 1.25rem;
|
||||
font-weight: 400;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.np-dashboard-resources-title{
|
||||
color: #000000;
|
||||
font-size: 1.5em;
|
||||
font-weight: 600;
|
||||
line-height: 25px;
|
||||
margin-bottom: 25px;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.dashboard-control-panel{
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #F2F4F5;
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
justify-content: center;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.view-swapper-container{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 40px;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.view-swapper-button{
|
||||
align-items: center;
|
||||
color: #595959;
|
||||
display: flex;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
width: 125px;
|
||||
}
|
||||
|
||||
.view-swapper-button-active{
|
||||
background: #f2f4f5;
|
||||
color: #000;
|
||||
font-weight: 600;
|
||||
/* border-bottom: 2px solid #000000; */
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
.view-swapper-button:hover{
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filter-buttons-container{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.dashboard-filter-label{
|
||||
color: #595959;
|
||||
font-size: 1em;
|
||||
font-weight: 700;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
#dashboard-events-pane,
|
||||
#dashboard-completed-pane{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.product-filter-container{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px){
|
||||
.np-dashboard{
|
||||
padding: 70px 24px;
|
||||
}
|
||||
|
||||
.dashboard-main-title{
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.dashboard-control-panel{
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.view-swapper-container{
|
||||
margin-bottom: -38px;
|
||||
width: unset;
|
||||
}
|
||||
|
||||
.dashboard-learning-content{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.dashboard-courses-index{
|
||||
margin: 0;
|
||||
margin-left: -10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
{%- comment -%} {% if swapper_spacer == 0 %}
|
||||
<style>
|
||||
.view-swapper-container{
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
</style>
|
||||
{% endif %} {%- endcomment -%}
|
||||
Reference in New Issue
Block a user