Downloaded Instacart's templates and deleted folders from churned customers.
This commit is contained in:
Norm Rasmussen
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
Binary file not shown.
@ -1,49 +0,0 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
{% comment %} <link rel="preconnect" href="https://fonts.googleapis.com"> {% endcomment %}
|
||||
{% comment %} <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> {% endcomment %}
|
||||
{% comment %} <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@100..900&display=swap" rel="stylesheet"> {% endcomment %}
|
||||
|
||||
<!-- Gainsight PX Tag-->
|
||||
<script type="text/javascript">
|
||||
(function(n,t,a,e,co){var i="aptrinsic";n[i]=n[i]||function(){
|
||||
(n[i].q=n[i].q||[]).push(arguments)},n[i].p=e;n[i].c=co;
|
||||
var r=t.createElement("script");r.async=!0,r.src=a+"?a="+e;
|
||||
var c=t.getElementsByTagName("script")[0];c.parentNode.insertBefore(r,c)
|
||||
})(window,document,"https://web-sdk.aptrinsic.com/api/aptrinsic.js","AP-QUWV37HJ0TII-2");
|
||||
</script>
|
||||
<!-- Gainsight PX Tag-->
|
||||
|
||||
{% if current_person.groups.any? %}
|
||||
{% for groups in current_person.groups %}
|
||||
<script> console.log("Person groups are {{ groups.name }}") </script>
|
||||
{% assign group = groups.name | split: "," %}
|
||||
<script> console.log("{{ group }}") </script>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
{% assign group = "None" %}
|
||||
<script> console.log("No groups found.") </script>
|
||||
{% endif %}
|
||||
|
||||
{% assign email_add = current_person.email | split: "@" %}
|
||||
{% assign domain = email_add.last | split: "." %}
|
||||
<script> console.log("{{ domain }}") </script>
|
||||
|
||||
<script>
|
||||
aptrinsic("identify",
|
||||
{
|
||||
"id": "{{ current_person.id }}",
|
||||
"email": "{{ current_person.email }}",
|
||||
"firstName": "{{ current_person.first_name }}",
|
||||
"lastName": "{{ current_person.last_name }}",
|
||||
"signUpDate": "{{ current_person.created_at }}",
|
||||
},
|
||||
{
|
||||
"id":"{{ domain.first }}",
|
||||
"name":"{{ domain.first }}",
|
||||
"content_label": "{{ current_person.my_content_label }}"
|
||||
}
|
||||
);
|
||||
</script>
|
||||
@ -1,119 +0,0 @@
|
||||
<link rel="stylesheet" href="https://use.typekit.net/ghp1udi.css">
|
||||
<header class="np-header np-header-color">
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color" data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"></button>
|
||||
<button data-test="open-mobile-menu" data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer">
|
||||
<img alt="{{ current_person.name }}" class="np-header-avatar-image" src="{{ current_person.avatar_url }}" />
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img alt="{{ current_school.name }}" class="np-header-logo-image" src="{{ current_school.logo_url }}" />
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
{% for website_navigation in navigations.header_navigations_external %}
|
||||
<li class="np-header-desktop-nav-item">
|
||||
<a href="{{ website_navigation.path }}" class="np-header-desktop-nav-link np-header-font-color"
|
||||
target="_blank">
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input aria-label="{% t .search %}" class="np-header-search-input np-header-font-background-color" type="text"
|
||||
name="q" placeholder="{% t .search %}" />
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button class="np-header-avatar-button" data-test="open-desktop-menu" data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip" data-toggle-outside>
|
||||
<img alt="{{ current_person.name }}" class="np-header-avatar-image" src="{{ current_person.avatar_url }}">
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
{% unless current_school.sso_active? %}
|
||||
<a class="np-header-avatar-tooltip-navigation-link" href="{% route account %}">
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a class="np-header-avatar-tooltip-navigation-link np-danger" href="{% route logout %}">
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a class="np-header-sign-in np-header-desktop-nav-link np-header-font-color" aria-label="{% t shared.sign_in %}"
|
||||
href="{% route login %}">
|
||||
{% t shared.sign_in %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img alt="{{ current_person.name }}" class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}" />
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form class="np-header-search" data-test="mobile-search" method="get" action="{% route search %}">
|
||||
<input aria-label="{% t .search %}" class="np-header-search-input" type="text" name="q"
|
||||
placeholder="{% t .search %}" />
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a href="{{ website_navigation.path }}" class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a class="np-header-mobile-menu-content-button" href="{% route account %}">
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a class="np-header-mobile-menu-content-button np-danger" href="{% route logout %}">
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
@ -1,85 +0,0 @@
|
||||
<div id="path-banner" class="np-resource-header np-resource-header-card np-card-padding-large">
|
||||
<div id="path-text-title" class="np-top-vocabulary np-text-title">
|
||||
{% t shared.learning_path.title %}
|
||||
<i id="path-icon-lp" class="far fa-road np-button-color np-learning-path-icon"></i>
|
||||
</div>
|
||||
<div id="path-banner-title" class="np-top-title">
|
||||
<a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">
|
||||
<i id="path-arrow" class="far fa-arrow-left np-icon-back"></i>
|
||||
</a>
|
||||
{{ learning_path.name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<div class="np-card-container">
|
||||
<img src="{{ learning_path.image_url }}" class="np-top-image" alt="{{ learning_path.name }}" />
|
||||
<div class="np-card-padding-dynamic">
|
||||
{% include "learning_path_description" %}
|
||||
{% include "learning_path_instructors" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 np-grid-spacing">
|
||||
<div class="np-top-cta">
|
||||
{% include "learning_path_progress_and_cta" %}
|
||||
</div>
|
||||
{% include "learning_path_outline" %}
|
||||
</div>
|
||||
</div>
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
|
||||
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var url = window.location.pathname;
|
||||
if (url.indexOf('/app/learning_paths/283ab1f9-5bd5-4e64-b6e5-4a3a5e0cde5a') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y1 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/577d28e6-b581-44fe-90bf-aff269c8394d') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y1 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/b56514cf-6bfc-44f0-b213-089aed603961') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y2 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/93c7eb64-c9b6-4028-ab58-1ef5eeffb37e') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y2 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/3266a89f-8aa2-4f2e-9039-db5500e2d4ab') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y3 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/7f43d5da-1275-45bc-8618-29cb20c0a179') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y4 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else {
|
||||
$("#path-banner").attr("class", "np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "np-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left np-icon-back");
|
||||
$("#path-icon-lp").attr("class", "far fa-road np-button-color np-learning-path-icon");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary np-text-title");
|
||||
}
|
||||
</script>
|
||||
@ -1,32 +0,0 @@
|
||||
{% 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="col-xs-12 col-sm-8">
|
||||
{% if features.learning_paths? %}
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t shared.learning_paths %}
|
||||
</div>
|
||||
{% include "learning_paths_index", items: learning_paths.enrolled %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if features.training_events? %}
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-4">
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t .upcoming_events %}
|
||||
</div>
|
||||
{% include "training_events_dashboard" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="row np-flex-center">
|
||||
<div class="col-xs-12 col-sm-12">
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t shared.course_vocabulary.plural, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
{% include "courses_index", class: "col-xs-12 col-sm-4 np-stretch-content" %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,69 +0,0 @@
|
||||
/*
|
||||
Put your custom overlay styles in here
|
||||
You can use your northpass color palette in this file
|
||||
|
||||
{{ color_palette.button_font_color }}
|
||||
{{ color_palette.button_color }}
|
||||
{{ color_palette.button_hover_color }}
|
||||
{{ color_palette.header_font_color }}
|
||||
{{ color_palette.header_font_hover_color }}
|
||||
{{ color_palette.header_color }}
|
||||
*/
|
||||
|
||||
body {
|
||||
font-family: Soleil, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.np-header {
|
||||
height: 65px !important;
|
||||
}
|
||||
|
||||
.np-header-logo {
|
||||
justify-content: flex-end !important;
|
||||
}
|
||||
|
||||
.np-header-avatar-image,
|
||||
.np-header-logo-image {
|
||||
height: 38px !important;
|
||||
}
|
||||
|
||||
.np-header-desktop-nav {
|
||||
width: 0%;
|
||||
}
|
||||
}
|
||||
|
||||
.np-header-font-background-color {
|
||||
background: #1d1d1b;
|
||||
}
|
||||
|
||||
.np-footer {
|
||||
background: #1d1d1b;
|
||||
}
|
||||
|
||||
.np-footer-logo-image {
|
||||
filter: grayscale(0) contrast(1) !important;
|
||||
height: 40px !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.np-footer-support-help {
|
||||
color: #fff !important;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.np-footer-support-item {
|
||||
color: #fff !important;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.np-footer+.np-powered-by {
|
||||
background: #1d1d1b !important;
|
||||
}
|
||||
|
||||
.np-powered-by-link {
|
||||
color: #fff !important;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
}
|
||||
@ -1,141 +0,0 @@
|
||||
<div class="np-resource-title">
|
||||
{% t .header %}
|
||||
</div>
|
||||
<div class="np-form-field {% if form.errors contains 'email' %}np-account-form-field-error{% endif %}">
|
||||
<label class="np-input-label" for="{{version}}_learner_email">{% t shared.email %} *</label>
|
||||
<input
|
||||
{% if form.options.invite? %} disabled {% endif %}
|
||||
autofocus="autofocus"
|
||||
class="np-input"
|
||||
id="{{version}}_learner_email"
|
||||
name="learner[email]"
|
||||
type="email"
|
||||
value="{{ form.email }}"
|
||||
/>
|
||||
</div>
|
||||
<div class="np-form-field {% if form.errors contains 'first_name' %}np-account-form-field-error{% endif %}">
|
||||
<label class="np-input-label" for="{{version}}_learner_first_name">
|
||||
{% t shared.first_name %} *
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
id="{{version}}_learner_first_name"
|
||||
name="learner[first_name]"
|
||||
value="{{ form.first_name }}"
|
||||
/>
|
||||
</div>
|
||||
<div class="np-form-field {% if form.errors contains 'last_name' %}np-account-form-field-error{% endif %}">
|
||||
<label class="np-input-label" for="{{version}}_learner_last_name">
|
||||
{% t shared.last_name %} *
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
id="{{version}}_learner_last_name"
|
||||
name="learner[last_name]"
|
||||
value="{{ form.last_name }}"
|
||||
/>
|
||||
</div>
|
||||
<div class="np-form-field {% if form.errors contains 'display_name' %}np-account-form-field-error{% endif %}">
|
||||
<label class="np-input-label" for="{{version}}_learner_display_name">
|
||||
{% t .display_name %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
id="{{version}}_learner_display_name"
|
||||
name="learner[display_name]"
|
||||
value="{{ form.display_name }}"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{% unless form.options.invite? %}
|
||||
<div class="np-form-field {% if form.errors contains 'current_password' %}np-account-form-field-error{% endif %}">
|
||||
<label class="np-input-label" for="{{version}}_learner_current_password">
|
||||
{% t .current_password %} *
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
id="{{version}}_learner_current_password"
|
||||
name="learner[current_password]"
|
||||
type="password"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="np-form-field {% if form.errors contains 'password' %}np-account-form-field-error{% endif %}">
|
||||
<label class="np-input-label" for="{{version}}_learner_password">
|
||||
{% t .new_password %} *
|
||||
</label>
|
||||
<label class="np-input-label" for="desktop_learner_password">Password must be a minimum of 8 characters, with at least 1 capital letter, 1 number, and 1 special character.</label>
|
||||
<input
|
||||
class="np-input"
|
||||
id="{{version}}_learner_password"
|
||||
name="learner[password]"
|
||||
type="password"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="np-form-field {% if form.errors contains 'password_confirmation' %}np-account-form-field-error{% endif %}">
|
||||
<label class="np-input-label" for="{{version}}_learner_password_confirmation">
|
||||
{% t .confirm_new_password %} *
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
id="{{version}}_learner_password_confirmation"
|
||||
name="learner[password_confirmation]"
|
||||
type="password"
|
||||
/>
|
||||
</div>
|
||||
{% endunless %}
|
||||
|
||||
{% if form.options.invite? %}
|
||||
<div class="np-form-field {% if form.errors contains 'password' %}np-account-form-field-error{% endif %}">
|
||||
<label class="np-input-label" for="{{version}}_learner_password">
|
||||
{% t shared.password %} *
|
||||
</label>
|
||||
<label class="np-input-label" for="desktop_learner_password">Password must be a minimum of 8 characters, with at least 1 capital letter, 1 number, and 1 special character.</label>
|
||||
<input
|
||||
class="np-input"
|
||||
id="{{version}}_learner_password"
|
||||
name="learner[password]"
|
||||
type="password"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{% if form.terms_of_service_required? %}
|
||||
<div class="np-form-field terms-of-service {% if form.errors contains 'terms_of_service_accepted' %}np-account-form-field-error{% endif %}">
|
||||
<input
|
||||
id="{{version}}_learner_terms_of_service"
|
||||
name="learner[terms_of_service_accepted]"
|
||||
type="checkbox"
|
||||
/>
|
||||
<div class="label">
|
||||
{% t .terms_of_service %}
|
||||
<a
|
||||
target="_blank"
|
||||
href={{ form.terms_of_service_url }}
|
||||
>
|
||||
{% t .terms_link %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="np-margin-top">
|
||||
<span class="np-form-terms ">
|
||||
{% t .terms %}
|
||||
<a
|
||||
class="np-form-link np-button-color"
|
||||
target="_blank"
|
||||
href={{ form.terms_of_service_url }}
|
||||
>
|
||||
{% t .terms_link %}
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<input
|
||||
id="{{version}}_invite_token"
|
||||
name="learner[token]"
|
||||
value="{{ form.invite_token }}"
|
||||
type="hidden"
|
||||
/>
|
||||
{% endif %}
|
||||
@ -1,66 +0,0 @@
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 and course.properties.badge_course == true %}
|
||||
{% if course.name contains 'Omni' %}
|
||||
<div class="card-wrapper">
|
||||
<div class="card">
|
||||
<div class="lp-link">
|
||||
<div class="card-badge">
|
||||
<img alt=""
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Cin7/badges/academy-badge_omni.png"
|
||||
class="badge-card-image"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% elsif course.name contains 'Core' %}
|
||||
<div class="card-wrapper">
|
||||
<div class="card">
|
||||
<div class="lp-link">
|
||||
<div class="card-badge">
|
||||
<img alt=""
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Cin7/badges/academy-badge_core.png"
|
||||
class="badge-card-image"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if course.id == "0e5dc9ea-3ace-408c-8b8d-2841ba88bc66" %}
|
||||
<div class="card-wrapper">
|
||||
<div class="card">
|
||||
<div class="lp-link">
|
||||
<div class="card-badge">
|
||||
<img alt=""
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Cin7/badges/partner-badge_implementer-services.png"
|
||||
class="badge-card-image"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if course.id == "75be65eb-2941-42a5-9088-c0df68bf3fd8" %}
|
||||
<div class="card-wrapper">
|
||||
<div class="card">
|
||||
<div class="lp-link">
|
||||
<div class="card-badge">
|
||||
<img alt=""
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Cin7/badges/partner-badge_referral-partner.png"
|
||||
class="badge-card-image"
|
||||
/>
|
||||
</div>
|
||||
{% comment %}
|
||||
<div class="card-content card-content-badge">
|
||||
<h3 class="card-content-title course-name">
|
||||
{% if course.name contains 'Omni' %}Omni{% elsif course.name contains 'Core' %}Core{% endif %} Course Completed
|
||||
</h3>
|
||||
</div>
|
||||
{% endcomment %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
@ -1,38 +0,0 @@
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ item.name }}"
|
||||
src="{{ item.image_url }}"
|
||||
>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<h3 class="np-catalog-card-title">
|
||||
{{ item.name }}
|
||||
</h3>
|
||||
<div class="np-product-badge np-product-badge-catalog">
|
||||
<i class="far {{ item.icon }} np-product-badge-icon np-product-badge-catalog-icon"></i>
|
||||
<h3 class="np-product-badge-name np-product-badge-catalog-name">{{ item.formatted_type }}</h3>
|
||||
</div>
|
||||
<div class="np-card-content-footer np-catalog-card-footer">
|
||||
{% if item.free_course? %}
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: item.progress %}
|
||||
</div>
|
||||
{% if item.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: item.path %}
|
||||
{% endif %}
|
||||
<a class="np-button np-button-wide" href="{{ item.path }}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
{% else %}
|
||||
<span class="np-catalog-card-price">
|
||||
{{ item.formatted_price}}
|
||||
</span>
|
||||
<a class="np-button np-button-wide" href="{{ item.path }}">
|
||||
{% t shared.learn_more %}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,44 +0,0 @@
|
||||
<div class="card" categories="{%for category in course.categories%}{{category.name}}[$]{%endfor%}" duration="{{course.properties.course_duration}}">
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
<a class="lp-link" href="{{ course_path }}">
|
||||
<div class="card-image">
|
||||
<img
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
class="learning-path-card-image"
|
||||
/>
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon" {% if course.ribbon == "Omni" %} style="background: #0026b2;"
|
||||
{% elsif course.ribbon == "Core"%} style="background: #05CBBF"
|
||||
{% else %} style="background: #213343"
|
||||
{% endif %}>
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-type"><i class="far fa-graduation-cap"></i> COURSE </div>
|
||||
<h3 class="card-content-title course-name">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
<div class="course-desc">
|
||||
{{ course.short_description }}
|
||||
</div>
|
||||
<div class="course-details">
|
||||
{% if course.properties.course_duration %}
|
||||
<div class="course-time">
|
||||
<i class="far fa-clock"></i>
|
||||
{{course.properties.course_duration}} min
|
||||
</div>
|
||||
{% endif %}
|
||||
{% unless course.properties.audience == 'missing property: audience' %}
|
||||
<div class="recommended">
|
||||
<i class="far fa-users"></i>
|
||||
{{course.properties.audience}}
|
||||
</div>
|
||||
{% endunless %}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -1,68 +0,0 @@
|
||||
<div class="np-card np-no-horizontal-padding lp-card" categories="{%for category in learning_path.categories%}{{category.name}}[$]{%endfor%}">
|
||||
<div class="np-card-container">
|
||||
<div class="np-learning-path">
|
||||
<div class="lp-image-container">
|
||||
<img
|
||||
alt="{{ learning_path.name }}"
|
||||
class="np-card-image np-learning-path-image"
|
||||
src="{{ learning_path.image_url }}"
|
||||
/>
|
||||
</div>
|
||||
<div class="np-card-text-wrapper">
|
||||
<div class="np-hidden-desktop np-card-header">
|
||||
<i class="np-card-header-icon far fa-road"></i>
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<div class="np-hidden-desktop np-card-header-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-card-header">
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<i class="np-card-header-icon far fa-road"></i>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ learning_path.instructor_names }}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-description">
|
||||
{{ learning_path.description }}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ learning_path.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-hidden-desktop np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
<a class="lp-button" href="{% route learning_path, id: learning_path.id %}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
<span class="np-hidden-mobile np-learning-path-items">
|
||||
<i class="np-button-color np-learning-path-items-icon far fa-graduation-cap"></i>
|
||||
<span class="np-learning-path-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,27 +0,0 @@
|
||||
<div class="card">
|
||||
<a class="lp-link" href="{% route learning_path, id: learning_path.id %}">
|
||||
<div class="card-image">
|
||||
<img
|
||||
alt="{{ learning_path.name }}"
|
||||
class="learning-path-card-image"
|
||||
src="{{ learning_path.image_url }}"
|
||||
/>
|
||||
{% if learning_path.name contains "Omni" or learning_path.name contains "Core"%}
|
||||
<div class="np-card-ribbon" {% if learning_path.name contains "Omni" %} style="background: #0026b2;"{% endif %}>
|
||||
{% if learning_path.name contains "Omni" %}
|
||||
Omni
|
||||
{% elsif learning_path.name contains "Core" %}
|
||||
Core
|
||||
{% endif %}
|
||||
</div>
|
||||
{%endif%}
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-type"><i class="far fa-road"></i> LEARNING PATH</div>
|
||||
<h3 class="card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -1,38 +0,0 @@
|
||||
<div class="card">
|
||||
<a class="card-container" href="{% route training_session, id: training_event.sessions.first.id %}">
|
||||
<div class="np-card-content-training-event">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ training_event.title }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle">
|
||||
{% t shared.event_types, key: training_event.event_type %}
|
||||
</div>
|
||||
<div class="np-card-training-session">
|
||||
<span class="np-card-content-label">
|
||||
{% t .next_session %}
|
||||
</span>
|
||||
<div class="np-card-training-session-date">
|
||||
<div class="np-card-training-session-date-day">
|
||||
{{ training_event.sessions.first.day }}
|
||||
</div>
|
||||
<div>
|
||||
<div class="np-card-training-session-date-month">
|
||||
{{ training_event.sessions.first.month }}
|
||||
</div>
|
||||
<div class="np-card-training-session-date-year">
|
||||
{{ training_event.sessions.first.year }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<div class="np-card-training-sessions">
|
||||
<i class="np-card-training-sessions-icon far fa-calendar-star"></i>
|
||||
<span class="np-card-training-sessions-label">
|
||||
{% t .sessions, count: training_event.sessions.size %}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
@ -1,12 +0,0 @@
|
||||
|
||||
<a class="card category-card" href="/app/catalog?category={{category.name}}">
|
||||
<div class="card-category">
|
||||
<img class="badge-card-image" src="{{category_images[counter]}}" alt="">
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-content-title">{{category.name}}</h3>
|
||||
<div class="course-desc">Browse all courses for {{category.name}}.</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
@ -1,25 +0,0 @@
|
||||
|
||||
<a class="card category-card" href="/app/learning_paths?category={{category.name}}&category=Deep Dive: Core">
|
||||
<div class="core-category-wrapper">
|
||||
<div class="card-category card-category-core">
|
||||
<img class="badge-card-image card-category-image-core"
|
||||
{% if category.name == 'Warehouse Operations: Core' %}
|
||||
src="{{category_images[4]}}" alt=""
|
||||
{% elsif category.name == 'Admin: Core' %}
|
||||
src="{{category_images[1]}}" alt=""
|
||||
{% elsif category.name == 'Product Management: Core' %}
|
||||
src="{{category_images[2]}}" alt=""
|
||||
{% elsif category.name == 'Accounting: Core' %}
|
||||
src="{{category_images[0]}}" alt=""
|
||||
{% elsif category.name == 'Simple Manufacturing: Core' %}
|
||||
src="{{category_images[3]}}" alt=""
|
||||
{% endif %}
|
||||
>
|
||||
</div>
|
||||
<div class="card-content card-content-core">
|
||||
<h3 class="card-content-title">{{category.name | replace: ": Core", " Deep Dives"}}</h3>
|
||||
<div class="course-desc course-desc-category-core">Level up your expertise and enhance your operations with {{category.name | replace: ": Core", " Deep Dives"}}.</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
@ -1,64 +0,0 @@
|
||||
{% assign unique_category = "" %}
|
||||
{% assign category_images = 'https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images/Category+Icon+1.png,https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images/Category+Icon+2.png,https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images/Category+Icon+3.png,https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images/Category+Icon+4.png' | split: ',' %}
|
||||
{% assign category_counter = 0 %}
|
||||
|
||||
|
||||
<div class="category-carousel">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name contains 'Omni' %}
|
||||
{% unless unique_category contains category.name %}
|
||||
{% include 'category_cards' counter: category_counter %}
|
||||
{% assign unique_category = unique_category | append: category.name %}
|
||||
{% assign category_counter = category_counter | plus: 1 %}
|
||||
{% if category_counter > 3 %}
|
||||
{% assign category_counter = 0 %}
|
||||
{% endif %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.category-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.category-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,64 +0,0 @@
|
||||
{% assign unique_category = "" %}
|
||||
{% assign category_images = 'https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Accounting+Deep+Dives+-+Thumbnails.png, https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Administrative+Deep+Dives+-+Thumbnail.png, https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Product+Management+Deep+Dives+-+Thumbnail.png, https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Simple+Manufacturing+Deep+Dives+-+Thumbnail.png, https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Warehouse+Operations+Deep+Dives+-+Thumbnail.png' | split: ', ' %}
|
||||
{% assign category_counter = 0 %}
|
||||
{% assign core_categories = 'Warehouse Operations: Core, Admin: Core, Product Management: Core, Accounting: Core, Simple Manufacturing: Core' | split: ", " %}
|
||||
|
||||
<div class="category-carousel-core">
|
||||
{% for learning_path in learning_paths.available %}
|
||||
{% for category in learning_path.categories %}
|
||||
{% if core_categories contains category.name %}
|
||||
{% unless unique_category contains category.name %}
|
||||
{% include 'category_cards_core' counter: category_counter %}
|
||||
{% assign unique_category = unique_category | append: category.name %}
|
||||
{% assign category_counter = category_counter | plus: 1 %}
|
||||
{% if category_counter > 3 %}
|
||||
{% assign category_counter = 0 %}
|
||||
{% endif %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.category-carousel-core').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.category-carousel-core {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,10 +0,0 @@
|
||||
<h3 class="np-card-heading">
|
||||
{% t .header %}
|
||||
</h3>
|
||||
<div class="np-flex">
|
||||
{% for category in course.categories %}
|
||||
<div class="np-content-categories-content-item">
|
||||
{{ category.name }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
@ -1,6 +0,0 @@
|
||||
<h3 class="np-card-heading">
|
||||
{% t .header, key: current_school.course_vocabulary %}
|
||||
</h3>
|
||||
<div class="np-card-text">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
@ -1,78 +0,0 @@
|
||||
{% assign omni = false %}
|
||||
{% assign core = false %}
|
||||
{% assign partners = false %}
|
||||
{% assign redirect = false %}
|
||||
{% assign both_gorups = false %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% for group in current_person.groups %}
|
||||
{% if group.name contains 'Partners' %}
|
||||
{% assign partners = true %}
|
||||
{% else %}
|
||||
{% if group.name contains 'Core' %}
|
||||
{% assign core = true %}
|
||||
{% elsif group.name contains 'Omni' %}
|
||||
{% assign omni = true %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if omni and core %}
|
||||
{% assign both_gorups = true %}
|
||||
{% endif %}
|
||||
|
||||
{% unless partners or both_gorups %}
|
||||
{% if core and course.name contains 'Omni' %}
|
||||
{% assign redirect = true %}
|
||||
{% elsif omni and course.name contains 'Core' %}
|
||||
{% assign redirect = true %}
|
||||
{% endif %}
|
||||
{% endunless %}
|
||||
|
||||
{% if redirect %}
|
||||
<script>window.location.replace('/app')</script>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-card-container">
|
||||
<div class="lp-header-container">
|
||||
<div class="lp-heading lora course-name"> {{ course.name }}</div>
|
||||
</div>
|
||||
|
||||
<div class="np-divider"></div>
|
||||
<div class="row np-course-content np-card-padding-dynamic">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
{% 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>
|
||||
@ -1,16 +0,0 @@
|
||||
<div class="np-top-vocabulary np-text-title np-text-muted">
|
||||
{{ current_school.course_vocabulary }}
|
||||
<i class="far fa-graduation-cap np-button-color np-learning-path-icon np-hidden-mobile">
|
||||
</i>
|
||||
</div>
|
||||
<div class="np-top-title course-name">
|
||||
<a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">
|
||||
<i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
|
||||
</a>
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-hidden-desktop"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
@ -1,40 +0,0 @@
|
||||
<div class="np-course-outline">
|
||||
<div class="np-text-title np-course-outline-title">
|
||||
{% t .header, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<div class="np-course-outline-content">
|
||||
<ol class="np-course-outline-content-section">
|
||||
{% for section in course.sections %}
|
||||
<li class="np-course-outline-content-section-list">
|
||||
<div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold">
|
||||
{{ section.name }}
|
||||
</div>
|
||||
<ol class="np-course-outline-content-activity">
|
||||
{% for activity in section.activities %}
|
||||
|
||||
<li class="np-course-outline-content-activity-list">
|
||||
{% if activity.completed? %}
|
||||
<i class="fas fa-circle np-course-outline-content-activity-icon np-button-color"></i>
|
||||
{% if activity.locked? %}
|
||||
{% include "course_activity_locked" %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link-completed" %}
|
||||
{% endif %}
|
||||
<div class="np-button-background-color np-course-outline-content-activity-list-bar"></div>
|
||||
{% else %}
|
||||
<i class="far fa-circle np-course-outline-content-activity-icon"></i>
|
||||
{% if activity.locked? %}
|
||||
{% include "course_activity_locked" %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link" %}
|
||||
{% endif %}
|
||||
<div class="np-course-outline-content-activity-list-bar"></div>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,54 +0,0 @@
|
||||
<div class="np-top-cta-progress-content">
|
||||
<div class="np-top-cta-progress-title np-text-title">
|
||||
{% t .header %}
|
||||
</div>
|
||||
<div class="np-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ course.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-top-cta-progress-text
|
||||
{% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
|
||||
">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if course.learner_can_retake? %}
|
||||
<form action="{% route course_retake, id: course.id %}" method="POST">
|
||||
{% form_authenticity_token %}
|
||||
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
|
||||
{% t .retake, key: current_school.course_vocabulary %}
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
{% if current_person.signed_in? == false%}
|
||||
<a
|
||||
class="lp-button" href="/learners/sign_in"
|
||||
>
|
||||
Sign In
|
||||
</a>
|
||||
{% else %}
|
||||
<a
|
||||
class="lp-button"
|
||||
{% 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 %}
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif course.started? == false %}
|
||||
{% t shared.course.start, key: current_school.course_vocabulary %}
|
||||
{% elsif course.completed? %}
|
||||
{% t shared.course.view, key: current_school.course_vocabulary %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
@ -1,43 +0,0 @@
|
||||
{% if courses.in_catalog.any? %}
|
||||
<div class=" row">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if current_person.signed_in? %}
|
||||
|
||||
{% if partners or both_gorups %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% if omni %}
|
||||
{% if course.name contains 'Omni' %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% elsif core %}
|
||||
{% if course.name contains 'Core' %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.catalog,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}
|
||||
@ -1,6 +0,0 @@
|
||||
<div class="np-dashboard-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
{{ message }}
|
||||
</div>
|
||||
<img class="np-zero-state-courses" alt="{{ message }}" />
|
||||
</div>
|
||||
@ -1,84 +0,0 @@
|
||||
{% assign omni = false %}
|
||||
{% assign core = false %}
|
||||
{% assign log_out = true %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% for group in current_person.groups %}
|
||||
{% if group.name contains 'Core' %}
|
||||
{% assign core = true %}
|
||||
{% elsif group.name contains 'Omni' %}
|
||||
{% assign omni = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
|
||||
<div class="carousel-wrapper">
|
||||
<div class="feature-courses-carousel">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if core %}
|
||||
{% if course.properties.feature_course_core == true %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% elsif omni %}
|
||||
{% if course.properties.feature_course_omni == true %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% if course.properties.feature_course_omni == true and course.properties.feature_course_core == true %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.feature-courses-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 5,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.my-courses-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,233 +0,0 @@
|
||||
<div class="filter-heading lora">Filters</div>
|
||||
<div class="filters-option-container">
|
||||
<div class="filter-categories">
|
||||
<div class="filter-option-heading">Categories</div>
|
||||
{% if omni %}
|
||||
<div class="filter-option-container" id="categoryFilters">
|
||||
{% assign unique_omni_categories = "" %}
|
||||
{% for course in courses.in_catalog %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name contains 'Omni' %}
|
||||
{% unless unique_omni_categories contains category.name %}
|
||||
<div class="category-option">
|
||||
<input class="filter-checkbox" type="checkbox" id="{{category.name}}" />
|
||||
<label>{{category.name}}</label>
|
||||
</div>
|
||||
{% assign unique_omni_categories = unique_omni_categories | append: category.name %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% elsif core %}
|
||||
<div class="filter-option-container" id="categoryFilters">
|
||||
{% assign unique_core_categories = "" %}
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name contains '[Core]' %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name contains 'Core' %}
|
||||
{% unless unique_core_categories contains category.name %}
|
||||
<div class="category-option">
|
||||
<input class="filter-checkbox" type="checkbox" id="{{category.name}}" />
|
||||
<label>{{category.name}}</label>
|
||||
</div>
|
||||
{% assign unique_core_categories = unique_core_categories | append: category.name %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{%elsif log_out%}
|
||||
<div class="filter-option-container" id="categoryFilters">
|
||||
{% assign unique_core_categories = "" %}
|
||||
{% for course in courses.in_catalog %}
|
||||
{% for category in course.categories %}
|
||||
{% unless unique_core_categories contains category.name %}
|
||||
<div class="category-option">
|
||||
<input class="filter-checkbox" type="checkbox" id="{{category.name}}" />
|
||||
<label>{{category.name}}</label>
|
||||
</div>
|
||||
{% assign unique_core_categories = unique_core_categories | append: category.name %}
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="fiter-duration">
|
||||
<div class="filter-option-heading">Course Duration</div>
|
||||
<div class="filter-option-container" id="course-duration">
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<10" />
|
||||
<label>< 10 min</label>
|
||||
</div>
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<20" />
|
||||
<label>< 20 min</label>
|
||||
</div>
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<30" />
|
||||
<label>< 30 min</label>
|
||||
</div>
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<45" />
|
||||
<label>< 45 min</label>
|
||||
</div>
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<60" />
|
||||
<label>< 60 min</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.filter-container {
|
||||
width: 25%;
|
||||
height: fit-content;
|
||||
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
||||
padding: 1.5rem;
|
||||
border-radius: 20px;
|
||||
color: #002f6f;
|
||||
}
|
||||
.filter-heading {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.filter-option-heading {
|
||||
font-weight: 700;
|
||||
}
|
||||
.filter-option-container {
|
||||
margin: 15px 10px;
|
||||
}
|
||||
.category-option, .time-option {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
|
||||
function sortLabelsAlphabetically() {
|
||||
const categoryContainer = document.getElementById("categoryFilters");
|
||||
const categoryOptions = categoryContainer.querySelectorAll(".category-option");
|
||||
const categoryOptionsArray = Array.from(categoryOptions);
|
||||
|
||||
categoryOptionsArray.sort((a, b) => {
|
||||
const labelA = a.querySelector("label").innerText.toLowerCase();
|
||||
const labelB = b.querySelector("label").innerText.toLowerCase();
|
||||
return labelA.localeCompare(labelB);
|
||||
});
|
||||
|
||||
categoryContainer.innerHTML = "";
|
||||
|
||||
categoryOptionsArray.forEach((categoryOption) => {
|
||||
categoryContainer.appendChild(categoryOption);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
var categoryCheckboxes = document.querySelectorAll('.filter-checkbox');
|
||||
var durationCheckboxes = document.querySelectorAll('.duration-checkbox');
|
||||
|
||||
|
||||
categoryCheckboxes.forEach(function (checkbox) {
|
||||
checkbox.addEventListener('change', function () {
|
||||
filterCourses();
|
||||
});
|
||||
});
|
||||
|
||||
durationCheckboxes.forEach(function (checkbox) {
|
||||
checkbox.addEventListener('change', function () {
|
||||
filterCourses();
|
||||
});
|
||||
});
|
||||
|
||||
var urlParams = new URLSearchParams(window.location.search);
|
||||
var categoriesFromUrl = urlParams.getAll('category');
|
||||
var durationFromUrl = urlParams.get('duration');
|
||||
|
||||
if (categoriesFromUrl.length > 0) {
|
||||
categoriesFromUrl.forEach(function(category) {
|
||||
var categoryCheckbox = document.getElementById(category);
|
||||
if (categoryCheckbox) {
|
||||
categoryCheckbox.click();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (durationFromUrl) {
|
||||
var durationCheckbox = document.getElementById(durationFromUrl);
|
||||
if (durationCheckbox) {
|
||||
durationCheckbox.click();
|
||||
}
|
||||
}
|
||||
sortLabelsAlphabetically();
|
||||
filterCourses();
|
||||
});
|
||||
|
||||
|
||||
function filterCourses() {
|
||||
var selectedCategories = getSelectedCategories();
|
||||
var selectedDurations = getSelectedDurations();
|
||||
var cards = document.querySelectorAll('.card');
|
||||
|
||||
cards.forEach(function (card) {
|
||||
var categories = card.getAttribute('categories');
|
||||
var duration = parseInt(card.getAttribute('duration'), 10);
|
||||
|
||||
var categoryMatch = selectedCategories.length === 0 || matchesCategories(categories, selectedCategories);
|
||||
var durationMatch = selectedDurations.length === 0 || matchesDuration(duration, selectedDurations);
|
||||
|
||||
if (categoryMatch && durationMatch) {
|
||||
card.parentElement.style.display = 'flex';
|
||||
} else {
|
||||
card.parentElement.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getSelectedCategories() {
|
||||
var selectedCategories = [];
|
||||
var checkboxes = document.querySelectorAll('.filter-checkbox:checked');
|
||||
checkboxes.forEach(function (checkbox) {
|
||||
selectedCategories.push(checkbox.id);
|
||||
});
|
||||
return selectedCategories;
|
||||
}
|
||||
|
||||
function getSelectedDurations() {
|
||||
var selectedDurations = [];
|
||||
var checkboxes = document.querySelectorAll('.duration-checkbox:checked');
|
||||
checkboxes.forEach(function (checkbox) {
|
||||
selectedDurations.push(checkbox.id);
|
||||
});
|
||||
return selectedDurations;
|
||||
}
|
||||
|
||||
function matchesCategories(courseCategories, selectedCategories) {
|
||||
var courseCategoriesArray = courseCategories.split('[$]').map(function (category) {
|
||||
return category.trim();
|
||||
});
|
||||
|
||||
return selectedCategories.some(function (selectedCategory) {
|
||||
return courseCategoriesArray.includes(selectedCategory);
|
||||
});
|
||||
}
|
||||
|
||||
function matchesDuration(courseDuration, selectedDurations) {
|
||||
return selectedDurations.every(function (selectedDuration) {
|
||||
var durationRange = parseInt(selectedDuration.replace('<', ''), 10);
|
||||
return courseDuration < durationRange;
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,53 +0,0 @@
|
||||
{% assign log_out = true %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% endif %}
|
||||
|
||||
<footer class="np-footer">
|
||||
<div class="np-footer-top">
|
||||
{% if website_footer.show_navigation_links? %}
|
||||
<div class="np-footer-navigation">
|
||||
<ul class="np-footer-navigation-list">
|
||||
<div class="footer-heading lora">Resources</div>
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link"
|
||||
href="https://help.omni.cin7.com/hc/en-us"
|
||||
target="_blank"
|
||||
>
|
||||
Omni Help Center
|
||||
</a>
|
||||
</li>
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link"
|
||||
href="https://help.core.cin7.com/hc/en-us"
|
||||
target="_blank"
|
||||
>
|
||||
Core Help Center
|
||||
</a>
|
||||
</li>
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link"
|
||||
href="https://www.cin7.com/product-updates/"
|
||||
target="_blank"
|
||||
>
|
||||
Release Notes
|
||||
</a>
|
||||
</li>
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link"
|
||||
href="mailto:{{ website_footer.school_customer_service_email }}"
|
||||
>
|
||||
{{ website_footer.school_customer_service_email }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
@ -1,41 +0,0 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
|
||||
|
||||
<script src=
|
||||
"https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js">
|
||||
</script>
|
||||
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick.css"/>
|
||||
<!-- Add the slick-theme.css if you want default styling -->
|
||||
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick-theme.css"/>
|
||||
<script type="text/javascript" src="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick.min.js"></script>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
function modifyCourseNames() {
|
||||
var courseElements = document.querySelectorAll('.course-name');
|
||||
|
||||
courseElements.forEach(function(courseElement) {
|
||||
var courseName = courseElement.textContent;
|
||||
var modifiedCourseName = courseName.replace(/\[[^\]]+\]/g, '');
|
||||
courseElement.textContent = modifiedCourseName;
|
||||
});
|
||||
}
|
||||
function removeBadgeShadow() {
|
||||
document.querySelectorAll('.card-badge').forEach(e=>{
|
||||
e.parentElement.parentElement.style.boxShadow='none';
|
||||
})
|
||||
}
|
||||
|
||||
modifyCourseNames();
|
||||
removeBadgeShadow();
|
||||
});
|
||||
|
||||
</script>
|
||||
@ -1,267 +0,0 @@
|
||||
{% assign omni = false %}
|
||||
{% assign core = false %}
|
||||
{% assign partners = false %}
|
||||
{% assign log_out = true %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% for group in current_person.groups %}
|
||||
{% if group.name contains 'Partners' %}
|
||||
{% assign partners = true %}
|
||||
{% else %}
|
||||
{% if group.name contains 'Core' %}
|
||||
{% assign core = true %}
|
||||
{% elsif group.name contains 'Omni' %}
|
||||
{% assign omni = true %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
<header class="np-header np-header-color">
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color"
|
||||
data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
></button>
|
||||
<button
|
||||
data-test="open-mobile-menu"
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
<li class= "np-header-desktop-nav-item">
|
||||
<a
|
||||
href="/app"
|
||||
class="np-header-desktop-nav-link np-header-font-color"
|
||||
>
|
||||
Home
|
||||
</a>
|
||||
</li>
|
||||
<li class= "np-header-desktop-nav-item">
|
||||
<a
|
||||
href="/app/dashboard"
|
||||
class="np-header-desktop-nav-link np-header-font-color"
|
||||
>
|
||||
My Dashboard
|
||||
</a>
|
||||
</li>
|
||||
<li class= "np-header-desktop-nav-item">
|
||||
<a
|
||||
href="/app/catalog"
|
||||
class="np-header-desktop-nav-link np-header-font-color"
|
||||
>
|
||||
Course Catalog
|
||||
</a>
|
||||
</li>
|
||||
<li class= "np-header-desktop-nav-item">
|
||||
<a
|
||||
href="/app/learning_paths"
|
||||
class="np-header-desktop-nav-link np-header-font-color"
|
||||
>
|
||||
Learning Paths
|
||||
</a>
|
||||
</li>
|
||||
<li class= "np-header-desktop-nav-item">
|
||||
<a
|
||||
href="/app/training_events"
|
||||
class="np-header-desktop-nav-link np-header-font-color"
|
||||
>
|
||||
Events
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<i id="search-icon" class="header-search-icon fas fa-search np-header-font-color"></i>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder=""
|
||||
/>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button
|
||||
class="np-header-avatar-button"
|
||||
data-test="open-desktop-menu"
|
||||
data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip"
|
||||
data-toggle-outside
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
aria-label="{% t shared.sign_in %}"
|
||||
href="{% route login %}"
|
||||
>
|
||||
{% t shared.sign_in %}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form
|
||||
class="np-header-search"
|
||||
data-test="mobile-search"
|
||||
method="get"
|
||||
action="{% route search %}"
|
||||
>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{% include "messages" %}
|
||||
|
||||
<style>
|
||||
.header-search-input {
|
||||
display: none;
|
||||
}
|
||||
[data-test="desktop-search"] {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
}
|
||||
.np-header-desktop-nav-list {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
var searchIcon = document.getElementById("search-icon");
|
||||
var searchInput = document.querySelector(".header-search-input");
|
||||
|
||||
searchIcon.addEventListener("click", function(event) {
|
||||
event.stopPropagation();
|
||||
|
||||
if (searchInput.style.display === "block") {
|
||||
searchInput.style.display = "none";
|
||||
} else {
|
||||
searchInput.style.display = "block";
|
||||
}
|
||||
});
|
||||
|
||||
document.addEventListener("click", function(event) {
|
||||
if (event.target !== searchIcon && event.target !== searchInput) {
|
||||
searchInput.style.display = "none";
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@ -1,26 +0,0 @@
|
||||
<div class="heading lora info-section-heading">Transformative education for Connected Inventory Performance</div>
|
||||
<div class="section-content section-content-info">
|
||||
<div class="info-wrapper">
|
||||
<div class="info">
|
||||
<img class="info-icon" src="https://s3.amazonaws.com/static.northpass.com/Cin7/icons/Dynamic+Courses.png" alt="">
|
||||
<div class="info-content">
|
||||
<div class="info-heading">Dynamic courses</div>
|
||||
<div class="info-desc">Developed by our product education professionals</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info">
|
||||
<img class="info-icon" src="https://s3.amazonaws.com/static.northpass.com/Cin7/icons/Results+Driven.png" alt="">
|
||||
<div class="info-content">
|
||||
<div class="info-heading">Results-driven education</div>
|
||||
<div class="info-desc">Designed for you to meet your business goals</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info">
|
||||
<img class="info-icon" src="https://s3.amazonaws.com/static.northpass.com/Cin7/icons/Customer+Centered.png" alt="">
|
||||
<div class="info-content">
|
||||
<div class="info-heading">Customer-centered</div>
|
||||
<div class="info-desc">Supporting you through all stages of your journey</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,48 +0,0 @@
|
||||
|
||||
{% assign counter = 0 %}
|
||||
<div class="carousel-wrapper">
|
||||
<div class="learning-path-carousel">
|
||||
{% for learning_path in learning_paths.available %}
|
||||
{% if learning_path.name contains 'Core' %}
|
||||
<div class="card-wrapper">
|
||||
{% include "cards_learning_path_homepage" with learning_path %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if counter == 0 %}
|
||||
<div class="zero-state-wrapper">
|
||||
<img class="zero-img" src="https://s3.amazonaws.com/static.northpass.com/Cin7/zero+state/no+courses+or+lps+(no+button).png" alt="">
|
||||
<div class="zero-button-wrapper">
|
||||
<a class="lp-button" href="/app/catalog">Continue learning now!</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.learning-path-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>"
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.learning-path-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,49 +0,0 @@
|
||||
|
||||
{% assign counter = 0 %}
|
||||
{% assign learning_paths_core = '50e59300-af4f-40c5-8731-ee88284d8f0d, 3793a1a2-3efa-4cea-afa9-077585520476, a67a07df-f153-4dce-ae93-90f3d76e77df, cdb26bc8-cd06-48dc-b5c4-57349c27b03d, d7d7ff88-3419-4999-b209-13faea260939' | split: ', ' %}
|
||||
<div class="carousel-wrapper">
|
||||
<div class="learning-path-carousel-core">
|
||||
{% for learning_path in learning_paths.available %}
|
||||
{% if learning_paths_core contains learning_path.id%}
|
||||
<div class="card-wrapper">
|
||||
{% include "cards_learning_path_homepage" with learning_path %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if counter == 0 %}
|
||||
<div class="zero-state-wrapper">
|
||||
<img class="zero-img" src="https://s3.amazonaws.com/static.northpass.com/Cin7/zero+state/no+courses+or+lps+(no+button).png" alt="">
|
||||
<div class="zero-button-wrapper">
|
||||
<a class="lp-button" href="/app/catalog">Continue learning now!</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.learning-path-carousel-core').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>"
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.learning-path-carousel-core {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,17 +0,0 @@
|
||||
{% for category in learning_path.categories %}
|
||||
{% if category.name contains "Deep Dive: Core" %}
|
||||
<div class="np-learning-path-completed-banner np-learning-path-banner" style="display: none;">
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
<img class="np-learning-path-banner-image" src="https://s3.amazonaws.com/static.northpass.com/images/stars-completed.svg"/>
|
||||
<div class="np-learning-path-banner-content">
|
||||
<h3 class="np-learning-path-banner-headline">{% t .headline %}</h3>
|
||||
<p class="np-learning-path-banner-description">{% t .description %}</p>
|
||||
<div class="np-learning-path-banner-actions">
|
||||
{% if learning_path.certificate_link %}
|
||||
<a href="{{ learning_path.certificate_link }}" class="np-learning-path-banner-action np-learning-path-banner-action--primary">{% t .actions.certificate %}</a>
|
||||
{% endif %}
|
||||
<a href="/app/courses" class="np-learning-path-banner-action np-learning-path-banner-action--secondary">{% t .actions.more_courses %}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,39 +0,0 @@
|
||||
{% if learning_path.enrolled? and course.unlocked? %}
|
||||
<a
|
||||
class="np-learning-path-outline-item card-container lp-course-card"
|
||||
href="{% route learning_path_course, learning_path_id: learning_path.id, id: course.id %}"
|
||||
>
|
||||
<div class="np-card-content np-card-padding">
|
||||
<div class="learning-path-outline-content">
|
||||
<div class="np-learning-path-outline-name np-top-title course-name">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div class="learning-path-outline-progress
|
||||
{% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
|
||||
">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
</div>
|
||||
{% if course.optional? %}
|
||||
<div class="np-optional-ribbon">
|
||||
{% t shared.optional %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</a>
|
||||
{% else %}
|
||||
<div class="np-learning-path-outline-item np-learning-path-outline-inactive-item np-card-container">
|
||||
<div class="np-card-content np-card-padding">
|
||||
<div class="learning-path-outline-content">
|
||||
<div class="np-learning-path-outline-name np-top-title course-name">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
</div>
|
||||
{% if course.optional? %}
|
||||
<div class="np-optional-ribbon">
|
||||
{% t shared.optional %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -1,6 +0,0 @@
|
||||
<h3 class="np-card-heading">
|
||||
About this Learning Path
|
||||
</h3>
|
||||
<div class="np-card-text">
|
||||
{{ learning_path.description }}
|
||||
</div>
|
||||
@ -1,33 +0,0 @@
|
||||
{% assign log_out = true %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% endif %}
|
||||
|
||||
{% if log_out %}
|
||||
<script>window.location.replace('/app')</script>
|
||||
{% endif %}
|
||||
|
||||
<div class="lp-desktop-wrapper">
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<div class="np-card-container card-learning-path-desktop">
|
||||
<img
|
||||
src="{{ learning_path.image_url }}"
|
||||
class="np-top-image image-learning-path-desktop"
|
||||
alt="{{ learning_path.name }}"
|
||||
/>
|
||||
<div class="np-card-padding-dynamic">
|
||||
{% include "learning_path_description" %}
|
||||
{% include "learning_path_instructors" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 np-grid-spacing lp-progress-and-cta-wrapper">
|
||||
<div class="np-top-cta">
|
||||
{% include "learning_path_progress_and_cta" %}
|
||||
</div>
|
||||
{% include "learning_path_outline" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,5 +0,0 @@
|
||||
<div class="lp-header-container">
|
||||
<div class="lp-heading lora">
|
||||
{{ learning_path.name }}
|
||||
</div>
|
||||
</div>
|
||||
@ -1,12 +0,0 @@
|
||||
<div class="np-learning-path-new-content-banner np-learning-path-banner">
|
||||
<div class="np-learning-path-banner-content">
|
||||
<h3 class="np-learning-path-banner-headline">{% t .headline %}</h3>
|
||||
<p class="np-learning-path-banner-description">{% t .description %}</p>
|
||||
<div class="np-learning-path-banner-actions">
|
||||
{% learning_path_next_step_button learning_path, class: "np-learning-path-banner-action np-learning-path-banner-action--primary" %}
|
||||
{% if learning_path.certificate_link %}
|
||||
<a href="{{ learning_path.certificate_link }}" class="np-learning-path-banner-action np-learning-path-banner-action--secondary">{% t .actions.view_certificate %}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,17 +0,0 @@
|
||||
{% if learning_path.enrolled? %}
|
||||
<div class="np-top-cta-progress-content" >
|
||||
<div class="lp-progress-text
|
||||
{% if learning_path.completed? %} np-color-success {% else %} np-button-color {% endif %}
|
||||
">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if current_person.signed_in? == false %}
|
||||
<a class="lp-button" href="/learners/sign_in">
|
||||
Sign In
|
||||
</a>
|
||||
{% else %}
|
||||
{% learning_path_next_step_button learning_path, class: "lp-button" %}
|
||||
{% endif %}
|
||||
@ -1,50 +0,0 @@
|
||||
{% if learning_path.enrolled? and training_session.unlocked? %}
|
||||
<div class="np-learning-path-outline-bar np-hidden-mobile"></div>
|
||||
<a
|
||||
class="np-learning-path-outline-item np-card-container"
|
||||
href="{% route training_session, id: training_session.id %}"
|
||||
>
|
||||
<div class="np-card-content np-card-padding">
|
||||
<div class="np-events-content-date np-button-background-color">
|
||||
<div class="np-events-content-month">
|
||||
{{ training_session.month }}
|
||||
</div>
|
||||
<div class="np-events-content-day">
|
||||
{{ training_session.day }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-learning-path-outline-content">
|
||||
<div class="np-learning-path-outline-name np-top-title">{{ training_session.name }}</div>
|
||||
<div class="np-events-content-time np-learning-path-outline-time np-button-color">
|
||||
{{ training_session.time }} {{ training_session.time_zone }}
|
||||
</div>
|
||||
</div>
|
||||
{% if training_session.optional? %}
|
||||
<div class="np-optional-ribbon">
|
||||
{% t shared.optional %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</a>
|
||||
{% else %}
|
||||
<div class="np-learning-path-outline-item np-card-container np-learning-path-outline-inactive-item">
|
||||
<div class="np-card-content np-card-padding">
|
||||
<div class="np-events-content-date np-button-background-color">
|
||||
<div class="np-events-content-month">
|
||||
{{ training_session.month }}
|
||||
</div>
|
||||
<div class="np-events-content-day">
|
||||
{{ training_session.day }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-learning-path-outline-content">
|
||||
<div class="np-learning-path-outline-name np-top-title">{{ training_session.name }}</div>
|
||||
</div>
|
||||
{% if training_session.optional? %}
|
||||
<div class="np-optional-ribbon">
|
||||
{% t shared.optional %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -1,22 +0,0 @@
|
||||
<div class="np-learning-paths-resources">
|
||||
{% if items.any? %}
|
||||
{% for learning_path in items %}
|
||||
{% if core %}
|
||||
{% if learning_path.name contains 'Core' %}
|
||||
{% include "cards_learning_path" with learning_path %}
|
||||
{% endif %}
|
||||
{% elsif omni %}
|
||||
{% if learning_path.name contains 'Omni'%}
|
||||
{% include "cards_learning_path" with learning_path %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<div class="np-learning-paths-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
{% t .empty %}
|
||||
</div>
|
||||
<img class="np-zero-state-learning-paths" alt="{% t .empty %}" />
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@ -1,63 +0,0 @@
|
||||
{% assign completed_courses = 0 %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 %}
|
||||
{% assign completed_courses = completed_courses | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
<div class="carousel-wrapper">
|
||||
<div class="my-badges-carousel">
|
||||
{% include 'badges_cards' %}
|
||||
</div>
|
||||
{% if completed_courses == 0 %}
|
||||
<div class="zero-state-wrapper">
|
||||
<img class="zero-img" src="https://s3.amazonaws.com/static.northpass.com/Cin7/zero+state/No+badges+(no+button).png" alt="">
|
||||
<div class="zero-button-wrapper">
|
||||
<a class="lp-button" href="/app/catalog">Complete your first course now!</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.my-badges-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.my-badges-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,64 +0,0 @@
|
||||
{% assign counter = 0 %}
|
||||
<div class="carousel-wrapper">
|
||||
<div class="my-courses-carousel">
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if counter == 0 %}
|
||||
<div class="zero-state-wrapper">
|
||||
<img class="zero-img" src="https://s3.amazonaws.com/static.northpass.com/Cin7/zero+state/no+completed+courses+(no+button).png" alt="">
|
||||
<div class="zero-button-wrapper">
|
||||
<a class="lp-button" href="/app/catalog">Start learning now!</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.my-courses-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.my-courses-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,35 +0,0 @@
|
||||
<div class="carousel">
|
||||
<div class="my-learning-path-carousel">
|
||||
{% for learning_path in learning_paths.enrolled %}
|
||||
<div class="card-wrapper">
|
||||
{% include "cards_learning_path_homepage" with learning_path %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.my-learning-path-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 5,
|
||||
slidesToScroll: 5,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>"
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.my-learning-path-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,60 +0,0 @@
|
||||
{% assign counter = 0 %}
|
||||
<div class="carousel-wrapper">
|
||||
<div class="my-learning-path-carousel">
|
||||
{% for learning_path in learning_paths.enrolled %}
|
||||
{% if learning_path.progress < 100 %}
|
||||
<div class="card-wrapper">
|
||||
{% include "cards_learning_path_homepage" with learning_path %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.name contains 'Core' and course.progress < 100 %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% elsif course.name contains 'Omni' and course.progress < 100 %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if counter == 0 %}
|
||||
<div class="zero-state-wrapper">
|
||||
<img class="zero-img" src="https://s3.amazonaws.com/static.northpass.com/Cin7/zero+state/no+courses+or+lps+(no+button).png" alt="">
|
||||
<div class="zero-button-wrapper">
|
||||
<a class="lp-button" href="/app/catalog">Continue learning now!</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.my-learning-path-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>"
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.my-learning-path-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,65 +0,0 @@
|
||||
|
||||
{% assign counter = 0 %}
|
||||
<div class="carousel-wrapper">
|
||||
<div class="my-learning-path-carousel">
|
||||
{% for learning_path in learning_paths.enrolled %}
|
||||
<div class="card-wrapper">
|
||||
{% include "cards_learning_path_homepage" with learning_path %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% endfor %}
|
||||
{% if core %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.name contains 'Core' %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% elsif omni %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.name contains 'Omni' %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% assign counter = counter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if counter == 0 %}
|
||||
<div class="zero-state-wrapper">
|
||||
<img class="zero-img" src="https://s3.amazonaws.com/static.northpass.com/Cin7/zero+state/no+courses+or+lps+(no+button).png" alt="">
|
||||
<div class="zero-button-wrapper">
|
||||
<a class="lp-button" href="/app/catalog">Continue learning now!</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.my-learning-path-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>"
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.my-learning-path-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,53 +0,0 @@
|
||||
<div class="carousel-wrapper">
|
||||
<div class="my-learning-path-carousel">
|
||||
{% for learning_path in learning_paths.enrolled %}
|
||||
|
||||
<div class="card-wrapper">
|
||||
{% include "cards_learning_path_homepage" with learning_path %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.my-learning-path-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.my-learning-path-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,21 +0,0 @@
|
||||
{% if result.type == 'course' %}
|
||||
<div class="np-card np-search-result">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content">
|
||||
<img
|
||||
class="np-search-result-image"
|
||||
alt="{{ result.name }}"
|
||||
src="{{ result.image_url }}"
|
||||
/>
|
||||
<div class="np-search-result-content">
|
||||
<div>
|
||||
<a class="np-search-result-title" href="{{ result.path }}">
|
||||
{{ result.name }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="np-search-result-snippet">{{ result.description }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -1,11 +0,0 @@
|
||||
|
||||
{% for learning_path in learning_paths.enrolled %}
|
||||
{% for category in learning_path.categories %}
|
||||
{% if category.name contains 'B2B: Core' %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content card-wrapper">
|
||||
{% include "cards_learning_path_homepage" with learning_path %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
@ -1,30 +0,0 @@
|
||||
<nav class="sub-navigation">
|
||||
<div class="np-sub-navigation-content">
|
||||
{% for link in navigations.sub_navigation %}
|
||||
<div class="np-sub-navigation-content-item">
|
||||
{% if link.label == 'Catalog' %}
|
||||
<a class="np-sub-navigation-content-item-link {{ link.active_class }}" id='courses-category' href="/app/courses-category">
|
||||
{{ link.label }}
|
||||
</a>
|
||||
{%else%}
|
||||
<a class="np-sub-navigation-content-item-link {{ link.active_class }}" href="{{ link.url }}">
|
||||
{{ link.label }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
let link = document.getElementById('courses-category');
|
||||
|
||||
if (window.location.pathname == '/app/courses-category') {
|
||||
link.classList.add("np-sub-navigation-content-item-active");
|
||||
} else {
|
||||
link.classList.remove("np-sub-navigation-content-item-active");
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@ -1,62 +0,0 @@
|
||||
<div class="np-resource-header np-resource-header-card np-card-padding-large">
|
||||
{% include "training_session_header" %}
|
||||
</div>
|
||||
<div class="row np-training-session-row">
|
||||
<div class="col-xs-12 col-sm-8">
|
||||
<div class="np-training-container">
|
||||
<div class="np-card-padding-large">
|
||||
<div>
|
||||
{% include "training_session_status" %}
|
||||
{% include "training_session_date" %}
|
||||
</div>
|
||||
<div class="np-training-session-details">
|
||||
{% include "training_session_details" %}
|
||||
{% include "training_session_cta" %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-content-divider"></div>
|
||||
<div class="np-card-padding-large">
|
||||
{% include "training_session_description" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-4 np-grid-spacing">
|
||||
<div class="np-training-session-container">
|
||||
<div class="np-training-session-sessions-title">
|
||||
{% t shared.more_sessions %}
|
||||
</div>
|
||||
{% if training_event.sessions.size > 1 %}
|
||||
{% include "training_session_more_sessions" %}
|
||||
{% else %}
|
||||
<div class="np-training-session-zero-state">
|
||||
<img
|
||||
alt="{% t .empty %}"
|
||||
class="np-zero-state-training-sessions"
|
||||
/>
|
||||
<div class="np-training-session-zero-state-text">
|
||||
{% t .empty %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<style>
|
||||
@media screen and (min-width: 768px) {
|
||||
.np-training-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.np-training-container {
|
||||
background: #fff;
|
||||
border-radius: 4px !important;
|
||||
box-shadow: 0 2px 4px 0 rgba(72,103,118, .5) !important;
|
||||
z-index: 30;
|
||||
position: relative;
|
||||
}
|
||||
.lp-heading {
|
||||
font-size: 2.5rem
|
||||
}
|
||||
</style>
|
||||
@ -1,16 +0,0 @@
|
||||
<div class="np-top-vocabulary np-text-title">
|
||||
{% t shared.event_types, key: training_event.event_type %}
|
||||
<i class="fal fa-users-class np-button-color np-training-session-icon"></i>
|
||||
</div>
|
||||
<div class="np-top-title lora">
|
||||
<a href="{% route home %}" class="np-back-button2" aria-label="{% t shared.go_back %}">
|
||||
<i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
|
||||
</a>
|
||||
{{ training_event.title }}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-back-button2 {
|
||||
text-decoration: none;
|
||||
}
|
||||
</style>
|
||||
@ -1,14 +0,0 @@
|
||||
{% include "header" %}
|
||||
|
||||
<main class="np-main np-subpage-container np-account">
|
||||
<div class="np-hidden-desktop">
|
||||
{% include "account_mobile_view", form: form %}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-flex np-flex-center">
|
||||
{% include "account_desktop_view", form: form %}
|
||||
</div>
|
||||
</main>
|
||||
|
||||
{% include "footer" %}
|
||||
|
||||
@ -1,82 +0,0 @@
|
||||
{% assign omni = false %}
|
||||
{% assign core = false %}
|
||||
{% assign partners = false %}
|
||||
{% assign log_out = true %}
|
||||
{% assign both_gorups = false %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% for group in current_person.groups %}
|
||||
{% if group.name contains 'Partners' %}
|
||||
{% assign partners = true %}
|
||||
{% elsif group.name contains 'Core' %}
|
||||
{% assign core = true %}
|
||||
{% elsif group.name contains 'Omni' %}
|
||||
{% assign omni = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if omni and core %}
|
||||
{% assign both_gorups = true %}
|
||||
{% endif %}
|
||||
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
|
||||
<div class="hero-homepage">
|
||||
<div class="np-max-width">
|
||||
<div class="hero-text">Course Catalog</div>
|
||||
<div class="hero-subheading">Get the skills and knowledge you need at the moment you need them. Explore our full course catalog.</div>
|
||||
</div>
|
||||
</div>
|
||||
<main class="np-main np-catalog np-max-width catalog-container">
|
||||
<div class="filter-container">
|
||||
{% include 'filters_catalog' %}
|
||||
</div>
|
||||
<div class="catalog-content-wrapper">
|
||||
<div class="catalog-courses-container">
|
||||
{% include "courses_catalog" %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.catalog-container {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
padding: 5% 20px;
|
||||
}
|
||||
.filter-container {
|
||||
width: 25%;
|
||||
margin: 10px;
|
||||
}
|
||||
.catalog-content-wrapper {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
width: 75%;
|
||||
}
|
||||
.filters-container {
|
||||
width: 20%;
|
||||
border: 3px solid #002e6e;
|
||||
border-radius: 25px;
|
||||
}
|
||||
.catalog-courses-container {
|
||||
width: 100%;
|
||||
}
|
||||
@media only screen and (max-width: 768px) {
|
||||
.catalog-container {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.filter-container {
|
||||
width: 100%;
|
||||
}
|
||||
.catalog-content-wrapper {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
@ -1,59 +0,0 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
|
||||
<div class="hero-homepage">
|
||||
<div class="np-max-width">
|
||||
<div class="hero-text">Course Catalog</div>
|
||||
<div class="hero-subheading">Get the skills and knowledge you need at the moment you need them. Explore our full course catalog.</div>
|
||||
</div>
|
||||
</div>
|
||||
<main class="np-main np-catalog np-max-width catalog-container">
|
||||
<div class="filter-container">
|
||||
{% include 'filters_catalog' %}
|
||||
</div>
|
||||
<div class="catalog-content-wrapper">
|
||||
<div class="catalog-courses-container">
|
||||
{% include "courses_catalog" %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.catalog-container {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
padding: 5% 20px;
|
||||
}
|
||||
.filter-container {
|
||||
width: 25%;
|
||||
margin: 10px;
|
||||
}
|
||||
.catalog-content-wrapper {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
width: 75%;
|
||||
}
|
||||
.filters-container {
|
||||
width: 20%;
|
||||
border: 3px solid #002e6e;
|
||||
border-radius: 25px;
|
||||
}
|
||||
.catalog-courses-container {
|
||||
width: 100%;
|
||||
}
|
||||
@media only screen and (max-width: 768px) {
|
||||
.catalog-container {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.filter-container {
|
||||
width: 100%;
|
||||
}
|
||||
.catalog-content-wrapper {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
@ -1,10 +0,0 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main ">
|
||||
<div class="np-hidden-mobile np-max-width" id="course-desktop">
|
||||
{% include "course_desktop_view" %}
|
||||
</div>
|
||||
<div class="np-hidden-desktop" id="course-mobile">
|
||||
{% include "course_mobile_view" %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,16 +0,0 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
|
||||
<div class="hero-catalog-category">
|
||||
<div class="hero-text-catalog-category">Course Catalog</div>
|
||||
<div class="catalog-button-container">
|
||||
<a href="/app/catalog" class="catalog-button">Browse All Courses</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="category-container">
|
||||
{% include 'category_cards' %}
|
||||
</div>
|
||||
<main class="np-main np-catalog np-subpage-container np-max-width">
|
||||
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,23 +0,0 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
|
||||
<main class="np-main np-catalog np-subpage-container np-max-width">
|
||||
<div class="np-catalog-header-wrapper">
|
||||
<div class="np-catalog-header">
|
||||
<div class="np-resource-title">{{ catalog.headline }}</div>
|
||||
<div class="np-resource-subtitle">{{ catalog.subheadline }}</div>
|
||||
</div>
|
||||
{% capture label %}{% t shared.filters.by_category %}{% endcapture %}
|
||||
|
||||
{% if courses.in_catalog.any? %}
|
||||
{%
|
||||
include "filter_dropdown",
|
||||
filters: courses.filters,
|
||||
key: "category_uuid",
|
||||
label: label
|
||||
%}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include "courses_catalog" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,41 +0,0 @@
|
||||
{% assign log_out = true %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% endif %}
|
||||
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
||||
|
||||
|
||||
<div class="hero-homepage">
|
||||
<div class="np-max-width">
|
||||
<div class="hero-text ">My Dashboard</div>
|
||||
<div class="hero-subheading">Easily view your badges, start and resume courses and learning paths, and revisit courses you’ve completed here on your dashboard.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section np-max-width">
|
||||
<div class="heading-dashboard lora">My Badges</div>
|
||||
<div class="section-content">
|
||||
{% include 'my_badges_carousel' %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="section np-max-width">
|
||||
<div class="heading-dashboard lora">My Courses & Paths in Progress</div>
|
||||
<div class="section-content">
|
||||
{% include 'my_learning_paths_and_courses_carousel' %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="section np-max-width">
|
||||
<div class="heading-dashboard lora">Completed Courses</div>
|
||||
<div class="section-content">
|
||||
{% include 'my_courses_carousel' %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="section np-max-width">
|
||||
<div class="heading-dashboard lora">My Live Events</div>
|
||||
<div class="section-content">
|
||||
{% include "training_events_dashboard" %}
|
||||
</div>
|
||||
</div>
|
||||
{% include "footer" %}
|
||||
@ -1,83 +0,0 @@
|
||||
{% assign omni = false %}
|
||||
{% assign core = false %}
|
||||
{% assign log_out = true %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% for group in current_person.groups %}
|
||||
{% if group.name contains 'Core' %}
|
||||
{% assign core = true %}
|
||||
{% elsif group.name contains 'Omni' %}
|
||||
{% assign omni = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main homepage">
|
||||
<div class="hero-homepage">
|
||||
<div class="np-max-width">
|
||||
{% if core %}
|
||||
<div class="hero-text lora">Welcome to Cin7 Core Academy</div>
|
||||
{% elsif omni %}
|
||||
<div class="hero-text lora">Welcome to Cin7 Omni Academy</div>
|
||||
{% elsif log_out %}
|
||||
<div class="hero-text lora">Welcome to Cin7 Academy</div>
|
||||
{% else %}
|
||||
<div class="hero-text lora">Welcome to Cin7 Academy</div>
|
||||
{% endif %}
|
||||
<div class="hero-subheading">Learn to create and manage a best-in-class inventory operation for your business.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page-content">
|
||||
<div class="section np-max-width">
|
||||
{% if core %}
|
||||
<div class="heading lora">Learn Cin7 Core by your function with Learning Paths</div>
|
||||
<div class="section-content">
|
||||
{% include 'learning_path_carousel_core' %}
|
||||
</div>
|
||||
<div class="heading lora">Grow and broaden your Cin7 Core expertise with Deep Dives</div>
|
||||
<div class="section-content">
|
||||
{% include "category_carousel_core"%}
|
||||
</div>
|
||||
{% elsif omni %}
|
||||
<div class="heading lora">New to Cin7 Omni? Start learning here!</div>
|
||||
<div class="section-content">
|
||||
{% include "category_carousel"%}
|
||||
</div>
|
||||
{% elsif log_out %}
|
||||
<div class="heading lora">Learn Cin7 Core by your function with Learning Paths</div>
|
||||
<div class="section-content">
|
||||
{% include 'learning_path_carousel_core' %}
|
||||
</div>
|
||||
<div class="heading lora">Grow and broaden your Cin7 Core expertise with Deep Dives</div>
|
||||
<div class="section-content">
|
||||
{% include "category_carousel_core"%}
|
||||
</div>
|
||||
<div class="heading lora">Learn Omni by module and features</div>
|
||||
<div class="section-content">
|
||||
{% include "category_carousel"%}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="section np-max-width">
|
||||
<div class="heading lora">Featured Courses: Integrations</div>
|
||||
<div class="section-content">
|
||||
{% include 'featured_courses' %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="button-wrapper">
|
||||
<a class="catalog-btn" href="/app/catalog">Browse All Courses</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section section-info">
|
||||
<div class="np-max-width info-section-padding">
|
||||
{% include 'homepage_testimonials' %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,10 +0,0 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main">
|
||||
<div class="np-hidden-mobile np-max-width" id="learning-path-desktop">
|
||||
{% include "learning_path_desktop_view" %}
|
||||
</div>
|
||||
<div class="np-hidden-desktop" id="learning-path-mobile">
|
||||
{% include "learning_path_mobile_view" %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,59 +0,0 @@
|
||||
{% assign log_out = true %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% assign log_out = false %}
|
||||
{% endif %}
|
||||
|
||||
{% if log_out %}
|
||||
<script>
|
||||
window.location.replace('https://academy.cin7.com/learners/sign_in');
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
{% include "header" %}
|
||||
<div class="hero-homepage">
|
||||
<div class="np-max-width">
|
||||
<div class="hero-text">Learning Paths</div>
|
||||
<div class="hero-subheading">Explore curated learning paths tailored to your function and role.</div>
|
||||
</div>
|
||||
</div>
|
||||
<main class="np-main np-learning-paths np-subpage-container ">
|
||||
<div class="np-learning-paths-main np-max-width">
|
||||
{% if current_person.signed_in? %}
|
||||
{% include "learning_paths_index", items: learning_paths.available %}
|
||||
{% else %}
|
||||
<div class="hero-subheading"> You must be signed in to view Learning Paths. </div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const categoriesFromURL = urlParams.getAll('category');
|
||||
if (categoriesFromURL.length === 0) {
|
||||
return;
|
||||
}
|
||||
const cards = document.querySelectorAll('.lp-card');
|
||||
|
||||
const cardMatchesCategories = (card, categories) => {
|
||||
const cardCategories = card.getAttribute('categories').split('[$]');
|
||||
return categories.every(category => cardCategories.includes(category));
|
||||
};
|
||||
|
||||
const filterCards = () => {
|
||||
cards.forEach(card => {
|
||||
if (cardMatchesCategories(card, categoriesFromURL)) {
|
||||
card.style.display = 'block';
|
||||
} else {
|
||||
card.style.display = 'none';
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
filterCards();
|
||||
});
|
||||
|
||||
</script>
|
||||
@ -1,72 +0,0 @@
|
||||
<main class="np-main np-box-container">
|
||||
<div class="np-box">
|
||||
{% include "header_minimal" %}
|
||||
<div class="np-box-content-container">
|
||||
<form class="np-form np-box-content" action="{% route login %}" method="post" novalidate>
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_email">
|
||||
{% t shared.email_address %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
autofocus="autofocus"
|
||||
type="email"
|
||||
name="learner[email]"
|
||||
id="learner_email"
|
||||
>
|
||||
</div>
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_password">
|
||||
{% t shared.password %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
type="password"
|
||||
name="learner[password]"
|
||||
id="learner_password"
|
||||
>
|
||||
</div>
|
||||
<button type="submit" class="np-button np-button-big np-button-large-font np-form-action">
|
||||
{% t shared.sign_in %}
|
||||
</button>
|
||||
<a class="np-form-link np-button-color" href="{% route forgot_password_new %}">
|
||||
{% t .forgot_password %}
|
||||
</a>
|
||||
|
||||
{% comment %}
|
||||
{% if features.account_creation? %}
|
||||
<a class="np-form-link np-button-color" href="{% route sign_up %}">
|
||||
{% t shared.sign_up %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% endcomment %}
|
||||
|
||||
{% if features.request_access? %}
|
||||
<a
|
||||
class="np-form-link np-button-color"
|
||||
target="_blank"
|
||||
href="{{ current_school.request_access_link }}"
|
||||
>
|
||||
{{ current_school.request_access_label }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<style>
|
||||
.np-alert {
|
||||
visibility: visible;
|
||||
display: flex;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const hash = window.location.hash;
|
||||
if (hash === "#invite=true") {
|
||||
window.location.href = "{% route sign_up %}";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@ -1 +0,0 @@
|
||||
{% body %}
|
||||
@ -1,43 +0,0 @@
|
||||
<main class="np-box-container">
|
||||
<div class="np-box">
|
||||
{% include "header_minimal" %}
|
||||
<div class="np-box-content-container">
|
||||
<form class="np-form np-box-content" method="post" action="{% route forgot_password_create %}">
|
||||
<input type="hidden" name="_method" value="put">
|
||||
<input
|
||||
type="hidden"
|
||||
value="{{ reset_password_token }}"
|
||||
name="learner[reset_password_token]"
|
||||
id="learner_reset_password_token"
|
||||
>
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_password">
|
||||
{% t .new_password %} * <br> Password must be a minimum of 8 characters, with at least 1 capital letter, 1 number, and 1 special character.
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
autofocus="autofocus"
|
||||
type="password"
|
||||
name="learner[password]"
|
||||
id="learner_password"
|
||||
>
|
||||
</div>
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_password_confirmation">
|
||||
{% t .confirm_new_password %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
type="password"
|
||||
name="learner[password_confirmation]"
|
||||
id="learner_password_confirmation"
|
||||
>
|
||||
</div>
|
||||
<button type="submit" class="np-button np-button-big np-form-action">
|
||||
{% t .change_password %}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
@ -1,20 +0,0 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main np-search np-subpage-container np-max-width">
|
||||
<div class="np-resource-title">
|
||||
{% t .title %}
|
||||
</div>
|
||||
<div class="np-search-header">
|
||||
<div class="np-resource-subtitle">
|
||||
{% t .showing %}
|
||||
<span class="np-resource-subtitle-number">{{ results.count }}</span>
|
||||
{% t .results_for %}
|
||||
<span class="np-button-color">"{{ results.term }}"</span>
|
||||
</div>
|
||||
</div>
|
||||
{% if results.items.any? %}
|
||||
{% render "search_result" for results.items as result %}
|
||||
{% else %}
|
||||
{% include "search_zero_state" %}
|
||||
{% endif %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,81 +0,0 @@
|
||||
<main class="np-main np-box-container">
|
||||
<div class="np-box">
|
||||
{% include "header_minimal" %}
|
||||
<div class="np-box-content-container">
|
||||
<form class="np-form np-box-content" action="{% route sign_up %}" method="post" novalidate>
|
||||
<div class="np-form-title"> {% t .create_account %} </div>
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-form-flex-desktop">
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_first_name">
|
||||
{% t shared.first_name %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
autofocus="autofocus"
|
||||
type="text"
|
||||
name="learner[first_name]"
|
||||
id="learner_first_name"
|
||||
>
|
||||
</div>
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_last_name">
|
||||
{% t shared.last_name %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
type="text"
|
||||
name="learner[last_name]"
|
||||
id="learner_last_name"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_email">
|
||||
Business Email Address associated with Cin7
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
autofocus="autofocus"
|
||||
type="email"
|
||||
name="learner[email]"
|
||||
id="learner_email"
|
||||
>
|
||||
</div>
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_password">
|
||||
{% t shared.password %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
type="password"
|
||||
name="learner[password]"
|
||||
id="learner_password"
|
||||
>
|
||||
</div>
|
||||
<button type="submit" class="np-button np-button-big np-button-large-font np-form-action">
|
||||
{% t shared.sign_up %}
|
||||
</button>
|
||||
<span class="np-form-terms">
|
||||
{% t .terms %}
|
||||
<a
|
||||
class="np-form-link np-button-color"
|
||||
target="_blank"
|
||||
href="{{ current_school.terms_of_service_url }}"
|
||||
>
|
||||
{% t .terms_link %}
|
||||
</a>
|
||||
</span>
|
||||
<span class="np-form-terms">
|
||||
If you are unable to create an account, you have likely already been invited to the Academy. Please use the 'Forgot my password' link below.
|
||||
</span>
|
||||
<span class="np-form-terms">
|
||||
<a
|
||||
class="np-form-link np-button-color"
|
||||
target="_blank"
|
||||
href="https://academy.cin7.com/learners/password/new">Forgot my Password </a>
|
||||
</span>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
@ -1,597 +0,0 @@
|
||||
/*
|
||||
Put your custom overlay styles in here
|
||||
You can use your northpass color palette in this file
|
||||
|
||||
{{ color_palette.button_font_color }}
|
||||
{{ color_palette.button_color }}
|
||||
{{ color_palette.button_hover_color }}
|
||||
{{ color_palette.header_font_color }}
|
||||
{{ color_palette.header_font_hover_color }}
|
||||
{{ color_palette.header_color }}
|
||||
*/
|
||||
body {
|
||||
font-family: "Inter", sans-serif;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.lora {
|
||||
font-family: 'Lora';
|
||||
}
|
||||
.hero-text {
|
||||
font-family: 'Lora';
|
||||
}
|
||||
.np-header-desktop-nav-link {
|
||||
font-weight: 700;
|
||||
}
|
||||
.np-header-desktop-nav-link:hover {
|
||||
color: #002EFF;
|
||||
}
|
||||
.header-search-input {
|
||||
border: 3px solid #002e6e;
|
||||
border-radius: 8px;
|
||||
max-width: 150px;
|
||||
}
|
||||
.note-desc {
|
||||
font-size: 1vw
|
||||
}
|
||||
.hero-text {
|
||||
font-size: 3.5rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
.hero-homepage {
|
||||
background: linear-gradient(257.71deg, rgba(255, 255, 255, 0) 41.81%, #FFF 99.32%), url('https://s3.amazonaws.com/static.northpass.com/Cin7/1920x300.png');
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
padding: 5%;
|
||||
color: #002f6f;
|
||||
}
|
||||
.hero-subheading {
|
||||
margin-top: 2%;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
.np-sub-navigation-content-item-active {
|
||||
background: #002f6f !important;
|
||||
}
|
||||
.np-sub-navigation-content-item-link {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background: #05cbbf;
|
||||
color: #fff;
|
||||
padding: 15px;
|
||||
border-radius: 8px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.sub-navigation {
|
||||
background: #fff;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
.np-sub-navigation-content-item {
|
||||
margin: 0 15px;
|
||||
}
|
||||
.info-icon {
|
||||
width: 125px;
|
||||
object-fit: cover;
|
||||
}
|
||||
.card {
|
||||
border-radius: 25px;
|
||||
background: #fff;
|
||||
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
||||
}
|
||||
.learning-path-card-image {
|
||||
width: 100%;
|
||||
border-radius: 20px 20px 0 0;
|
||||
}
|
||||
.card-content-title {
|
||||
color: #002f6f;
|
||||
font-size: 1.25rem;
|
||||
margin: 0;
|
||||
height: 46px;
|
||||
}
|
||||
.course-time {
|
||||
color: #000000b5;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px
|
||||
}
|
||||
.course-desc {
|
||||
margin-top: 15px;
|
||||
color: #002f6f;
|
||||
height: 60px;
|
||||
}
|
||||
.lp-link {
|
||||
text-decoration: none;
|
||||
}
|
||||
.slick-track {
|
||||
margin-left: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.section-lp {
|
||||
background: #dde9fe;
|
||||
}
|
||||
.heading {
|
||||
font-size: 2.5rem;
|
||||
color: #002f6f;
|
||||
padding: 2rem 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
.section {
|
||||
padding: 1rem 0;
|
||||
}
|
||||
.section-featured {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.np-top-cta {
|
||||
background: #fff;
|
||||
border-radius: 20px;
|
||||
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card-image {
|
||||
position: relative;
|
||||
}
|
||||
.np-optional-ribbon {
|
||||
background: #05CBBF;
|
||||
color: #fff;
|
||||
|
||||
}
|
||||
.np-card-ribbon {
|
||||
top: 0;
|
||||
right: 0;
|
||||
border-radius: 0 20px;
|
||||
text-transform: none;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
padding: 5px 12.5px;
|
||||
background: #05CBBF;
|
||||
}
|
||||
|
||||
.lp-progress-text {
|
||||
font-weight: 700;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.lp-button {
|
||||
background: #002f6f;
|
||||
color: #fff;
|
||||
padding: 15px 25px;
|
||||
border-radius: 25px;
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
border: none;
|
||||
}
|
||||
.lp-button:hover {
|
||||
background: #05CBBF;
|
||||
color: #fff;
|
||||
}
|
||||
.lp-course-card {
|
||||
margin: 30px 0;
|
||||
background: #fff;
|
||||
border-radius: 20px;
|
||||
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
||||
}
|
||||
.learning-path-outline-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
}
|
||||
.learning-path-outline-progress {
|
||||
font-weight: 600;
|
||||
}
|
||||
.lp-desktop-wrapper {
|
||||
padding: 25px;
|
||||
background: #fff;
|
||||
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
||||
border-radius: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.lp-progress-and-cta-wrapper {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.card {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.right-arrow {
|
||||
position: absolute;
|
||||
bottom: -30px;
|
||||
padding-left: 50px;
|
||||
cursor: pointer;
|
||||
right: 10px;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.left-arrow {
|
||||
position: absolute;
|
||||
bottom: -30px;
|
||||
z-index: 1;
|
||||
padding-left: 10px;
|
||||
cursor: pointer;
|
||||
right: 40px;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.heading-dashboard {
|
||||
text-align: left;
|
||||
font-size: 2.5rem;
|
||||
color: #002f6f;
|
||||
padding: 2rem 0;
|
||||
font-weight: 600;
|
||||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
.my-learning-paths {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.my-courses {
|
||||
background: #dde9fe;
|
||||
}
|
||||
|
||||
.my-events {
|
||||
background: #4d98ff;
|
||||
}
|
||||
|
||||
.events {
|
||||
background: #fff;
|
||||
}
|
||||
.card-container {
|
||||
text-decoration: none;
|
||||
}
|
||||
.events-container {
|
||||
display: flex;
|
||||
margin: 0 20px;
|
||||
}
|
||||
|
||||
.catalog-button {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
background: #002f6f;
|
||||
color: #fff;
|
||||
padding: 15px;
|
||||
border-radius: 8px;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
}
|
||||
.catalog-button-container {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.hero-catalog-category {
|
||||
background: #f2ede8;
|
||||
padding: 5% 20px;
|
||||
}
|
||||
.hero-text-catalog-category {
|
||||
color: #002f6f;
|
||||
font-size: 3.5rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
.card-learning-path-desktop {
|
||||
border-radius: 40px;
|
||||
}
|
||||
.image-learning-path-desktop {
|
||||
border-radius: 40px;
|
||||
}
|
||||
.category-wrapper {
|
||||
|
||||
}
|
||||
.category-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.category-link {
|
||||
text-decoration: none;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 500;
|
||||
color: #002f6f;
|
||||
background: #fff;
|
||||
border: 3px solid;
|
||||
border-radius: 20px;
|
||||
padding: 2rem;
|
||||
max-width: 1000px;
|
||||
width: 100%;
|
||||
margin: 10px 0;
|
||||
}
|
||||
.category-container {
|
||||
margin: 20px 0;
|
||||
}
|
||||
.np-card-container {
|
||||
border-radius: 25px;
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-learning-path-image {
|
||||
border-bottom-left-radius: 20px;
|
||||
border-top-left-radius: 20px;
|
||||
width: 100% !important;
|
||||
height: 100%;
|
||||
}
|
||||
.card-content {
|
||||
background: #fff;
|
||||
border-radius: 0 0 25px 25px;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
.catalog-btn {
|
||||
background: #002f6f;
|
||||
color: #fff;
|
||||
padding: 15px 25px;
|
||||
border-radius: 25px;
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
}
|
||||
.button-wrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 2.5% 0;
|
||||
}
|
||||
.info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
max-width: 400px;
|
||||
gap: 5%;
|
||||
}
|
||||
.info-wrapper {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.info-heading {
|
||||
color: #002f6f;
|
||||
font-weight: 600;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
.info-desc {
|
||||
color: #002f6f;
|
||||
font-size: 1rem;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.np-footer-logo-image {
|
||||
filter: none;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.section-info {
|
||||
background: linear-gradient(257.71deg, rgba(255, 255, 255, 0) 41.81%, #FFFFFF 99.32%), #F2EDE8;
|
||||
}
|
||||
|
||||
.np-footer {
|
||||
background: url('https://s3.amazonaws.com/static.northpass.com/Cin7/Footer+background.png');
|
||||
background-size: cover;
|
||||
background-repeat: round;
|
||||
height: 28%;
|
||||
}
|
||||
.np-alert {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-heading {
|
||||
font-size: 1.25rem;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
border-bottom: 1px solid #fff;
|
||||
padding: 10px 0;
|
||||
width: 150px;
|
||||
}
|
||||
.np-footer-navigation-link {
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.info-section-heading {
|
||||
padding: 5% 0;
|
||||
font-weight: 400;
|
||||
}
|
||||
.section-content-info {
|
||||
padding-bottom: 5%;
|
||||
}
|
||||
.info-content {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
.np-footer-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items:flex-start;
|
||||
}
|
||||
|
||||
.np-footer-navigation-list {
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.np-footer-navigation-link {
|
||||
padding: 10px 0;
|
||||
}
|
||||
.np-footer-navigation {
|
||||
min-height: 52px;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: end;
|
||||
padding: 0 5%;
|
||||
}
|
||||
.np-learning-path-outline-name {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.np-top-image {
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
.content-lp-card-padding {
|
||||
padding: 25px;
|
||||
}
|
||||
.np-card-heading, .np-learning-path-outline-name {
|
||||
color: #002f6f;
|
||||
}
|
||||
.np-card-text {
|
||||
color: #002f6f;
|
||||
}
|
||||
|
||||
.np-learning-path {
|
||||
border-radius: 25px;
|
||||
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
||||
}
|
||||
.np-learning-paths {
|
||||
background: #fff;
|
||||
}
|
||||
.lp-heading {
|
||||
font-size: 2.5rem;
|
||||
color: #002f6f;
|
||||
padding: 3rem 2rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
.category-card {
|
||||
text-decoration: none;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.catalog-btn:hover {
|
||||
background: #05CBBF;
|
||||
color: #fff;
|
||||
|
||||
}
|
||||
.info-section-padding {
|
||||
padding: 0 20px;
|
||||
}
|
||||
.zero-state-wrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.zero-button-wrapper {
|
||||
display: flex;
|
||||
}
|
||||
.zero-img {
|
||||
max-width: 400px;
|
||||
}
|
||||
.badge-card-image {
|
||||
width: 60%;
|
||||
}
|
||||
.card-badge {
|
||||
background: #FFFFFF;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 2rem;
|
||||
border-radius: 20px 20px 0 0;
|
||||
}
|
||||
.card-category {
|
||||
background: #002f6f;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 2rem;
|
||||
border-radius: 20px 20px 0 0;
|
||||
}
|
||||
.card-content-badge {
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
}
|
||||
.completed-courses {
|
||||
margin-top: 10px;
|
||||
font-weight: 500;
|
||||
color: #002f6f;
|
||||
}
|
||||
.np-header-desktop-nav-list {
|
||||
justify-content: end;
|
||||
}
|
||||
.event-card {
|
||||
max-width: 330px;
|
||||
}
|
||||
.recommended
|
||||
{
|
||||
color: #000000b5;
|
||||
}
|
||||
|
||||
.card-type
|
||||
{
|
||||
color: #000000b5;
|
||||
text-align: end;
|
||||
margin-bottom: 10px;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
opacity: 0.75;
|
||||
}
|
||||
.course-details {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 15px;
|
||||
gap: 10px
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
transform: translateY(-0.125rem);
|
||||
}
|
||||
|
||||
.card-category-core {
|
||||
background: none;
|
||||
padding: 0;
|
||||
}
|
||||
.card-category-image-core {
|
||||
width: 100%;
|
||||
border-radius: 20px 20px 0 0;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
.hero-text {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
.hero-subheading {
|
||||
font-size: 1rem;
|
||||
}
|
||||
.heading, .heading-dashboard {
|
||||
font-size: 2rem;
|
||||
}
|
||||
.info-section-heading {
|
||||
text-align: center;
|
||||
}
|
||||
.info-wrapper {
|
||||
justify-content: center;
|
||||
}
|
||||
.np-footer-navigation {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.np-footer-navigation-link {
|
||||
padding: 0;
|
||||
margin: 10px;
|
||||
}
|
||||
.events-container {
|
||||
justify-content: center;
|
||||
}
|
||||
.dropdown {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.core-category-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
.course-desc-category-core {
|
||||
margin-top: 15px;
|
||||
color: #002f6f;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: end;
|
||||
}
|
||||
.card-content-core {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
@ -1,13 +0,0 @@
|
||||
{% include "header" %}
|
||||
|
||||
<div class="hero-homepage">
|
||||
<div class="np-max-width">
|
||||
<div class="hero-text">Live Training Events</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section events np-max-width">
|
||||
<div class="section-content">
|
||||
{% include "training_events_index" %}
|
||||
</div>
|
||||
</div>
|
||||
{% include "footer" %}
|
||||
@ -1,43 +0,0 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main np-cta-page np-max-width np-subpage-container">
|
||||
<div class="np-card-container np-card-padding-xlarge">
|
||||
{% if token %}
|
||||
<i class="np-cta-page-icon fal fa-users-class"></i>
|
||||
<div class="np-form-headline">
|
||||
{{ training_session.title }}
|
||||
</div>
|
||||
<div class="np-form-subheadline">
|
||||
{% t .info,
|
||||
event_name: training_session.title,
|
||||
session_date: training_session.date,
|
||||
session_time: training_session.time
|
||||
%}
|
||||
</div>
|
||||
<div class="np-form-subheadline">
|
||||
{% t .question %}
|
||||
</div>
|
||||
<form action="{% route training_session_attendance %}" method="post" class="np-cta-page-buttons">
|
||||
{% form_authenticity_token %}
|
||||
<input type="hidden" name="token" value="{{ token }}">
|
||||
<input type="submit" name="not_attended" value="{% t .not_attended %}" class="np-button np-button-secondary">
|
||||
<input type="submit" name="commit" value="{% t .attended %}" class="np-button">
|
||||
</form>
|
||||
<div class="np-form-subheadline">
|
||||
{% t .salutation %}
|
||||
</div>
|
||||
<div class="np-form-subheadline">
|
||||
{{ current_school.name }}
|
||||
</div>
|
||||
{% else %}
|
||||
<i class="np-cta-page-icon fal fa-check-circle"></i>
|
||||
<div class="np-form-headline">
|
||||
{% t .success.response_text %}
|
||||
</div>
|
||||
<div class="np-cta-page-buttons">
|
||||
<a href="{% route training_events %}" class="np-button">
|
||||
{% t .success.button_text %}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,27 +0,0 @@
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 and course.properties.badge_course == true %}
|
||||
<div class="card-wrapper">
|
||||
<div class="card">
|
||||
<div class="lp-link">
|
||||
<div class="card-badge">
|
||||
<img
|
||||
alt=""
|
||||
{% if course.name contains 'Omni' %}
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Cin7/badges/academy-badge_omni.png"
|
||||
{% elsif course.name contains 'Core' %}
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Cin7/badges/academy-badge_core.png"
|
||||
{% endif %}
|
||||
class="badge-card-image"
|
||||
/>
|
||||
</div>
|
||||
<div class="card-content card-content-badge">
|
||||
<h3 class="card-content-title course-name">
|
||||
{% if course.name contains 'Omni' %}Omni{% elsif course.name contains 'Core' %}Core{% endif %} Course Completed
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
@ -1,46 +0,0 @@
|
||||
<div class="card" categories="{%for category in course.categories%}{{category.name}},{%endfor%}" duration="{{course.properties.course_duration}}">
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
<a class="lp-link" href="{{ course_path }}">
|
||||
<div class="card-image">
|
||||
<img
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
class="learning-path-card-image"
|
||||
/>
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon" {% if course.ribbon == "Omni" %} style="background: #0026b2;"
|
||||
{% elsif course.ribbon == "Core"%} style="background: #05CBBF"
|
||||
{% else %} style="background: #213343"
|
||||
{% endif %}>
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-content-title course-name">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
|
||||
<div class="course-desc">
|
||||
{{ course.short_description }}
|
||||
</div>
|
||||
{% if course.properties.course_duration %}
|
||||
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
|
||||
<div class="course-time" style="margin-right: 15px;">
|
||||
<i class="far fa-clock"></i>
|
||||
{{course.properties.course_duration}} min
|
||||
</div>
|
||||
<div class="recommended" style="margin-left: auto;">
|
||||
Recommended for:<br>{{course.properties.recommended_for}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
{% endif %}
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -1,68 +0,0 @@
|
||||
<div class="np-card np-no-horizontal-padding lp-card" category="{% if learning_path.name contains 'Core'%}Core{%elsif learning_path.name contains 'Omni'%}Omni{% endif %}" categories="{%for category in learning_path.categories%}{{category.name}}[$]{%endfor%}">
|
||||
<div class="np-card-container">
|
||||
<div class="np-learning-path">
|
||||
<div class="lp-image-container">
|
||||
<img
|
||||
alt="{{ learning_path.name }}"
|
||||
class="np-card-image np-learning-path-image"
|
||||
src="{{ learning_path.image_url }}"
|
||||
/>
|
||||
</div>
|
||||
<div class="np-card-text-wrapper">
|
||||
<div class="np-hidden-desktop np-card-header">
|
||||
<i class="np-card-header-icon far fa-road"></i>
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<div class="np-hidden-desktop np-card-header-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-card-header">
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<i class="np-card-header-icon far fa-road"></i>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ learning_path.instructor_names }}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-description">
|
||||
{{ learning_path.description }}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ learning_path.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-hidden-desktop np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
<a class="lp-button" href="{% route learning_path, id: learning_path.id %}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
<span class="np-hidden-mobile np-learning-path-items">
|
||||
<i class="np-button-color np-learning-path-items-icon far fa-graduation-cap"></i>
|
||||
<span class="np-learning-path-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,25 +0,0 @@
|
||||
<div class="card">
|
||||
<a class="lp-link" href="{% route learning_path, id: learning_path.id %}">
|
||||
<div class="card-image">
|
||||
<img
|
||||
alt="{{ learning_path.name }}"
|
||||
class="learning-path-card-image"
|
||||
src="{{ learning_path.image_url }}"
|
||||
/>
|
||||
<div class="np-card-ribbon" {% if learning_path.name contains "Omni" %} style="background: #0026b2;"{%elsif learning_path.name contains "Core"%}style="background: #05CBBF;"{% endif %}>
|
||||
{% if learning_path.name contains "Omni" %}
|
||||
Omni
|
||||
{% elsif learning_path.name contains "Core" %}
|
||||
Core
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-type"><i class="far fa-road"></i> LEARNING PATH</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@ -1,38 +0,0 @@
|
||||
<div class="card">
|
||||
<a class="card-container" href="{% route training_session, id: training_event.sessions.first.id %}">
|
||||
<div class="np-card-content-training-event">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ training_event.title }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle">
|
||||
{% t shared.event_types, key: training_event.event_type %}
|
||||
</div>
|
||||
<div class="np-card-training-session">
|
||||
<span class="np-card-content-label">
|
||||
{% t .next_session %}
|
||||
</span>
|
||||
<div class="np-card-training-session-date">
|
||||
<div class="np-card-training-session-date-day">
|
||||
{{ training_event.sessions.first.day }}
|
||||
</div>
|
||||
<div>
|
||||
<div class="np-card-training-session-date-month">
|
||||
{{ training_event.sessions.first.month }}
|
||||
</div>
|
||||
<div class="np-card-training-session-date-year">
|
||||
{{ training_event.sessions.first.year }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<div class="np-card-training-sessions">
|
||||
<i class="np-card-training-sessions-icon far fa-calendar-star"></i>
|
||||
<span class="np-card-training-sessions-label">
|
||||
{% t .sessions, count: training_event.sessions.size %}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
@ -1,11 +0,0 @@
|
||||
|
||||
<a class="card category-card" href="/app/catalog?category={{category.name}}">
|
||||
<div class="card-category">
|
||||
<img class="badge-card-image" src="{{category_images[counter]}}" alt="">
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-content-title">{{category.name}}</h3>
|
||||
<div class="course-desc">See all courses related to {{category.name}}.</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
@ -1,29 +0,0 @@
|
||||
|
||||
<a class="card category-card" href="/app/learning_paths?category={{category.name}}&category=Deep Dive: Core">
|
||||
<div class="core-category-wrapper">
|
||||
<div class="card-category card-category-core">
|
||||
<img class="badge-card-image card-category-image-core"
|
||||
{% if category.name == 'Warehouse Operations: Core' %}
|
||||
src="{{category_images[4]}}" alt=""
|
||||
{% elsif category.name == 'Admin: Core' %}
|
||||
src="{{category_images[1]}}" alt=""
|
||||
{% elsif category.name == 'Product Management: Core' %}
|
||||
src="{{category_images[2]}}" alt=""
|
||||
{% elsif category.name == 'Accounting: Core' %}
|
||||
src="{{category_images[0]}}" alt=""
|
||||
{% elsif category.name == 'Simple Manufacturing: Core' %}
|
||||
src="{{category_images[3]}}" alt=""
|
||||
{% endif %}
|
||||
>
|
||||
</div>
|
||||
<div class="card-content card-content-core">
|
||||
{% if category.name == 'Warehouse Operations: Core' %}
|
||||
<h3 class="card-content-title">Inventory Logistics Deep Dives</h3>
|
||||
{% else %}
|
||||
<h3 class="card-content-title">{{category.name | replace: ": Core", " Deep Dives"}}</h3>
|
||||
{% endif %}
|
||||
<div class="course-desc course-desc-category-core">Level up your expertise and enhance your operations with {{category.name | replace: ": Core", " Deep Dives"}}.</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
@ -1,64 +0,0 @@
|
||||
{% assign unique_category = "" %}
|
||||
{% assign category_images = 'https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images/Category+Icon+1.png,https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images/Category+Icon+2.png,https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images/Category+Icon+3.png,https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images/Category+Icon+4.png' | split: ',' %}
|
||||
{% assign category_counter = 0 %}
|
||||
|
||||
|
||||
<div class="category-carousel">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name contains 'Omni' %}
|
||||
{% unless unique_category contains category.name %}
|
||||
{% include 'category_cards' counter: category_counter %}
|
||||
{% assign unique_category = unique_category | append: category.name %}
|
||||
{% assign category_counter = category_counter | plus: 1 %}
|
||||
{% if category_counter > 3 %}
|
||||
{% assign category_counter = 0 %}
|
||||
{% endif %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.category-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.category-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,64 +0,0 @@
|
||||
{% assign unique_category = "" %}
|
||||
{% assign category_images = 'https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Accounting+Deep+Dives+-+Thumbnails.png, https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Administrative+Deep+Dives+-+Thumbnail.png, https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Product+Management+Deep+Dives+-+Thumbnail.png, https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Simple+Manufacturing+Deep+Dives+-+Thumbnail.png, https://s3.amazonaws.com/static.northpass.com/Cin7/categories+images+core+/Warehouse+Operations+Deep+Dives+-+Thumbnail.png' | split: ', ' %}
|
||||
{% assign category_counter = 0 %}
|
||||
{% assign core_categories = 'Warehouse Operations: Core, Admin: Core, Product Management: Core, Accounting: Core, Simple Manufacturing: Core' | split: ", " %}
|
||||
|
||||
<div class="category-carousel-core">
|
||||
{% for learning_path in learning_paths.available %}
|
||||
{% for category in learning_path.categories %}
|
||||
{% if core_categories contains category.name %}
|
||||
{% unless unique_category contains category.name %}
|
||||
{% include 'category_cards_core' counter: category_counter %}
|
||||
{% assign unique_category = unique_category | append: category.name %}
|
||||
{% assign category_counter = category_counter | plus: 1 %}
|
||||
{% if category_counter > 3 %}
|
||||
{% assign category_counter = 0 %}
|
||||
{% endif %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.category-carousel-core').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.category-carousel-core {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,10 +0,0 @@
|
||||
<h3 class="np-card-heading">
|
||||
{% t .header %}
|
||||
</h3>
|
||||
<div class="np-flex">
|
||||
{% for category in course.categories %}
|
||||
<div class="np-content-categories-content-item">
|
||||
{{ category.name }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
@ -1,6 +0,0 @@
|
||||
<h3 class="np-card-heading">
|
||||
{% t .header, key: current_school.course_vocabulary %}
|
||||
</h3>
|
||||
<div class="np-card-text">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
@ -1,41 +0,0 @@
|
||||
<div class="np-card-container">
|
||||
<div class="lp-header-container">
|
||||
<div class="lp-heading lora course-name"> {{ course.name }}</div>
|
||||
</div>
|
||||
|
||||
<div class="np-divider"></div>
|
||||
<div class="row np-course-content np-card-padding-dynamic">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
{% 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>
|
||||
@ -1,16 +0,0 @@
|
||||
<div class="np-top-vocabulary np-text-title np-text-muted">
|
||||
{{ current_school.course_vocabulary }}
|
||||
<i class="far fa-graduation-cap np-button-color np-learning-path-icon np-hidden-mobile">
|
||||
</i>
|
||||
</div>
|
||||
<div class="np-top-title course-name">
|
||||
<a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">
|
||||
<i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
|
||||
</a>
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-hidden-desktop"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
@ -1,22 +0,0 @@
|
||||
<h3 class="np-card-heading">
|
||||
{% t .header %}
|
||||
</h3>
|
||||
<div class="np-flex">
|
||||
{% for instructor in course.instructors %}
|
||||
<div class="np-content-instructors-content-item">
|
||||
<img
|
||||
src="{{ instructor.avatar_url }}"
|
||||
class="np-content-instructors-content-image"
|
||||
alt="{{ instructor.name }}"
|
||||
/>
|
||||
<div class="np-content-instructors-content-description">
|
||||
<div class="np-content-instructors-content-name">
|
||||
{{ instructor.name }}
|
||||
</div>
|
||||
<div class="np-content-instructors-content-info np-text-light">
|
||||
{{ instructor.title }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
@ -1,40 +0,0 @@
|
||||
<div class="np-card-container np-card-padding-large">
|
||||
{% include "course_header" %}
|
||||
<div class="np-top-cta">
|
||||
{% include "course_progress_and_cta" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if course.progress == 0 %}
|
||||
<div class="np-card-container np-card-padding np-card-spacing">
|
||||
{% include "course_description" %}
|
||||
</div>
|
||||
<div class="np-card-container np-card-padding np-card-spacing">
|
||||
{% include "course_outline" %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="np-card-container np-card-padding np-card-spacing">
|
||||
{% include "course_outline" %}
|
||||
</div>
|
||||
<div class="np-card-container np-card-padding np-card-spacing">
|
||||
{% include "course_description" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.categories.any? %}
|
||||
<div class="np-card-container np-card-padding np-card-spacing">
|
||||
{% include "course_categories" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.instructors.any? %}
|
||||
<div class="np-card-container np-card-padding np-card-spacing">
|
||||
{% include "course_instructors" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.events.any? %}
|
||||
<div class="np-card-container np-card-padding np-card-spacing">
|
||||
{% include "course_events" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -1,40 +0,0 @@
|
||||
<div class="np-course-outline">
|
||||
<div class="np-text-title np-course-outline-title">
|
||||
{% t .header, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<div class="np-course-outline-content">
|
||||
<ol class="np-course-outline-content-section">
|
||||
{% for section in course.sections %}
|
||||
<li class="np-course-outline-content-section-list">
|
||||
<div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold">
|
||||
{{ section.name }}
|
||||
</div>
|
||||
<ol class="np-course-outline-content-activity">
|
||||
{% for activity in section.activities %}
|
||||
|
||||
<li class="np-course-outline-content-activity-list">
|
||||
{% if activity.completed? %}
|
||||
<i class="fas fa-circle np-course-outline-content-activity-icon np-button-color"></i>
|
||||
{% if activity.locked? %}
|
||||
{% include "course_activity_locked" %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link-completed" %}
|
||||
{% endif %}
|
||||
<div class="np-button-background-color np-course-outline-content-activity-list-bar"></div>
|
||||
{% else %}
|
||||
<i class="far fa-circle np-course-outline-content-activity-icon"></i>
|
||||
{% if activity.locked? %}
|
||||
{% include "course_activity_locked" %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link" %}
|
||||
{% endif %}
|
||||
<div class="np-course-outline-content-activity-list-bar"></div>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,46 +0,0 @@
|
||||
<div class="np-top-cta-progress-content">
|
||||
<div class="np-top-cta-progress-title np-text-title">
|
||||
{% t .header %}
|
||||
</div>
|
||||
<div class="np-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ course.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-top-cta-progress-text
|
||||
{% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
|
||||
">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if course.learner_can_retake? %}
|
||||
<form action="{% route course_retake, id: course.id %}" method="POST">
|
||||
{% form_authenticity_token %}
|
||||
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
|
||||
{% t .retake, key: current_school.course_vocabulary %}
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a
|
||||
class="lp-button"
|
||||
{% 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 %}
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif course.started? == false %}
|
||||
{% t shared.course.start, key: current_school.course_vocabulary %}
|
||||
{% elsif course.completed? %}
|
||||
{% t shared.course.view, key: current_school.course_vocabulary %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
@ -1,7 +0,0 @@
|
||||
{% if courses.include_courses_to_restart? %}
|
||||
<div role="alert" class="np-alert np-alert-global np-alert-info">
|
||||
<div class="np-alert-container uk-container uk-container-center">
|
||||
{% t .content %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -1,33 +0,0 @@
|
||||
<div class="np-course-version-outdated-popup np-popup">
|
||||
<div class="np-popup-positioner">
|
||||
<i
|
||||
class="np-course-version-outdated-popup-trigger fas fa-exclamation-circle"
|
||||
data-toggle-class-on-target="np-popup-tooltip--visible"
|
||||
data-toggle-target-parent=".np-popup-tooltip"
|
||||
data-toggle-outside
|
||||
></i>
|
||||
<div
|
||||
class="np-popup-tooltip"
|
||||
role="tooltip"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<header class="np-popup-header">
|
||||
<i class="np-popup-header-icon fas fa-exclamation-circle"></i>
|
||||
<h3 class="np-popup-header-title">
|
||||
{% t .title %}
|
||||
</h3>
|
||||
</header>
|
||||
<div class="np-popup-body">
|
||||
<h4>{% t .body.header %}</h4>
|
||||
<p>{% t .body.content %}</p>
|
||||
<a
|
||||
class="np-popup-body-button"
|
||||
href="{{ path }}"
|
||||
>
|
||||
{% t .body.button %}
|
||||
</a>
|
||||
</div>
|
||||
<div class="np-popup-tail"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,16 +0,0 @@
|
||||
{% if courses.in_catalog.any? %}
|
||||
<div class=" row">
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.catalog,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}
|
||||
@ -1,16 +0,0 @@
|
||||
{% if courses.enrolled.any? %}
|
||||
<div class="row row-with-thumbnails">
|
||||
{% for course in courses.enrolled %}
|
||||
<div class="{{ class }}">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}
|
||||
@ -1,6 +0,0 @@
|
||||
<div class="np-dashboard-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
{{ message }}
|
||||
</div>
|
||||
<img class="np-zero-state-courses" alt="{{ message }}" />
|
||||
</div>
|
||||
@ -1,55 +0,0 @@
|
||||
|
||||
<div class="carousel-wrapper">
|
||||
<div class="feature-courses-carousel">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.properties.feature_course == true %}
|
||||
<div class="card-wrapper">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('.feature-courses-carousel').slick({
|
||||
infinite: true,
|
||||
slidesToShow: 4,
|
||||
slidesToScroll: 4,
|
||||
prevArrow: "<i class='control-carousel fas fa-chevron-left left-arrow'></i>",
|
||||
nextArrow: "<i class='control-carousel fas fa-chevron-right right-arrow'></i>",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1200,
|
||||
settings: {
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
infinite: true
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.card {
|
||||
height: 100%;;
|
||||
}
|
||||
.card-wrapper {
|
||||
padding: 1rem 0;
|
||||
height: auto;
|
||||
}
|
||||
.feature-courses-carousel {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,33 +0,0 @@
|
||||
<div class="np-filter">
|
||||
<div class="dropdown">
|
||||
<button
|
||||
class="np-button dropdown-button"
|
||||
data-toggle-class="is-open"
|
||||
data-toggle-escape
|
||||
data-toggle-outside
|
||||
data-toggle-target-next
|
||||
type="button"
|
||||
>
|
||||
{% t shared.filters.filter %}
|
||||
</button>
|
||||
|
||||
<div class="dropdown-menu" data-test="modal">
|
||||
<form method="get">
|
||||
{%
|
||||
include "filter_select",
|
||||
filters: filters,
|
||||
key: key,
|
||||
label: label
|
||||
%}
|
||||
|
||||
<button
|
||||
class="np-button dropdown-button-apply"
|
||||
data-toggle-trigger-off
|
||||
type="submit"
|
||||
>
|
||||
{% t shared.filters.apply %}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,22 +0,0 @@
|
||||
{% if params.q %}
|
||||
<input type="hidden" name="q" value="{{ params.q }}">
|
||||
{% endif %}
|
||||
|
||||
<label class="dropdown-label" for="filter[category_uuid][in][]">
|
||||
{{ label }}
|
||||
</label>
|
||||
|
||||
<select
|
||||
class="np-filter-select"
|
||||
multiple
|
||||
name="filter[{{ key }}][in][]"
|
||||
>
|
||||
{% for filter in filters %}
|
||||
<option
|
||||
value="{{ filter.value }}"
|
||||
{% if filter.selected? %} selected="selected" {% endif %}
|
||||
>
|
||||
{{ filter.name }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
@ -1,228 +0,0 @@
|
||||
<div class="filter-heading lora">Filters</div>
|
||||
<div class="filters-option-container">
|
||||
<div class="filter-categories">
|
||||
<div class="filter-option-heading">Core Categories</div>
|
||||
<div class="filter-option-container" id="categoryFiltersCore">
|
||||
{% assign unique_core_categories = "" %}
|
||||
{% for course in courses.in_catalog %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name contains 'Core' %}
|
||||
{% unless unique_core_categories contains category.name %}
|
||||
<div class="category-option">
|
||||
<input class="filter-checkbox" type="checkbox" id="{{category.name}}" />
|
||||
<label>{{category.name}}</label>
|
||||
</div>
|
||||
{% assign unique_core_categories = unique_core_categories | append: category.name %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="filter-option-heading">Omni Categories</div>
|
||||
<div class="filter-option-container" id="categoryFiltersOmni">
|
||||
{% assign unique_omni_categories = "" %}
|
||||
{% for course in courses.in_catalog %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name contains 'Omni' %}
|
||||
{% unless unique_omni_categories contains category.name %}
|
||||
<div class="category-option">
|
||||
<input class="filter-checkbox" type="checkbox" id="{{category.name}}" />
|
||||
<label>{{category.name}}</label>
|
||||
</div>
|
||||
{% assign unique_omni_categories = unique_omni_categories | append: category.name %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fiter-duration">
|
||||
<div class="filter-option-heading">Course Duration</div>
|
||||
<div class="filter-option-container" id="course-duration">
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<10" />
|
||||
<label>< 10 min</label>
|
||||
</div>
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<20" />
|
||||
<label>< 20 min</label>
|
||||
</div>
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<30" />
|
||||
<label>< 30 min</label>
|
||||
</div>
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<45" />
|
||||
<label>< 45 min</label>
|
||||
</div>
|
||||
<div class="time-option">
|
||||
<input class="duration-checkbox" type="checkbox" id="<60" />
|
||||
<label>< 60 min</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.filter-container {
|
||||
width: 25%;
|
||||
height: fit-content;
|
||||
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
||||
padding: 1.5rem;
|
||||
border-radius: 20px;
|
||||
color: #002f6f;
|
||||
}
|
||||
.filter-heading {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.filter-option-heading {
|
||||
font-weight: 700;
|
||||
}
|
||||
.filter-option-container {
|
||||
margin: 15px 10px;
|
||||
}
|
||||
.category-option, .time-option {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
|
||||
function sortLabelsAlphabetically() {
|
||||
const categoryContainerOmni = document.getElementById("categoryFiltersOmni");
|
||||
const categoryOptionsOmni = categoryContainerOmni.querySelectorAll(".category-option");
|
||||
const categoryOptionsArrayOmni = Array.from(categoryOptionsOmni);
|
||||
|
||||
const categoryContainerCore = document.getElementById("categoryFiltersCore");
|
||||
const categoryOptionsCore = categoryContainerCore.querySelectorAll(".category-option");
|
||||
const categoryOptionsArrayCore = Array.from(categoryOptionsCore);
|
||||
|
||||
categoryOptionsArrayOmni.sort((a, b) => {
|
||||
const labelA = a.querySelector("label").innerText.toLowerCase();
|
||||
const labelB = b.querySelector("label").innerText.toLowerCase();
|
||||
return labelA.localeCompare(labelB);
|
||||
});
|
||||
|
||||
categoryContainerOmni.innerHTML = "";
|
||||
|
||||
categoryOptionsArrayOmni.forEach((categoryOption) => {
|
||||
categoryContainerOmni.appendChild(categoryOption);
|
||||
});
|
||||
|
||||
categoryOptionsArrayCore.sort((a, b) => {
|
||||
const labelA = a.querySelector("label").innerText.toLowerCase();
|
||||
const labelB = b.querySelector("label").innerText.toLowerCase();
|
||||
return labelA.localeCompare(labelB);
|
||||
});
|
||||
|
||||
categoryContainerCore.innerHTML = "";
|
||||
|
||||
categoryOptionsArrayCore.forEach((categoryOption) => {
|
||||
categoryContainerCore.appendChild(categoryOption);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
var categoryCheckboxes = document.querySelectorAll('.filter-checkbox');
|
||||
var durationCheckboxes = document.querySelectorAll('.duration-checkbox');
|
||||
|
||||
|
||||
categoryCheckboxes.forEach(function (checkbox) {
|
||||
checkbox.addEventListener('change', function () {
|
||||
filterCourses();
|
||||
});
|
||||
});
|
||||
|
||||
durationCheckboxes.forEach(function (checkbox) {
|
||||
checkbox.addEventListener('change', function () {
|
||||
filterCourses();
|
||||
});
|
||||
});
|
||||
|
||||
var urlParams = new URLSearchParams(window.location.search);
|
||||
var categoryFromUrl = urlParams.get('category');
|
||||
var durationFromUrl = urlParams.get('duration');
|
||||
|
||||
if (categoryFromUrl) {
|
||||
var categoryCheckbox = document.getElementById(categoryFromUrl);
|
||||
if (categoryCheckbox) {
|
||||
categoryCheckbox.click();
|
||||
}
|
||||
}
|
||||
|
||||
if (durationFromUrl) {
|
||||
var durationCheckbox = document.getElementById(durationFromUrl);
|
||||
if (durationCheckbox) {
|
||||
durationCheckbox.click();
|
||||
}
|
||||
}
|
||||
sortLabelsAlphabetically();
|
||||
filterCourses();
|
||||
});
|
||||
|
||||
|
||||
function filterCourses() {
|
||||
var selectedCategories = getSelectedCategories();
|
||||
var selectedDurations = getSelectedDurations();
|
||||
var cards = document.querySelectorAll('.card');
|
||||
|
||||
cards.forEach(function (card) {
|
||||
var categories = card.getAttribute('categories');
|
||||
var duration = parseInt(card.getAttribute('duration'), 10);
|
||||
|
||||
var categoryMatch = selectedCategories.length === 0 || matchesCategories(categories, selectedCategories);
|
||||
var durationMatch = selectedDurations.length === 0 || matchesDuration(duration, selectedDurations);
|
||||
|
||||
if (categoryMatch && durationMatch) {
|
||||
card.parentElement.style.display = 'flex';
|
||||
} else {
|
||||
card.parentElement.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getSelectedCategories() {
|
||||
var selectedCategories = [];
|
||||
var checkboxes = document.querySelectorAll('.filter-checkbox:checked');
|
||||
checkboxes.forEach(function (checkbox) {
|
||||
selectedCategories.push(checkbox.id);
|
||||
});
|
||||
return selectedCategories;
|
||||
}
|
||||
|
||||
function getSelectedDurations() {
|
||||
var selectedDurations = [];
|
||||
var checkboxes = document.querySelectorAll('.duration-checkbox:checked');
|
||||
checkboxes.forEach(function (checkbox) {
|
||||
selectedDurations.push(checkbox.id);
|
||||
});
|
||||
return selectedDurations;
|
||||
}
|
||||
|
||||
function matchesCategories(courseCategories, selectedCategories) {
|
||||
var courseCategoriesArray = courseCategories.split(',').map(function (category) {
|
||||
return category.trim();
|
||||
});
|
||||
|
||||
return selectedCategories.some(function (selectedCategory) {
|
||||
return courseCategoriesArray.includes(selectedCategory);
|
||||
});
|
||||
}
|
||||
|
||||
function matchesDuration(courseDuration, selectedDurations) {
|
||||
return selectedDurations.every(function (selectedDuration) {
|
||||
var durationRange = parseInt(selectedDuration.replace('<', ''), 10);
|
||||
return courseDuration < durationRange;
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,76 +0,0 @@
|
||||
<div class="filter-heading lora">Filters</div>
|
||||
<div class="filters-option-container">
|
||||
<div class="filter-categories">
|
||||
<div class="filter-option-container" id="lpFilters">
|
||||
<div class="category-option">
|
||||
<input class="filter-checkbox" type="checkbox" id="Core" />
|
||||
<label>Core</label>
|
||||
</div>
|
||||
<div class="category-option">
|
||||
<input class="filter-checkbox" type="checkbox" id="Omni" />
|
||||
<label>Omni</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<style>
|
||||
.filter-container {
|
||||
width: 25%;
|
||||
height: fit-content;
|
||||
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
|
||||
padding: 1.5rem;
|
||||
border-radius: 20px;
|
||||
color: #002f6f;
|
||||
}
|
||||
.filter-heading {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.filter-option-heading {
|
||||
font-weight: 700;
|
||||
}
|
||||
.filter-option-container {
|
||||
margin: 15px 10px;
|
||||
}
|
||||
.category-option, .time-option {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
var checkboxes = document.querySelectorAll('.filter-checkbox');
|
||||
|
||||
checkboxes.forEach(function(checkbox) {
|
||||
checkbox.addEventListener('change', function() {
|
||||
var selectedCategories = Array.from(checkboxes)
|
||||
.filter(function(checkbox) {
|
||||
return checkbox.checked;
|
||||
})
|
||||
.map(function(checkbox) {
|
||||
return checkbox.id;
|
||||
});
|
||||
|
||||
var cards = document.querySelectorAll('.lp-card');
|
||||
|
||||
cards.forEach(function(card) {
|
||||
var category = card.getAttribute('category');
|
||||
card.style.display = selectedCategories.length === 0 || selectedCategories.includes(category) ? 'block' : 'none';
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -1,53 +0,0 @@
|
||||
|
||||
<footer class="np-footer">
|
||||
<div class="np-footer-top">
|
||||
{% if website_footer.show_navigation_links? %}
|
||||
<div class="np-footer-navigation">
|
||||
<ul class="np-footer-navigation-list">
|
||||
<div class="footer-heading lora">Resources</div>
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link"
|
||||
href="https://connect.cin7.com/"
|
||||
target="_blank"
|
||||
>
|
||||
Omni Knowledge Base
|
||||
</a>
|
||||
</li>
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link"
|
||||
href="https://support.dearsystems.com/"
|
||||
target="_blank"
|
||||
>
|
||||
Core Knowledge Base
|
||||
</a>
|
||||
</li>
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link"
|
||||
href="https://www.cin7.com/product-updates/"
|
||||
target="_blank"
|
||||
>
|
||||
Release Notes
|
||||
</a>
|
||||
</li>
|
||||
{% if website_footer.show_customer_service_email? and
|
||||
website_footer.school_customer_service_email
|
||||
%}
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link"
|
||||
href="mailto:academy-admin@cin7.com"
|
||||
target="_blank"
|
||||
>
|
||||
Contact: {{ website_footer.school_customer_service_email }}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
@ -1,41 +0,0 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
|
||||
|
||||
<script src=
|
||||
"https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js">
|
||||
</script>
|
||||
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick.css"/>
|
||||
<!-- Add the slick-theme.css if you want default styling -->
|
||||
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick-theme.css"/>
|
||||
<script type="text/javascript" src="//cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick.min.js"></script>
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap" rel="stylesheet">
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
function modifyCourseNames() {
|
||||
var courseElements = document.querySelectorAll('.course-name');
|
||||
|
||||
courseElements.forEach(function(courseElement) {
|
||||
var courseName = courseElement.textContent;
|
||||
var modifiedCourseName = courseName.replace(/\[[^\]]+\]/g, '');
|
||||
courseElement.textContent = modifiedCourseName;
|
||||
});
|
||||
}
|
||||
function removeBadgeShadow() {
|
||||
document.querySelectorAll('.card-badge').forEach(e=>{
|
||||
e.parentElement.parentElement.style.boxShadow='none';
|
||||
})
|
||||
}
|
||||
|
||||
modifyCourseNames();
|
||||
removeBadgeShadow();
|
||||
});
|
||||
|
||||
</script>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user