488 lines
13 KiB
Plaintext
488 lines
13 KiB
Plaintext
{% comment %} skip-auth {% endcomment %}
|
|
{% if current_person.signed_in? %}
|
|
{% assign countComplete = 0 %}
|
|
{% assign countInProgress = 0 %}
|
|
{% assign countNotStarted = 0 %}
|
|
{% assign countTotal = 0 | times: 1.0 %}
|
|
{% for course in courses.enrolled %}
|
|
{% assign countTotal = countTotal | plus: 1 %}
|
|
{% if course.progress == 100 %}
|
|
{% assign countComplete = countComplete | plus: 1 %}
|
|
{% endif %}
|
|
{% if course.progress > 0 and course.progress < 100 %}
|
|
{% assign countInProgress=countInProgress | plus: 1 %}
|
|
{% endif %}
|
|
{% if course.progress==0 %}
|
|
{% assign countNotStarted=countNotStarted | plus: 1 %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% assign view_more_counter = 0 %}
|
|
|
|
{% include "header" %}
|
|
{% unless current_person.signed_in? %}
|
|
{% include 'welcome_hero' %}
|
|
{% endunless %}
|
|
<div class="page-container">
|
|
|
|
{% if current_person.signed_in? %}
|
|
<div class="np-hidden-mobile custom-sub-navigation">
|
|
{% include "sub_navigation" %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
|
|
<main class="np-main np-dashboard np-subpage-container np-max-width custom-main">
|
|
{% if current_person.signed_in? %}
|
|
{% include 'welcome_hero' %}
|
|
{% include 'statistics' %}
|
|
|
|
<div class="np-hidden-mobile">
|
|
{% include 'overview_video' %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% unless current_person.signed_in? %}
|
|
|
|
<div class="sign-up-banner-mobile">
|
|
<img class="sign-up-banner-image" src="https://cdn.northpass.io/Skuid/images/sign_up_banner.svg" />
|
|
<div class="sign-up-banner-content-container-mobile">
|
|
<div class="sign-up-banner-text-container">
|
|
<span class="sign-up-banner-header">Registration is Free</span>
|
|
<br>
|
|
<span class="sign-up-banner-subheader">Sign up for free and start taking additional courses today!</span>
|
|
</div>
|
|
<a class="sign-up-banner-button sign-up-banner-button-mobile">Register For Free</a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="sign-up-banner-desktop">
|
|
<img class="sign-up-banner-image" src="https://cdn.northpass.io/Skuid/images/sign_up_banner.svg" />
|
|
<div class="sign-up-banner-text-container">
|
|
<span class="sign-up-banner-header">Registration is Free</span>
|
|
<br>
|
|
<span class="sign-up-banner-subheader">Sign up for free and start taking additional courses today!</span>
|
|
</div>
|
|
<div class="sign-up-banner-button-container">
|
|
<a class="sign-up-banner-button">Register For Free</a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="learning-path-not-logged">
|
|
{% include 'learning_paths_collection' %}
|
|
</div>
|
|
|
|
<h2 class="no-course-message" style="display: none;">No courses for this filter!</h2>
|
|
{% include "course_collection_unlogged" %}
|
|
<div class="np-hidden-desktop">
|
|
<div class="np-catalog-courses row row-with-thumbnails homepage-courses">
|
|
{% for course in courses.in_catalog %}
|
|
{% if view_more_counter < 4%}
|
|
{% assign view_more_counter = view_more_counter | plus: 1%}
|
|
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
|
{% include "cards_course" with course, class: "" %}
|
|
</div>
|
|
{% else %}
|
|
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content view-more-hidden">
|
|
{% include "cards_course" with course, class: "" %}
|
|
</div>
|
|
{% endif%}
|
|
{% endfor %}
|
|
|
|
{{ school.custom_properties.banner_text}}
|
|
<if></if>
|
|
|
|
{% if view_more_counter >= 4%}
|
|
<button class="np-top-button np-button-font-color np-button np-button-big view-more-button" onclick="viewMore()">View More</button>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endunless %}
|
|
|
|
{% if current_person.signed_in? %}
|
|
<div class="row np-flex-center homepage-courses-lp-container">
|
|
<div class="col-xs-12 col-sm-8 main-dashboard">
|
|
{% if features.learning_paths? %}
|
|
<div>
|
|
<div class="lp-and-recently-completed-course-container np-hidden-mobile">
|
|
<div style="width: 64%">
|
|
{% if learning_paths.enrolled.any? %}
|
|
{% include "learning_paths_index_homepage", items: learning_paths.enrolled %}
|
|
{% endif %}
|
|
</div>
|
|
<div style="width: 31%">
|
|
{% include 'recent_course' %}
|
|
</div>
|
|
</div>
|
|
<div>
|
|
{% include 'dashboard_course_filter' %}
|
|
<h2 class="no-course-message" style="display: none;">No courses for this filter!</h2>
|
|
{% include "course_collection" %}
|
|
<div class="np-hidden-desktop">
|
|
<div class="np-catalog-courses row row-with-thumbnails homepage-courses">
|
|
{% for course in courses.enrolled %}
|
|
{% if view_more_counter < 4 %}
|
|
{% assign view_more_counter = view_more_counter | plus: 1%}
|
|
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
|
{% include "cards_course" with course, class: "" %}
|
|
</div>
|
|
{% else %}
|
|
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content view-more-hidden">
|
|
{% include "cards_course" with course, class: "" %}
|
|
</div>
|
|
{% endif%}
|
|
{% endfor %}
|
|
|
|
{% if view_more_counter >= 4%}
|
|
<button class="np-top-button np-button-font-color np-button np-button-big view-more-button" onclick="viewMore()">View More</button>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</main>
|
|
</div>
|
|
|
|
<script crossorigin="anonymous" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js" type="text/javascript"></script>
|
|
{% include "footer" %}
|
|
|
|
<script>
|
|
function initializeCarousel(slickContainerClass, visibleSlides) {
|
|
$(slickContainerClass).slick({
|
|
slidesToShow: visibleSlides,
|
|
slidesToScroll: 1,
|
|
dots: false,
|
|
infinite: true,
|
|
cssEase: 'linear',
|
|
prevArrow: '<svg viewBox="0 0 20 20" class="_1ycOA _left"><path d="M12 16a.997.997 0 0 1-.707-.293l-5-5a.999.999 0 0 1 0-1.414l5-5a.999.999 0 1 1 1.414 1.414L8.414 10l4.293 4.293A.999.999 0 0 1 12 16" fill-rule="evenodd"></path></svg>',
|
|
nextArrow: '<svg viewBox="0 0 20 20" class="_1ycOA _right"><path d="M8 16a.999.999 0 0 1-.707-1.707L11.586 10 7.293 5.707a.999.999 0 1 1 1.414-1.414l5 5a.999.999 0 0 1 0 1.414l-5 5A.997.997 0 0 1 8 16" fill-rule="evenodd"></path></svg>'
|
|
});
|
|
}
|
|
|
|
$(document).ready(function () {
|
|
initializeCarousel('.carousel', 3)
|
|
|
|
var slider = tns({
|
|
container: `.lp-carousel`,
|
|
items: 1,
|
|
nav: false,
|
|
mouseDrag: true,
|
|
autoHeight: true,
|
|
autoplay: false,
|
|
controls: true,
|
|
autoplayButtonOutput: false,
|
|
navPosition: 'bottom',
|
|
controlsText: ['<i class="fas fa-chevron-left"></i>', '<i class="fas fa-chevron-right"></i>']
|
|
});
|
|
})
|
|
|
|
function textDisplayCount() {
|
|
let courseCount = $('#dash-sort').children().length;
|
|
return courseCount
|
|
}
|
|
function selectAll() {
|
|
$(".select-selected").html("All").change();
|
|
filterCourse()
|
|
$(".select-items div").each(function () {
|
|
if ($(this).text() == $(".select-selected").text()) {
|
|
$(this).addClass("same-as-selected");
|
|
} else {
|
|
$(this).removeClass("same-as-selected");
|
|
}
|
|
});
|
|
$(".missing").hide();
|
|
}
|
|
|
|
</script>
|
|
<style>
|
|
.sign-up-banner-desktop,
|
|
.sign-up-banner-mobile{
|
|
align-items: center;
|
|
background: #EBF5FF;
|
|
border-radius: 8px;
|
|
box-shadow: 5px 5px 0px rgba(128, 173, 220, 0.32);
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
margin-bottom: 35px;
|
|
}
|
|
|
|
.sign-up-banner-desktop{
|
|
display: none;
|
|
width: 100%;
|
|
}
|
|
|
|
.sign-up-banner-mobile{
|
|
display: flex;
|
|
margin: 0 auto;
|
|
width: 95%;
|
|
}
|
|
|
|
.sign-up-banner-image{
|
|
max-width: 30%;
|
|
}
|
|
|
|
.sign-up-banner-content-container-mobile{
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.sign-up-banner-header{
|
|
font-size: 18px;
|
|
}
|
|
|
|
.sign-up-banner-subheader,
|
|
.sign-up-banner-button{
|
|
font-size: 16px;
|
|
}
|
|
|
|
.sign-up-banner-button{
|
|
background: #005CB9;
|
|
border-radius: 32px;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.sign-up-banner-button-mobile{
|
|
align-self: center;
|
|
margin-top: 5px;
|
|
width: 65%;
|
|
}
|
|
|
|
@media screen and (min-width: 768px){
|
|
.sign-up-banner-desktop{
|
|
display: flex;
|
|
}
|
|
|
|
.sign-up-banner-mobile{
|
|
display: none;
|
|
}
|
|
|
|
.sign-up-banner-image{
|
|
max-width: 25%;
|
|
}
|
|
|
|
.sign-up-banner-text-container{
|
|
max-width: 43%;
|
|
padding: 0 10px 0 25px;
|
|
}
|
|
|
|
.sign-up-banner-button-container{
|
|
max-width: 32%;
|
|
padding: 8px;
|
|
}
|
|
|
|
.sign-up-banner-button{
|
|
padding: 4px 4px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1020px){
|
|
.sign-up-banner-button-container{
|
|
padding-right: 20px;
|
|
}
|
|
|
|
.sign-up-banner-button{
|
|
padding: 8px 8px;
|
|
}
|
|
}
|
|
|
|
.tns-item img {
|
|
margin: auto;
|
|
}
|
|
|
|
[data-controls="prev"] {
|
|
margin-left: -3%;
|
|
}
|
|
|
|
[data-controls="next"] {
|
|
margin-right: -3%;
|
|
}
|
|
|
|
.tns-outer {
|
|
position: relative;
|
|
box-shadow: 5px 5px 0px rgb(128 173 220 / 32%);
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.tns-controls {
|
|
position: absolute;
|
|
z-index: 100;
|
|
top: 50%;
|
|
transform: translate(0,-50%);
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
.tns-controls > * {
|
|
border: none;
|
|
letter-spacing: 0.01em !important;
|
|
line-height: 0;
|
|
touch-action: manipulation;
|
|
user-select: none;
|
|
-webkit-tap-highlight-color: transparent;
|
|
-webkit-font-smoothing: antialiased;
|
|
text-size-adjust: 100%;
|
|
--polaris-version-number: "4.27.0";
|
|
--polaris-animation-skeleton-shimmer: polaris-SkeletonShimmerAnimation;
|
|
--toast-translate-y-out: 15rem;
|
|
--toast-translate-y-in: 0;
|
|
--global-ribbon-height: 0px;
|
|
--p-text-subdued: #6d7175;
|
|
--p-card-shadow: 0 0.2rem 0.4rem #dfe3e8;
|
|
--top-bar-background: #00848e;
|
|
--top-bar-background-lighter: #1d9ba4;
|
|
--top-bar-color: #f9fafb;
|
|
--p-frame-offset: 0px;
|
|
font-family: -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI,
|
|
Roboto, Helvetica Neue, sans-serif;
|
|
cursor: pointer;
|
|
box-sizing: border-box;
|
|
fill: #292824;
|
|
vertical-align: middle;
|
|
width: 30px;
|
|
height: 30px;
|
|
border-radius: 50%;
|
|
background: #fff;
|
|
box-shadow: 0 0 1px rgba(66, 71, 76, 0.45), 0 2px 1px rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
@media (min-width: 769px) and (max-width: 1024px) {
|
|
.custom-sub-navigation {
|
|
width: 30%;
|
|
}
|
|
|
|
.custom-main {
|
|
width: 70%;
|
|
padding-top: 0;
|
|
}
|
|
|
|
.np-homepage-hero-image {
|
|
min-height: auto;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1025px) and (max-width: 2500px) {
|
|
.custom-sub-navigation {
|
|
width: 25%;
|
|
}
|
|
|
|
.custom-main {
|
|
width: 75%;
|
|
padding-top: 0;
|
|
}
|
|
}
|
|
|
|
/* @media (min-width: 1025px) {
|
|
.badges {
|
|
width: 19%;
|
|
}
|
|
} */
|
|
.recent-view-header {
|
|
text-align:center;
|
|
}
|
|
@media (min-width: 1025px) and (max-width: 2500px) {
|
|
.recent-view-header {
|
|
padding-top: 1%;
|
|
|
|
}
|
|
}
|
|
|
|
@media (min-width: 2501px) {
|
|
.recent-view-header {
|
|
padding: 5px 110px 0;
|
|
}
|
|
}
|
|
|
|
.learning-path-not-logged {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
margin-bottom: 130px;
|
|
width: 94%;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.homepage-courses-lp-container {
|
|
--bs-gutter-x: 0;
|
|
}
|
|
}
|
|
|
|
.homepage-courses {
|
|
max-width: 90%;
|
|
width: 90%;
|
|
margin-right: auto !important;
|
|
margin-left: auto !important;
|
|
}
|
|
|
|
.lp-carousel > .slick-list > .slick-track{
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
align-items: center;
|
|
}
|
|
|
|
@media (min-width: 1500px) {
|
|
.lp-carousel > .slick-list > .slick-track > .course-slide > .np-card-container{
|
|
box-shadow: none;
|
|
}
|
|
|
|
.lp-carousel > .slick-list {
|
|
box-shadow: 5px 5px 0px rgb(128 173 220 / 32%);
|
|
border-radius: 8px;
|
|
}
|
|
}
|
|
|
|
.lp-and-recently-completed-course-container {
|
|
margin-bottom: 30px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.branding-message {
|
|
padding: 55px 0;
|
|
text-align: center;
|
|
font-family: F37 Moon !important;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.main-dashboard {
|
|
width: 100%;
|
|
}
|
|
|
|
.np-learning-paths-resources {
|
|
display: flex;
|
|
}
|
|
|
|
.np-learning-paths-resources > .np-card {
|
|
padding: 0;
|
|
display: flex;
|
|
}
|
|
|
|
@media(min-width: 769px) {
|
|
.np-learning-paths-resources > .np-card > .np-card-container {
|
|
height: 138%;
|
|
}
|
|
|
|
.np-learning-path {
|
|
height: 100%;
|
|
}
|
|
|
|
.np-learning-path-image {
|
|
width: 40%;
|
|
}
|
|
}
|
|
|
|
.np-card-text-wrapper {
|
|
display: flex;
|
|
}
|
|
</style>
|