Cayuse and Crayon templates. Added Talkspace's emails as temporary files, but still need to organize them.
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.
@ -0,0 +1,40 @@
|
|||||||
|
<div class="np-card">
|
||||||
|
<div class="np-card-container">
|
||||||
|
{% if course.ribbon %}
|
||||||
|
<div class="np-card-ribbon">
|
||||||
|
{{ course.ribbon }}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
<img
|
||||||
|
class="np-card-image"
|
||||||
|
alt="{{ course.name }}"
|
||||||
|
src="{{ course.image_url }}"
|
||||||
|
>
|
||||||
|
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||||
|
<h3 class="np-card-content-title">
|
||||||
|
{{ course.name }}
|
||||||
|
</h3>
|
||||||
|
<div class="np-card-content-subtitle">
|
||||||
|
{{ course.instructor_names }}
|
||||||
|
</div>
|
||||||
|
<div class="course-description">
|
||||||
|
{{ course.short_description }}
|
||||||
|
</div>
|
||||||
|
<div class="np-card-content-footer">
|
||||||
|
<div class="np-card-content-progress np-button-color">
|
||||||
|
{% t shared.progress, count: course.progress %}
|
||||||
|
</div>
|
||||||
|
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||||
|
{% if course.has_to_restart? %}
|
||||||
|
{% include "course_version_outdated_popup", path: course_path %}
|
||||||
|
{% endif %}
|
||||||
|
<div class="button-wrapper">
|
||||||
|
<a class="np-button np-button-wide" href="{{ course_path }}">
|
||||||
|
{% t shared.view %}
|
||||||
|
</a>
|
||||||
|
<div class="back-button"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@ -0,0 +1,73 @@
|
|||||||
|
<div class="np-card np-no-horizontal-padding">
|
||||||
|
<div class="np-card-container">
|
||||||
|
<div class="np-learning-path">
|
||||||
|
<img
|
||||||
|
alt="{{ learning_path.name }}"
|
||||||
|
class="np-card-image np-learning-path-image"
|
||||||
|
src="{{ learning_path.image_url }}"
|
||||||
|
/>
|
||||||
|
<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>
|
||||||
|
<div class="button-wrapper">
|
||||||
|
<a class="np-button" href="{% route learning_path, id: learning_path.id %}">
|
||||||
|
{% t shared.view %}
|
||||||
|
</a>
|
||||||
|
<div class="back-button"></div>
|
||||||
|
</div>
|
||||||
|
<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 class="np-card-stack">
|
||||||
|
<div class="np-card-stack-level-1"></div>
|
||||||
|
<div class="np-card-stack-level-2"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@ -0,0 +1,48 @@
|
|||||||
|
<div class="np-card">
|
||||||
|
<div class="np-card-container">
|
||||||
|
<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-button-background-color np-card-training-session-date-bar"></div>
|
||||||
|
<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 class="button-wrapper">
|
||||||
|
<a
|
||||||
|
class="np-button np-button-wide"
|
||||||
|
href="{% route training_session, id: training_event.sessions.first.id %}"
|
||||||
|
>
|
||||||
|
{% t shared.view %}
|
||||||
|
</a>
|
||||||
|
<div class="back-button"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@ -0,0 +1,34 @@
|
|||||||
|
<div class="courses-filter">
|
||||||
|
<div class="courses-filter-title">
|
||||||
|
Categories
|
||||||
|
</div>
|
||||||
|
<div class="courses-filter-item courses-filter-item-active" filter-category="ALL" onclick="filterCourses(this);">
|
||||||
|
All
|
||||||
|
</div>
|
||||||
|
{% for category in categories.in_catalog %}
|
||||||
|
<div class="courses-filter-item" filter-category="{{ category.id }}" onclick="filterCourses(this);">
|
||||||
|
{{ category.name }}
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
function filterCourses(element) {
|
||||||
|
let categoryId = element.getAttribute('filter-category');
|
||||||
|
document.querySelector('.courses-filter-item-active').classList.remove('courses-filter-item-active');
|
||||||
|
element.classList.add('courses-filter-item-active');
|
||||||
|
if (categoryId === 'ALL') {
|
||||||
|
document.querySelectorAll('.filter-hidden').forEach(x => {
|
||||||
|
x.classList.remove('filter-hidden');
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
document.querySelectorAll('[course-category]').forEach(x => {
|
||||||
|
if (x.getAttribute('course-category').includes(categoryId)) {
|
||||||
|
x.classList.remove('filter-hidden');
|
||||||
|
} else {
|
||||||
|
x.classList.add('filter-hidden');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -0,0 +1,20 @@
|
|||||||
|
<div class="courses-list np-hidden">
|
||||||
|
<div class="np-resource-title courses-list-title">
|
||||||
|
Library
|
||||||
|
</div>
|
||||||
|
<div class="row courses-wrapper">
|
||||||
|
<div class="courses-filter-wrapper col-12 col-md-3">
|
||||||
|
{% include "courses_filter" %}
|
||||||
|
</div>
|
||||||
|
<div class="courses-wrapper row row-with-thumbnails col-12 col-md-9">
|
||||||
|
{% for course in courses.in_catalog %}
|
||||||
|
<div class="col-xs-12 col-sm-6 col-xl-4 np-stretch-content role-hidden" course-category="{{ course.categories | map: 'id' | join: ' ' }}" course-role="{{ course.properties.role }}">
|
||||||
|
{% include "cards_course" %}
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
<div class="zero-state np-hidden">
|
||||||
|
{% include "courses_zero_state", message: "No courses matching criteria" %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@ -0,0 +1,9 @@
|
|||||||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
|
||||||
|
|
||||||
|
{% styles default %}
|
||||||
|
{% styles colors %}
|
||||||
|
{% styles custom %}
|
||||||
|
|
||||||
|
|
||||||
178
Custom_Templates/customer_templates/Cayuse/_header.html.liquid
Normal file
178
Custom_Templates/customer_templates/Cayuse/_header.html.liquid
Normal file
@ -0,0 +1,178 @@
|
|||||||
|
<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"
|
||||||
|
>
|
||||||
|
{{ 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"
|
||||||
|
>
|
||||||
|
{{ 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" %}
|
||||||
@ -0,0 +1,83 @@
|
|||||||
|
<div class="topics-wrapper col-xs-12">
|
||||||
|
<h3 class="topics-title">
|
||||||
|
Popular Topics
|
||||||
|
</h3>
|
||||||
|
<div class="topics row">
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360002631894-Animal-Oversight">
|
||||||
|
Animal Oversight
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/1500001762282-Connect-Conference-Community">
|
||||||
|
Cayuse Community
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/9886295600147-Cayuse-Modernization">
|
||||||
|
Cayuse Modernization
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360000137107-Fund-Manager-Effort-and-Grants">
|
||||||
|
Fund Manager, Effort, and Grants
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/115001977467-Human-Ethics">
|
||||||
|
Human Ethics
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360003816254-Integrations-and-APIs">
|
||||||
|
Integrations & APIs
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360001518894-Outside-Interests">
|
||||||
|
Outside Interests
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/115002015648-Platform-and-Admin">
|
||||||
|
Platform & Admin
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360001581913-Sponsored-Projects-4-0">
|
||||||
|
Sponsored Projects 4.0
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||||
|
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360002101954-Vivarium-Operations-and-Vet-Care">
|
||||||
|
Vivarium Operations & Vet Care
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.topics-title {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.topic-wrapper {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.topic {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
text-align: center;
|
||||||
|
border: 2px solid #253272;
|
||||||
|
padding: 8px 0;
|
||||||
|
color: #253272;
|
||||||
|
border-radius: 6px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.topic:hover {
|
||||||
|
color: white;
|
||||||
|
background: rgba(37,50,114, 0.9);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,106 @@
|
|||||||
|
<div class="role-select container">
|
||||||
|
<div class="role-select-title">
|
||||||
|
Library
|
||||||
|
</div>
|
||||||
|
<div class="role-select-list row">
|
||||||
|
<a class="role-select-item col-12 col-md-6 col-xl-3" href="#administrators">
|
||||||
|
<div class="role-select-item-container">
|
||||||
|
<img class="role-select-image" src="https://cdn.northpass.io/Cayuse/admin.jpg">
|
||||||
|
<div class="role-select-item-text">
|
||||||
|
<div class="role-select-item-name">
|
||||||
|
Administrators
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a class="role-select-item col-12 col-md-6 col-xl-3" href="#researchers">
|
||||||
|
<div class="role-select-item-container">
|
||||||
|
<img class="role-select-image" src="https://cdn.northpass.io/Cayuse/researcher.jpg">
|
||||||
|
<div class="role-select-item-text">
|
||||||
|
<div class="role-select-item-name">
|
||||||
|
Researchers
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a class="role-select-item col-12 col-md-6 col-xl-3" href="#it-managers">
|
||||||
|
<div class="role-select-item-container">
|
||||||
|
<img class="role-select-image" src="https://cdn.northpass.io/Cayuse/it_manager.jpg">
|
||||||
|
<div class="role-select-item-text">
|
||||||
|
<div class="role-select-item-name">
|
||||||
|
IT Managers
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a class="role-select-item col-12 col-md-6 col-xl-3" href="#staff">
|
||||||
|
<div class="role-select-item-container">
|
||||||
|
<img class="role-select-image" src="https://cdn.northpass.io/Cayuse/staff.jpg">
|
||||||
|
<div class="role-select-item-text">
|
||||||
|
<div class="role-select-item-name">
|
||||||
|
Staff
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
addEventListener("hashchange", () => {
|
||||||
|
showCourses(location.hash.replace('#', ''));
|
||||||
|
});
|
||||||
|
addEventListener('DOMContentLoaded', () => {
|
||||||
|
showCourses(location.hash.replace('#', ''));
|
||||||
|
})
|
||||||
|
|
||||||
|
const roleDescriptions = {
|
||||||
|
'administrators': {
|
||||||
|
name: 'Courses for Administrators',
|
||||||
|
},
|
||||||
|
'researchers': {
|
||||||
|
name: 'Courses for Researchers',
|
||||||
|
},
|
||||||
|
'it-managers': {
|
||||||
|
name: 'Courses for IT Managers',
|
||||||
|
},
|
||||||
|
'staff': {
|
||||||
|
name: 'Courses for Staff',
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function showCourses(name) {
|
||||||
|
let coursesParent = document.querySelector('.courses-wrapper')
|
||||||
|
let roleSelectElement = document.querySelector('.role-select');
|
||||||
|
|
||||||
|
if (!name) {
|
||||||
|
if (roleSelectElement.classList.contains('np-hidden')) {
|
||||||
|
roleSelectElement.classList.remove('np-hidden');
|
||||||
|
document.querySelector('.courses-list').classList.add('np-hidden');
|
||||||
|
}
|
||||||
|
} else if (roleDescriptions[name]) {
|
||||||
|
coursesParent.querySelectorAll('[course-role]').forEach(x => {
|
||||||
|
if (x.getAttribute('course-role') === name) {
|
||||||
|
x.classList.remove('role-hidden');
|
||||||
|
} else {
|
||||||
|
x.classList.add('role-hidden');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
document.querySelectorAll('[filter-category]:not([filter-category="ALL"])').forEach( x => {
|
||||||
|
if (coursesParent.querySelector(`[course-category*="${x.getAttribute('filter-category')}"][course-role="${name}"]`)) {
|
||||||
|
x.classList.remove('role-hidden');
|
||||||
|
} else {
|
||||||
|
x.classList.add('role-hidden');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
document.querySelector('.courses-list-title').innerText = roleDescriptions[name].name;
|
||||||
|
|
||||||
|
if (!roleSelectElement.classList.contains('np-hidden')) {
|
||||||
|
roleSelectElement.classList.add('np-hidden');
|
||||||
|
document.querySelector('.courses-list').classList.remove('np-hidden');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -0,0 +1,25 @@
|
|||||||
|
<nav class="np-sub-navigation np-hidden-desktop">
|
||||||
|
<div class="np-sub-navigation-content">
|
||||||
|
{% for link in navigations.sub_navigation %}
|
||||||
|
{% unless link.label == 'Catalog' %}
|
||||||
|
{% if link.label == 'Home' %}
|
||||||
|
<div class="np-sub-navigation-content-item {{ link.active_class }}">
|
||||||
|
<a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
|
||||||
|
<i class="{{ link.icon }} np-button-color np-sub-navigation-content-item-icon"></i>
|
||||||
|
Library
|
||||||
|
</a>
|
||||||
|
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
||||||
|
</div>
|
||||||
|
{% else %}
|
||||||
|
<div class="np-sub-navigation-content-item {{ link.active_class }}">
|
||||||
|
<a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
|
||||||
|
<i class="{{ link.icon }} np-button-color np-sub-navigation-content-item-icon"></i>
|
||||||
|
{{ link.label }}
|
||||||
|
</a>
|
||||||
|
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% endunless %}
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
@ -0,0 +1,59 @@
|
|||||||
|
{% include "header" %}
|
||||||
|
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
||||||
|
{% include "sub_navigation" %}
|
||||||
|
<main class="np-main np-courses np-subpage-container np-max-width">
|
||||||
|
{% include "role_select" %}
|
||||||
|
{% include 'courses_with_filter' %}
|
||||||
|
</main>
|
||||||
|
{% include "footer" %}
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.courses-filter {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.courses-filter-title {
|
||||||
|
font-size: 22px;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.courses-filter-item {
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 5px 0;
|
||||||
|
}
|
||||||
|
.courses-filter-item-active {
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: auto;
|
||||||
|
}
|
||||||
|
.role-select-title {
|
||||||
|
font-size: 30px;
|
||||||
|
font-weight: 600;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.role-select-item-container {
|
||||||
|
padding: 20px 30px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
border: 1px solid darkblue;
|
||||||
|
border-radius: 8px;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.role-select-item-name {
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.role-select-item {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.role-select-image {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.role-select-item-text {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
.role-hidden, .filter-hidden {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -15,6 +15,7 @@
|
|||||||
</div>
|
</div>
|
||||||
{% include "courses_index", class: "col-xs-12 col-sm-6 np-stretch-content" %}
|
{% include "courses_index", class: "col-xs-12 col-sm-6 np-stretch-content" %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{% if features.training_events? %}
|
{% if features.training_events? %}
|
||||||
<div class="np-grid-spacing col-xs-12 col-sm-4">
|
<div class="np-grid-spacing col-xs-12 col-sm-4">
|
||||||
<div class="np-dashboard-resources-title">
|
<div class="np-dashboard-resources-title">
|
||||||
@ -23,8 +24,7 @@
|
|||||||
{% include "training_events_dashboard" %}
|
{% include "training_events_dashboard" %}
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
{% include 'popular_topics' %}
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
{% include "footer" %}
|
{% include "footer" %}
|
||||||
|
|
||||||
current_page: "/app/user-guides"
|
|
||||||
@ -0,0 +1,55 @@
|
|||||||
|
<script>
|
||||||
|
window.location.href = '/app/courses'
|
||||||
|
</script>
|
||||||
|
{%- comment -%} {% include "header" %}
|
||||||
|
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||||
|
<main class="np-main np-homepage">
|
||||||
|
<div class="np-homepage-hero">
|
||||||
|
<img class="np-homepage-hero-image"
|
||||||
|
src="{{ homepage.artwork_url }}"
|
||||||
|
alt="{{ homepage.headline }}"
|
||||||
|
/>
|
||||||
|
<div class="np-homepage-hero-content">
|
||||||
|
<div class="np-homepage-headline np-header-font-color">
|
||||||
|
{{ homepage.headline }}
|
||||||
|
</div>
|
||||||
|
<div class="np-homepage-subheadline np-header-font-color">
|
||||||
|
{{ homepage.subheadline }}
|
||||||
|
</div>
|
||||||
|
<a class="np-homepage-hero-cta np-button" href="{% route catalog %}">
|
||||||
|
{% t .discover %}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% include "sub_navigation" %}
|
||||||
|
<div class="np-homepage-featured np-max-width">
|
||||||
|
<div class="np-homepage-featured-text">
|
||||||
|
<div class="np-homepage-headline">
|
||||||
|
{{ homepage.featured_courses_headline }}
|
||||||
|
</div>
|
||||||
|
<div class="np-homepage-subheadline">
|
||||||
|
{{ homepage.featured_courses_subheadline }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% if courses.featured.any? %}
|
||||||
|
<div class="np-homepage-featured-courses row">
|
||||||
|
{% for course in courses.featured %}
|
||||||
|
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||||
|
{% include "cards_course" with course %}
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
{% else %}
|
||||||
|
<div class="np-homepage-featured-empty">
|
||||||
|
<div class="np-zero-state-text">
|
||||||
|
{% t .empty, key: current_school.course_vocabulary %}
|
||||||
|
</div>
|
||||||
|
<img
|
||||||
|
class="np-zero-state-courses"
|
||||||
|
alt="{% t .empty, key: current_school.course_vocabulary %}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
{% include "footer" %} {%- endcomment -%}
|
||||||
50
Custom_Templates/customer_templates/Cayuse/styles.css.liquid
Normal file
50
Custom_Templates/customer_templates/Cayuse/styles.css.liquid
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
/*
|
||||||
|
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 }}
|
||||||
|
*/
|
||||||
|
|
||||||
|
a, a:hover, a:focus, a:active {
|
||||||
|
text-decoration: none;
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-description {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 768px) and (max-width: 950px){
|
||||||
|
.np-card-content-footer {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.button-wrapper {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.back-button {
|
||||||
|
position: absolute !important;
|
||||||
|
background: #2e3e8f;
|
||||||
|
opacity: 0.8;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
top: 4px;
|
||||||
|
left: 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
.np-button:hover {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.np-card-content-progress {
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
.np-header-desktop-nav-list {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
@ -0,0 +1,82 @@
|
|||||||
|
{% assign topic_classname = topic | split: " " %}
|
||||||
|
|
||||||
|
<div class="courses-carousel np-carousel" data-topic="{{ topic_classname | join: '-' | downcase }}">
|
||||||
|
{% assign sorted_items =items | sort: "name" %}
|
||||||
|
{% for course in courses.in_catalog %}
|
||||||
|
{% assign course_status = "" %}
|
||||||
|
{% if course.started? == false %}
|
||||||
|
{% assign course_status = "not-started" %}
|
||||||
|
{% elsif course.completed? %}
|
||||||
|
{% assign course_status = "completed" %}
|
||||||
|
{% elsif course.started? %}
|
||||||
|
{% assign course_status = "in-progress" %}
|
||||||
|
{% endif %}
|
||||||
|
<div class="np-carousel-card {{course_status}}"> {% include "onboarding_cards_course" with course %}</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$(".courses-carousel").not('.slick-initialized').slick({
|
||||||
|
slidesToShow: 3,
|
||||||
|
cssEase: 'linear',
|
||||||
|
prevArrow: '<i class="fal fa-chevron-left left-arrow"></i>',
|
||||||
|
nextArrow: '<i class="fal fa-chevron-right right-arrow"></i>',
|
||||||
|
infinite: false,
|
||||||
|
responsive: [
|
||||||
|
{
|
||||||
|
breakpoint: 1170,
|
||||||
|
settings: {
|
||||||
|
slidesToShow: 2,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
breakpoint: 768,
|
||||||
|
settings: {
|
||||||
|
slidesToShow: 1,
|
||||||
|
slidesToScroll: 1,
|
||||||
|
dots: false,
|
||||||
|
arrows: true,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener("DOMContentLoaded", function(){
|
||||||
|
let npHideLang = getCookie("npLang");
|
||||||
|
if (npHideLang == "es")
|
||||||
|
{
|
||||||
|
npHideLang = "English";
|
||||||
|
}
|
||||||
|
else if (npHideLang == "en")
|
||||||
|
{
|
||||||
|
npHideLang = "Spanish";
|
||||||
|
}
|
||||||
|
var element = document.querySelectorAll(`[language=${npHideLang}]`);
|
||||||
|
element.forEach(card => {card.classList.add("np-hidden")});
|
||||||
|
})
|
||||||
|
function getCookie(name) {
|
||||||
|
var dc = document.cookie;
|
||||||
|
var prefix = name + "=";
|
||||||
|
var begin = dc.indexOf("; " + prefix);
|
||||||
|
if (begin == -1) {
|
||||||
|
begin = dc.indexOf(prefix);
|
||||||
|
if (begin != 0) return null;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
begin += 2;
|
||||||
|
var end = document.cookie.indexOf(";", begin);
|
||||||
|
if (end == -1) {
|
||||||
|
end = dc.length;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return decodeURI(dc.substring(begin + prefix.length, end));
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -0,0 +1,37 @@
|
|||||||
|
<div class="events-carousel np-carousel np-carousel-bg-blue" id="events-carousel">
|
||||||
|
{% if items.any? %}
|
||||||
|
{% for training_event in items %}
|
||||||
|
<div class="np-carousel-card"> {% include "cards_training_event" with training_event %}</div>
|
||||||
|
{% endfor %}
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$(".events-carousel").slick({
|
||||||
|
slidesToShow: 3,
|
||||||
|
prevArrow: '<i class="fal fa-chevron-left"></i>',
|
||||||
|
nextArrow: '<i class="fal fa-chevron-right"></i>',
|
||||||
|
infinite: false,
|
||||||
|
dots: false,
|
||||||
|
arrows: true,
|
||||||
|
responsive: [
|
||||||
|
{
|
||||||
|
breakpoint: 1170,
|
||||||
|
settings: {
|
||||||
|
slidesToShow: 2,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
breakpoint: 768,
|
||||||
|
settings: {
|
||||||
|
slidesToShow: 1,
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
@ -0,0 +1,170 @@
|
|||||||
|
<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>
|
||||||
|
|
||||||
|
<h1 class="np-header-logo">
|
||||||
|
<a href="{% route home %}">
|
||||||
|
<img
|
||||||
|
alt="{{ current_school.name }}"
|
||||||
|
class="np-header-logo-image school-logo"
|
||||||
|
src="https://www.crayon.co/hubfs/Logo.svg"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
|
||||||
|
{%include 'sub_navigation'%}
|
||||||
|
|
||||||
|
{% 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 %}"
|
||||||
|
>
|
||||||
|
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" %}
|
||||||
|
|
||||||
|
<style>
|
||||||
|
@media screen and (min-width: 768px) {
|
||||||
|
.school-logo {
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,116 @@
|
|||||||
|
{% assign topic_classname = topic | split: " " %}
|
||||||
|
|
||||||
|
<div class="np-progress-filter-wrapper">
|
||||||
|
{% if label %}
|
||||||
|
<div class="np-progress-filter-label">
|
||||||
|
<span class="lang-en">{{ label }}</span>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
<div class="progress-filter filter-select-wrapper select-wrapper np-button lang-en" data-topic="{{ topic_classname | join: '-' | downcase }}" style="border-radius: 8px;">
|
||||||
|
|
||||||
|
<select >
|
||||||
|
<option selected disabled hidden>{{ default_option}}</option>
|
||||||
|
<option value="a">All Courses</option>
|
||||||
|
<option value="n">Not Started</option>
|
||||||
|
<option value="i">In Progress</option>
|
||||||
|
<option value="c">Completed</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.np-progress-filter-label {
|
||||||
|
color: #000;
|
||||||
|
padding-right: 7px;
|
||||||
|
text-transform: none;
|
||||||
|
font-weight:500;
|
||||||
|
font-size:0.812rem;
|
||||||
|
}
|
||||||
|
.np-progress-filter-wrapper {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.filter-select-wrapper {
|
||||||
|
position: relative;
|
||||||
|
padding:0;
|
||||||
|
border: 2px solid rgba(0, 0, 0, 0.25);
|
||||||
|
color: #000;
|
||||||
|
height:auto;
|
||||||
|
text-transform: none;
|
||||||
|
background: transparent;
|
||||||
|
border-radius:0;
|
||||||
|
}
|
||||||
|
.filter-select-wrapper:hover {
|
||||||
|
background:transparent;
|
||||||
|
color:#000;
|
||||||
|
}
|
||||||
|
.select-items {
|
||||||
|
position: absolute;
|
||||||
|
background-color: #062531;
|
||||||
|
top: 105%;
|
||||||
|
left: -2px;
|
||||||
|
z-index: 99;
|
||||||
|
width: 102%;
|
||||||
|
border: 2px solid rgba(255, 255, 255, 0.25);
|
||||||
|
border-top:none;
|
||||||
|
}
|
||||||
|
.select-items div {
|
||||||
|
color: rgba(255, 255, 255, 0.5);
|
||||||
|
border-top:none;
|
||||||
|
cursor: pointer;
|
||||||
|
width:100%;
|
||||||
|
padding: 12px 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-items div:hover { color: rgba(255, 255, 255, 1); }
|
||||||
|
.select-selected {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
padding: 9px 66px 9px 20px;
|
||||||
|
position: relative;
|
||||||
|
color:#000;
|
||||||
|
}
|
||||||
|
.select-selected::after {
|
||||||
|
content:"\f078";
|
||||||
|
font-family: "Font Awesome 5 Pro";
|
||||||
|
position: absolute;
|
||||||
|
width:20px;
|
||||||
|
height:100%;
|
||||||
|
color:rgba(0, 0, 0, 0.5);
|
||||||
|
right:10px;
|
||||||
|
top:0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
font-size:1rem;
|
||||||
|
}
|
||||||
|
.select-selected::before {
|
||||||
|
content:"";
|
||||||
|
position: absolute;
|
||||||
|
width:20px;
|
||||||
|
height:100%;
|
||||||
|
border-left:2px solid rgba(0, 0, 0, 0.25);
|
||||||
|
right:20px;
|
||||||
|
top:0;
|
||||||
|
}
|
||||||
|
.select-selected.select-arrow-active::after { transform: rotate(180deg); }
|
||||||
|
.same-as-selected,
|
||||||
|
.filter-select-wrapper select,
|
||||||
|
.select-hide {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.mo-filter-wrapper {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.select-items div:hover,
|
||||||
|
.same-as-selected {
|
||||||
|
background-color: #062531;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
@ -4,6 +4,8 @@
|
|||||||
|
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js" type="text/javascript"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js" type="text/javascript"></script>
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css" integrity="sha512-wR4oNhLBHf7smjy0K4oqzdWumd+r5/+6QO/vDda76MW5iug4PT7v86FoEkySIJft3XA0Ae6axhIvHrqwm793Nw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||||
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap');
|
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap');
|
||||||
|
|||||||
@ -0,0 +1,47 @@
|
|||||||
|
<div class="progress-ring-wrapper">
|
||||||
|
<svg
|
||||||
|
class="progress-ring"
|
||||||
|
width="{{ size }}"
|
||||||
|
height="{{ size }}">
|
||||||
|
<circle
|
||||||
|
class="circle circle-bg"
|
||||||
|
stroke="{{ stroke_color_bg }}"
|
||||||
|
stroke-width="10"
|
||||||
|
fill="transparent"
|
||||||
|
r="52"
|
||||||
|
cx="60"
|
||||||
|
cy="60"
|
||||||
|
/>
|
||||||
|
<circle
|
||||||
|
class="circle circle-{{ name }}"
|
||||||
|
stroke="{{ stroke_color }}"
|
||||||
|
stroke-width="10"
|
||||||
|
fill="transparent"
|
||||||
|
r="52"
|
||||||
|
cx="60"
|
||||||
|
cy="60"
|
||||||
|
/>
|
||||||
|
<text x="50%" y="50%" text-anchor="middle" stroke="t#fff" stroke-width="1px" fill="{{ number_color }}" dy=".3em">
|
||||||
|
{{ count }}
|
||||||
|
</text>
|
||||||
|
</svg>
|
||||||
|
<h3 class="np-card-content-title progress-circle-label">
|
||||||
|
{{ name }}
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener("DOMContentLoaded", function() {
|
||||||
|
let circle = document.getElementsByClassName("circle-{{ name }}")[0];
|
||||||
|
let radius = circle.r.baseVal.value;
|
||||||
|
let circumference = radius * 2 * Math.PI;
|
||||||
|
|
||||||
|
circle.style.strokeDasharray = `${circumference} ${circumference}`;
|
||||||
|
circle.style.strokeDashoffset = `${circumference}`;
|
||||||
|
|
||||||
|
function setProgress(percent) {
|
||||||
|
circle.style.strokeDashoffset = circumference - percent * circumference;
|
||||||
|
}
|
||||||
|
setProgress('{{ count | divided_by: total }}')
|
||||||
|
})
|
||||||
|
</script>
|
||||||
@ -4,12 +4,49 @@
|
|||||||
{% if link.label == 'Home'%}
|
{% if link.label == 'Home'%}
|
||||||
<div class="np-sub-navigation-content-item {{ link.active_class }}">
|
<div class="np-sub-navigation-content-item {{ link.active_class }}">
|
||||||
<a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
|
<a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
|
||||||
<i class="{{ link.icon }} np-button-color np-sub-navigation-content-item-icon"></i>
|
|
||||||
{{ link.label }}
|
{{ link.label }}
|
||||||
</a>
|
</a>
|
||||||
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
<div class="np-sub-navigation-content-item">
|
||||||
|
<a class="np-sub-navigation-content-item-link" href="#">
|
||||||
|
Blog
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="np-sub-navigation-content-item">
|
||||||
|
<a class="np-sub-navigation-content-item-link" href="#">
|
||||||
|
Support Center
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="np-sub-navigation-content-item">
|
||||||
|
<a class="np-sub-navigation-content-item-link" href="#">
|
||||||
|
Community
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="np-sub-navigation-content-item">
|
||||||
|
<a class="np-sub-navigation-content-item-link" href="#">
|
||||||
|
Case Studies
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.np-sub-navigation-content-item-link {
|
||||||
|
color: #000;
|
||||||
|
font-size: 17px;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
.np-sub-navigation-content-item-link:hover {
|
||||||
|
font-weight: 700;
|
||||||
|
text-decoration: none;
|
||||||
|
transition: all .15s ease;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,131 @@
|
|||||||
|
{% assign ring_background_color = 'rgba(192, 220, 246, 0.6)' %}
|
||||||
|
{% assign ring_fill_color = '#0274de' %}
|
||||||
|
{% assign number_color = 'rgb(0, 0, 0)' %}
|
||||||
|
{% assign text_color = '#0274de' %}
|
||||||
|
{% assign background_color = 'white' %}
|
||||||
|
|
||||||
|
<div class="progress-card-wrapper">
|
||||||
|
<div class="progress-card">
|
||||||
|
{% if courses.enrolled.any? %}
|
||||||
|
{% assign countComplete = 0 %}
|
||||||
|
{% assign countInProgress = 0 %}
|
||||||
|
{% assign countNotStarted = 0 %}
|
||||||
|
{% assign countTotal = 0 | times: 1.0 %}
|
||||||
|
{% for course in courses.enrolled %}
|
||||||
|
{% assign countTotal = countTotal | plus: 1 %}
|
||||||
|
{% if course.progress == 100 %}
|
||||||
|
{% assign countComplete = countComplete | plus: 1 %}
|
||||||
|
{% endif %}
|
||||||
|
{% if course.progress > 0 and course.progress < 100 %}
|
||||||
|
{% assign countInProgress = countInProgress | plus: 1 %}
|
||||||
|
{% endif %}
|
||||||
|
{% if course.progress == 0 %}
|
||||||
|
{% assign countNotStarted = countNotStarted | plus: 1 %}
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
<ul class="progress-circle-list">
|
||||||
|
<li>
|
||||||
|
{%
|
||||||
|
include "progress_circle",
|
||||||
|
name: 'Completed' ,
|
||||||
|
count: countComplete ,
|
||||||
|
total: countTotal,
|
||||||
|
size: "120",
|
||||||
|
stroke_color: ring_fill_color,
|
||||||
|
stroke_color_bg: ring_background_color,
|
||||||
|
text_color: text_color,
|
||||||
|
number_color: number_color
|
||||||
|
%}
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
{%
|
||||||
|
include "progress_circle",
|
||||||
|
name:'In Progress' ,
|
||||||
|
count: countInProgress ,
|
||||||
|
total: countTotal,
|
||||||
|
size: "120",
|
||||||
|
stroke_color: ring_fill_color,
|
||||||
|
stroke_color_bg: ring_background_color,
|
||||||
|
text_color: text_color,
|
||||||
|
number_color: number_color
|
||||||
|
%}
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
{% else %}
|
||||||
|
{% capture message %}
|
||||||
|
{% t shared.zero_state.courses.index,
|
||||||
|
key: current_school.course_vocabulary
|
||||||
|
%}
|
||||||
|
{% endcapture %}
|
||||||
|
{% include "courses_zero_state", message: message %}
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.progress-card {
|
||||||
|
border-radius: 8px;
|
||||||
|
background: {{ background_color }};
|
||||||
|
padding: 0;
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 2.187rem;
|
||||||
|
width: 100%;
|
||||||
|
border: 2px solid rgba(0,0,0, 0.25);
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
.progress-circle-list {
|
||||||
|
padding: 0;
|
||||||
|
list-style-type: none !important;
|
||||||
|
justify-content: space-around;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
max-width: 400px;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
.progress-ring-wrapper {
|
||||||
|
flex: 0;
|
||||||
|
flex-direction: column;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
padding: 1.5rem 1rem 1rem 1rem;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.progress-ring circle {
|
||||||
|
stroke-linecap: round;
|
||||||
|
transition: stroke-dashoffset 0.35s;
|
||||||
|
transform: rotate(-90deg);
|
||||||
|
transform-origin: center;
|
||||||
|
}
|
||||||
|
.progress-ring text {
|
||||||
|
font-size:2rem;
|
||||||
|
}
|
||||||
|
.progress-circle-label {
|
||||||
|
color: {{ text_color }};
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width:768px) {
|
||||||
|
.progress-ring-wrapper {
|
||||||
|
padding: 1.5rem 0.4rem 1rem 0.4rem;
|
||||||
|
}
|
||||||
|
.progress-circle-list {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 1023px) {
|
||||||
|
.progress-circle-list {
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width:1170px) {
|
||||||
|
.progress-ring text {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
}
|
||||||
|
.progress-ring-wrapper {
|
||||||
|
padding: 1.5rem 1rem 1rem 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,61 +1,231 @@
|
|||||||
{% include "header" %}
|
|
||||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
{% include "custom_header" %}
|
||||||
<main class="np-main-onboarding np-homepage-onboarding">
|
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
||||||
<div class="np-homepage-hero">
|
|
||||||
<img class="np-homepage-hero-image"
|
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||||
src="{{ homepage.artwork_url }}"
|
<div class="np-dashboard-header">
|
||||||
alt="{{ homepage.headline }}"
|
<div class="np-resource-title">Hi {{current_person.first_name}}!</div>
|
||||||
/>
|
<div class="np-resource-subtitle">This is what's relevant to you right now
|
||||||
<div class="np-homepage-hero-content">
|
in Crayon Onboarding Academy.</div>
|
||||||
<div class="np-homepage-headline np-header-font-color">
|
|
||||||
{{ homepage.headline }}
|
|
||||||
</div>
|
|
||||||
<div class="np-homepage-subheadline np-header-font-color">
|
|
||||||
{{ homepage.subheadline }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
{% include "sub_navigation" %}
|
<div class="row np-flex-center">
|
||||||
<div class="np-homepage-featured np-max-width">
|
<div class="col-xs-12 col-md-8">
|
||||||
<div class="np-homepage-featured-text">
|
{% if features.learning_paths? %}
|
||||||
<div class="np-homepage-headline">
|
<div class="np-dashboard-resources-title">
|
||||||
{{ homepage.featured_courses_headline }}
|
{% t shared.learning_paths %}
|
||||||
</div>
|
|
||||||
<div class="np-homepage-subheadline">
|
|
||||||
{{ homepage.featured_courses_subheadline }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% if courses.enrolled.any? %}
|
|
||||||
<div class="np-homepage-featured-courses row">
|
|
||||||
{% for course in courses.enrolled %}
|
|
||||||
{% comment %} {% if course.properties.featured_onboarding %} {% endif %}{% endcomment %}
|
|
||||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
|
||||||
{% include "onboarding_cards_course" with course %}
|
|
||||||
</div>
|
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
{% else %}
|
|
||||||
<div class="np-homepage-featured-empty">
|
|
||||||
<div class="np-zero-state-text">
|
|
||||||
{% t .empty, key: current_school.course_vocabulary %}
|
|
||||||
</div>
|
</div>
|
||||||
<img
|
{% include "learning_paths_index", items: learning_paths.available %}
|
||||||
class="np-zero-state-courses"
|
{% endif %}
|
||||||
alt="{% t .empty, key: current_school.course_vocabulary %}"
|
</div>
|
||||||
/>
|
<div class="np-grid-spacing col-xs-12 col-md-4 progress-section">
|
||||||
</div>
|
<div class="np-dashboard-resources-title">Course Progress</div>
|
||||||
{% endif %}
|
{% include "widget_course_progress" %}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="row dashboard-section-courses">
|
||||||
|
<div class="col-xs-12">
|
||||||
|
{% if courses.in_catalog.any? %}
|
||||||
|
<div class="np-md-flex-wrapper onboarding-wrapper">
|
||||||
|
<div>
|
||||||
|
</div>
|
||||||
|
{%
|
||||||
|
include "filter_by_progress",
|
||||||
|
label: "Filter by Progress:",
|
||||||
|
default_option: "All Courses",
|
||||||
|
topic: "enrolled_category",
|
||||||
|
%}
|
||||||
|
</div>
|
||||||
|
{%
|
||||||
|
include "carousel_courses",
|
||||||
|
items: courses.in_catalog,
|
||||||
|
topic: "enrolled_category",
|
||||||
|
%}
|
||||||
|
{% else %}
|
||||||
|
<div class="np-dashboard-resources-title" style="margin-bottom:19px;">
|
||||||
|
Courses
|
||||||
|
</div>
|
||||||
|
{% capture message %}
|
||||||
|
{% t shared.zero_state.courses.index,
|
||||||
|
key: current_school.course_vocabulary
|
||||||
|
%}
|
||||||
|
{% endcapture %}
|
||||||
|
<div style="margin-bottom:3rem;">
|
||||||
|
{% include "courses_zero_state", message: message %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row dashboard-section-events">
|
||||||
|
<div class="col-xs-12">
|
||||||
|
<div class="np-dashboard-resources-title" style="margin-bottom: 5px;">
|
||||||
|
Training Events
|
||||||
|
</div>
|
||||||
|
<div class="np-dashboard-resources-category" style="margin-bottom: 19px;">
|
||||||
|
Discover online events to maximize your learning
|
||||||
|
</div>
|
||||||
|
{% if training_events.available.any? %}
|
||||||
|
{%
|
||||||
|
include "carousel_events",
|
||||||
|
items: training_events.available,
|
||||||
|
%}
|
||||||
|
{% else %}
|
||||||
|
<div style="margin-bottom:3rem;">
|
||||||
|
{% include "training_events_zero_state" %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
{% include "footer" %}
|
{% include "footer" %}
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.np-main-onboarding {
|
@media screen and (max-width: 1024px) {
|
||||||
background: white;
|
.progress-section {
|
||||||
}
|
padding-left: 0.5rem
|
||||||
|
}
|
||||||
.np-footer .np-sub-navigation {
|
}
|
||||||
background: white !important;
|
.np-dashboard {
|
||||||
}
|
background: #fff;
|
||||||
|
padding-top: 160px;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
.right-arrow {
|
||||||
|
display: none !important;
|
||||||
|
position: relative;
|
||||||
|
top: 50%;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
font-size: 2rem;
|
||||||
|
margin-left: 2rem;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.left-arrow {
|
||||||
|
display: none !important;
|
||||||
|
position: relative;
|
||||||
|
top: 50%;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
font-size: 2rem;
|
||||||
|
margin-left: -2rem;
|
||||||
|
z-index: 11;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.np-resource-title {
|
||||||
|
font-size: 40px;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
.np-resource-subtitle, .np-dashboard-resources-title, .np-dashboard-resources-category {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
.np-header {
|
||||||
|
position: fixed;
|
||||||
|
border-bottom: 1px solid rgba(0,0,0,0.25);
|
||||||
|
}
|
||||||
|
.onboarding-wrapper {
|
||||||
|
padding: 2rem 0;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
<script>
|
||||||
|
// Creates the custom dropdown and dropdown functionality
|
||||||
|
var x, i, j, l, ll, selElmnt, a, b, c;
|
||||||
|
/* Look for any elements with the class “select-wrapper”: */
|
||||||
|
x = document.getElementsByClassName("progress-filter");
|
||||||
|
l = x.length;
|
||||||
|
for (i = 0; i < l; i++) {
|
||||||
|
selElmnt = x[i].getElementsByTagName("select")[0];
|
||||||
|
ll = selElmnt.length;
|
||||||
|
a = document.createElement("DIV");
|
||||||
|
a.setAttribute("class", "select-selected");
|
||||||
|
a.innerHTML = selElmnt.options[selElmnt.selectedIndex].innerHTML;
|
||||||
|
x[i].appendChild(a);
|
||||||
|
b = document.createElement("DIV");
|
||||||
|
b.setAttribute("class", "select-items select-hide");
|
||||||
|
for (j = 1; j < ll; j++) {
|
||||||
|
c = document.createElement("DIV");
|
||||||
|
c.innerHTML = selElmnt.options[j].innerHTML;
|
||||||
|
c.addEventListener("click", function(e) {
|
||||||
|
var y, i, k, s, h, sl, yl;
|
||||||
|
s = this.parentNode.parentNode.getElementsByTagName("select")[0];
|
||||||
|
sl = s.length;
|
||||||
|
h = this.parentNode.previousSibling;
|
||||||
|
for (i = 0; i < sl; i++) {
|
||||||
|
if (s.options[i].innerHTML == this.innerHTML) {
|
||||||
|
s.selectedIndex = i;
|
||||||
|
h.innerHTML = this.innerHTML;
|
||||||
|
y = this.parentNode.getElementsByClassName("same-as-selected");
|
||||||
|
yl = y.length;
|
||||||
|
for (k = 0; k < yl; k++) {
|
||||||
|
y[k].removeAttribute("class");
|
||||||
|
}
|
||||||
|
this.setAttribute("class", "same-as-selected");
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
filterCourses(this);
|
||||||
|
|
||||||
|
h.click();
|
||||||
|
});
|
||||||
|
b.appendChild(c);
|
||||||
|
}
|
||||||
|
x[i].appendChild(b);
|
||||||
|
a.addEventListener("click", function(e) {
|
||||||
|
e.stopPropagation();
|
||||||
|
closeAllSelect(this);
|
||||||
|
this.nextSibling.classList.toggle("select-hide");
|
||||||
|
this.classList.toggle("select-arrow-active");
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeAllSelect(elmnt) {
|
||||||
|
var x, y, i, xl, yl, arrNo = [];
|
||||||
|
x = document.getElementsByClassName("select-items");
|
||||||
|
y = document.getElementsByClassName("select-selected");
|
||||||
|
xl = x.length;
|
||||||
|
yl = y.length;
|
||||||
|
for (i = 0; i < yl; i++) {
|
||||||
|
if (elmnt == y[i]) {
|
||||||
|
arrNo.push(i)
|
||||||
|
} else {
|
||||||
|
y[i].classList.remove("select-arrow-active");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
for (i = 0; i < xl; i++) {
|
||||||
|
if (arrNo.indexOf(i)) {
|
||||||
|
x[i].classList.add("select-hide");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* If the user clicks anywhere outside the select box,
|
||||||
|
then close all select boxes: */
|
||||||
|
document.addEventListener("click", closeAllSelect);
|
||||||
|
$(".select-items div").each(function() {
|
||||||
|
if($( this ).text() == $(".select-selected").text()) {
|
||||||
|
$(this).addClass("same-as-selected");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function filterCourses(selectedItem) {
|
||||||
|
|
||||||
|
let filterGroup = $(selectedItem).closest(".progress-filter").data("topic");
|
||||||
|
let selectedFilter = $(selectedItem).text().replace(" ", "-").toLowerCase();
|
||||||
|
let carouselGroup = $('.courses-carousel[data-topic="' + filterGroup + '"]');
|
||||||
|
|
||||||
|
carouselGroup.slick('slickUnfilter');
|
||||||
|
|
||||||
|
if (selectedFilter != "all-courses") {
|
||||||
|
carouselGroup.slick('slickFilter', `.${selectedFilter}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
$(".np-sub-navigation-content-item-link:contains('Dashboard')").parent().addClass("np-sub-navigation-content-item-active")
|
||||||
|
</script>
|
||||||
|
|||||||
@ -205,7 +205,7 @@ body, html, div {
|
|||||||
.np-sub-navigation-content-item-inactive,
|
.np-sub-navigation-content-item-inactive,
|
||||||
.np-sub-navigation-content-item-active,
|
.np-sub-navigation-content-item-active,
|
||||||
.np-sub-navigation-content-item-icon {
|
.np-sub-navigation-content-item-icon {
|
||||||
color: #2DC3D0 !important;
|
color: #2DC3D0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.np-sub-navigation {
|
.np-sub-navigation {
|
||||||
|
|||||||
@ -0,0 +1,102 @@
|
|||||||
|
{% comment %}This section of code will iterate over all courses in a learning path and average out the completion per course compared to the total of the LP {% endcomment %}
|
||||||
|
{% assign total_progress = 0 %}
|
||||||
|
{% assign completed_progress = 0 %}
|
||||||
|
|
||||||
|
{% for item in learning_path.items %}
|
||||||
|
{% if item.course? %}
|
||||||
|
{% assign total_progress = total_progress | plus: 100 %}
|
||||||
|
|
||||||
|
{% assign completed_progress = completed_progress | plus: item.progress %}
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
|
||||||
|
{% assign total_progress = total_progress | times: 0.01 %}
|
||||||
|
{% assign calculated_progress = completed_progress | divided_by: total_progress %}
|
||||||
|
|
||||||
|
<div class="np-card np-no-horizontal-padding">
|
||||||
|
<div class="np-card-container">
|
||||||
|
<div class="np-learning-path">
|
||||||
|
<img
|
||||||
|
alt="{{ learning_path.name }}"
|
||||||
|
class="np-card-image np-learning-path-image"
|
||||||
|
src="{{ learning_path.image_url }}"
|
||||||
|
/>
|
||||||
|
<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">
|
||||||
|
{% comment %}{% t shared.progress, count: learning_path.progress %}{% endcomment %}
|
||||||
|
{% if calculated_progress < 1 %}
|
||||||
|
Not Started
|
||||||
|
{% else %}
|
||||||
|
{{calculated_progress | ceil }}% Completed
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="np-hidden-mobile np-card-progress-bar-container">
|
||||||
|
<div
|
||||||
|
style="width: {{ calculated_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="np-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 class="np-card-stack">
|
||||||
|
<div class="np-card-stack-level-1"></div>
|
||||||
|
<div class="np-card-stack-level-2"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
@media screen and (min-width: 768px) {
|
||||||
|
.np-learning-paths .np-learning-path-image {
|
||||||
|
min-height: unset;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
.np-learning-path-image {
|
||||||
|
min-width: 33%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,60 @@
|
|||||||
|
{% if learning_path.enrolled? and course.unlocked? %}
|
||||||
|
<div class="np-learning-path-outline-bar np-hidden-mobile"></div>
|
||||||
|
<a
|
||||||
|
class="np-learning-path-outline-item np-card-container"
|
||||||
|
href="{% route learning_path_course, learning_path_id: learning_path.id, id: course.id %}"
|
||||||
|
>
|
||||||
|
<div class="np-card-content np-card-padding">
|
||||||
|
<img
|
||||||
|
src="{{ item.image }}"
|
||||||
|
alt="{{ course.name }}"
|
||||||
|
class="np-learning-path-outline-course-image"
|
||||||
|
>
|
||||||
|
<div class="np-learning-path-outline-content">
|
||||||
|
<div class="np-learning-path-outline-name np-top-title">
|
||||||
|
{{ course.name }}
|
||||||
|
</div>
|
||||||
|
{% if course.instructors %}
|
||||||
|
<div class="np-learning-path-outline-caption">
|
||||||
|
{{ course.instructors }}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
<div class="np-learning-path-outline-progress
|
||||||
|
{% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
|
||||||
|
">
|
||||||
|
{% t shared.progress, count: course.progress %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<i class="fas fa-chevron-right np-learning-path-outline-icon"></i>
|
||||||
|
{% comment %}
|
||||||
|
{% if course.optional? %}
|
||||||
|
<div class="np-optional-ribbon">
|
||||||
|
{% t shared.optional %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% endcomment %}
|
||||||
|
</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">
|
||||||
|
<img
|
||||||
|
src="{{ item.image }}"
|
||||||
|
alt="{{ course.name }}"
|
||||||
|
class="np-learning-path-outline-course-image"
|
||||||
|
>
|
||||||
|
<div class="np-learning-path-outline-content">
|
||||||
|
<div class="np-learning-path-outline-name np-top-title">
|
||||||
|
{{ course.name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% comment %}
|
||||||
|
{% if course.optional? %}
|
||||||
|
<div class="np-optional-ribbon">
|
||||||
|
{% t shared.optional %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% endcomment %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
@ -0,0 +1,57 @@
|
|||||||
|
{% 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-learning-path-outline-caption">{{ training_session.instructors }}</div>
|
||||||
|
<div class="np-events-content-time np-learning-path-outline-time np-button-color">
|
||||||
|
{{ training_session.time }} {{ training_session.time_zone }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<i class="fas fa-chevron-right np-learning-path-outline-icon"></i>
|
||||||
|
{% comment %}
|
||||||
|
{% if training_session.optional? %}
|
||||||
|
<div class="np-optional-ribbon">
|
||||||
|
{% t shared.optional %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% endcomment %}
|
||||||
|
</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 class="np-learning-path-outline-caption">{{ training_session.caption }}</div>
|
||||||
|
</div>
|
||||||
|
{% comment %}
|
||||||
|
{% if training_session.optional? %}
|
||||||
|
<div class="np-optional-ribbon">
|
||||||
|
{% t shared.optional %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
{% endcomment %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
@ -0,0 +1,28 @@
|
|||||||
|
<nav class="np-sub-navigation">
|
||||||
|
<div class="np-sub-navigation-content">
|
||||||
|
{% for link in navigations.sub_navigation %}
|
||||||
|
<div class="np-sub-navigation-content-item {{ link.active_class }}">
|
||||||
|
<a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
|
||||||
|
<i class="{{ link.icon }} np-button-color np-sub-navigation-content-item-icon"></i>
|
||||||
|
{% if link.label == 'Dashboard' %}
|
||||||
|
My Dashboard
|
||||||
|
{% elsif link.label == 'Catalog' %}
|
||||||
|
Courses Library
|
||||||
|
{% elsif link.label == 'Events' %}
|
||||||
|
Live Training Webinars
|
||||||
|
{% else %}
|
||||||
|
{{ link.label }}
|
||||||
|
{% endif %}
|
||||||
|
</a>
|
||||||
|
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
<div class="np-sub-navigation-content-item">
|
||||||
|
<a class="np-sub-navigation-content-item-link" href="https://support.hackerrank.com">
|
||||||
|
<i style="color: #bac4ca;" class="far fa-book-reader np-sub-navigation-content-item-icon"></i>
|
||||||
|
Knowledge Base
|
||||||
|
</a>
|
||||||
|
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
@ -0,0 +1,24 @@
|
|||||||
|
<div class="np-card-spacing-large">
|
||||||
|
{% include "training_session_date" %}
|
||||||
|
|
||||||
|
<div class="np-training-session-time">
|
||||||
|
<i class="fal fa-clock np-button-color np-training-session-icon"></i>
|
||||||
|
{{ training_session.time_period }} {{ training_session.time_zone }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% if training_session.location %}
|
||||||
|
<div class="np-training-session-location">
|
||||||
|
<i class="fal fa-map-marker-alt np-button-color np-training-session-icon"></i>
|
||||||
|
{% comment %} {{ training_session.location }} {% endcomment %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% if training_session.session_url %}
|
||||||
|
<div class="np-training-session-location">
|
||||||
|
{% comment %} <i class="fal fa-map-marker-alt np-button-color np-training-session-icon"></i>
|
||||||
|
<a href="{{ training_session.session_url }}" class="np-button-color" target="_blank" >
|
||||||
|
{{ training_session.session_url }} {% endcomment %}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
@ -0,0 +1,66 @@
|
|||||||
|
<main class="np-box-container np-open-access">
|
||||||
|
<div class="np-box">
|
||||||
|
{% include "header_minimal" %}
|
||||||
|
<div class="np-box-content-container">
|
||||||
|
<form class="np-form np-box-content" action="{{ form.url }}" method="get" novalidate>
|
||||||
|
{% form_authenticity_token %}
|
||||||
|
<div class="np-form-headline">
|
||||||
|
{% t shared.welcome_to_school, school_name: current_school.name %}
|
||||||
|
</div>
|
||||||
|
<div class="np-form-subheadline">
|
||||||
|
{% comment %} {% t .headline, key: current_school.course_vocabulary %} {% endcomment %}
|
||||||
|
To access the HackerRank Academy, simply enter your first name, last name, and work email address below.
|
||||||
|
</div>
|
||||||
|
<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="first_name"
|
||||||
|
id="learner_first_name"
|
||||||
|
value="{{ form.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="last_name"
|
||||||
|
id="learner_last_name"
|
||||||
|
value="{{ form.last_name }}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="np-form-field">
|
||||||
|
<label class="np-input-label" for="learner_email">
|
||||||
|
Work {% t shared.email_address %}
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
class="np-input"
|
||||||
|
type="text"
|
||||||
|
name="email"
|
||||||
|
id="learner_email"
|
||||||
|
value="{{ form.email }}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<input
|
||||||
|
type="submit"
|
||||||
|
name="commit"
|
||||||
|
value="{% t shared.enter %}"
|
||||||
|
class="np-button np-button-big np-form-action"
|
||||||
|
/>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
if (document.querySelector('.np-alert-wrapper > div').textContent.includes('You need to log in or sign up before continuing.')) {
|
||||||
|
document.querySelector('.np-alert').style.display = 'none';
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -0,0 +1,63 @@
|
|||||||
|
{% include "header" %}
|
||||||
|
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||||
|
{% include "sub_navigation" %}
|
||||||
|
<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" %}
|
||||||
|
|
||||||
|
<script>
|
||||||
|
function clickDropdownMenu() {
|
||||||
|
const dropdownMenu = document.getElementsByClassName('dropdown-menu')[0]
|
||||||
|
|
||||||
|
const event = new MouseEvent('click', {
|
||||||
|
view: window,
|
||||||
|
bubbles: true,
|
||||||
|
cancelable: true
|
||||||
|
});
|
||||||
|
|
||||||
|
dropdownMenu.dispatchEvent(event);
|
||||||
|
console.log('clicked')
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
window.addEventListener('DOMContentLoaded', () => {
|
||||||
|
const choices = document.querySelectorAll('.choices__item.choices__item--choice.choices__item--selectable')
|
||||||
|
|
||||||
|
const targetNode = document.getElementsByClassName('choices__list')[2];
|
||||||
|
const config = { attributes: true, childList: true, subtree: true };
|
||||||
|
const callback = (mutationList, observer) => {
|
||||||
|
var updated_choices = document.querySelectorAll('.choices__item.choices__item--choice.choices__item--selectable')
|
||||||
|
for (const mutation of mutationList) {
|
||||||
|
Array.from(updated_choices).forEach((choice) => {
|
||||||
|
choice.addEventListener("mousedown", clickDropdownMenu);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const observer = new MutationObserver(callback);
|
||||||
|
|
||||||
|
Array.from(choices).forEach((choice) => {
|
||||||
|
choice.addEventListener("mousedown", clickDropdownMenu);
|
||||||
|
})
|
||||||
|
observer.observe(targetNode, config);
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
@ -0,0 +1,24 @@
|
|||||||
|
|
||||||
|
{% if course.enrolled? %}
|
||||||
|
<script>
|
||||||
|
window.location.replace('{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}')
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{% else %}
|
||||||
|
<script>
|
||||||
|
|
||||||
|
window.location.replace('{% route course_enrollment, code: course.enrollment_code %}')
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% comment %} {% include "header" %}
|
||||||
|
<main class="np-main np-max-width np-page-container">
|
||||||
|
<div class="np-hidden-mobile" id="course-desktop">
|
||||||
|
{% include "course_desktop_view" %}
|
||||||
|
</div>
|
||||||
|
<div class="np-hidden-desktop" id="course-mobile">
|
||||||
|
{% include "course_mobile_view" %}
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
{% include "footer" %} {% endcomment %}
|
||||||
@ -0,0 +1,47 @@
|
|||||||
|
{% include "header" %}
|
||||||
|
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||||
|
<main class="np-main np-homepage">
|
||||||
|
<div class="np-homepage-hero">
|
||||||
|
<img class="np-homepage-hero-image"
|
||||||
|
src="{{ homepage.artwork_url }}"
|
||||||
|
alt="{{ homepage.headline }}"
|
||||||
|
/>
|
||||||
|
<div class="np-homepage-hero-content">
|
||||||
|
<div class="np-homepage-headline np-header-font-color">
|
||||||
|
{{ homepage.headline }}
|
||||||
|
</div>
|
||||||
|
<div class="np-homepage-subheadline np-header-font-color">
|
||||||
|
{{ homepage.subheadline }}
|
||||||
|
</div>
|
||||||
|
<a class="np-homepage-hero-cta np-button" href="{% route catalog %}">
|
||||||
|
{% t .discover %}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% include "sub_navigation" %}
|
||||||
|
<div class="np-homepage-featured np-max-width">
|
||||||
|
<div class="np-homepage-featured-text">
|
||||||
|
<div class="np-homepage-headline">
|
||||||
|
{{ homepage.featured_courses_headline }}
|
||||||
|
</div>
|
||||||
|
<div class="np-homepage-subheadline">
|
||||||
|
{{ homepage.featured_courses_subheadline }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% if learning_paths.available.any? %}
|
||||||
|
<div class="np-learning-paths-resources">
|
||||||
|
{% for learning_path in learning_paths.available %}
|
||||||
|
{% if learning_path.name == 'HackerRank Screen (Self-Guided Learning Path)' or learning_path.name == 'HackerRank Interview (Self-Guided Learning Path)' %}
|
||||||
|
{% include "cards_learning_path" with learning_path %}
|
||||||
|
{% endif %}
|
||||||
|
{% if learning_path.name == 'HackerRank Company Admin' %}
|
||||||
|
{% include "cards_learning_path" with learning_path %}
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
{% include "footer" %}
|
||||||
@ -0,0 +1,19 @@
|
|||||||
|
{% include "header" %}
|
||||||
|
{% include "sub_navigation" %}
|
||||||
|
<main class="np-main np-training-events np-subpage-container np-max-width">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-xs-12 col-sm-10">
|
||||||
|
<div class="np-resource-title">
|
||||||
|
Live Training Webinars
|
||||||
|
</div>
|
||||||
|
<div class="np-resource-subtitle">
|
||||||
|
View and register for upcoming online webinars
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-xs-12 col-sm-2">
|
||||||
|
{% include "training_events_filter" %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{% include "training_events_index" %}
|
||||||
|
</main>
|
||||||
|
{% include "footer" %}
|
||||||
@ -66,4 +66,4 @@ _Analytics:_
|
|||||||
|
|
||||||
Certs sends out credential name - it should share course/lp name instead of cert name
|
Certs sends out credential name - it should share course/lp name instead of cert name
|
||||||
LinkedIn metrics for who has added the cert to their profile.
|
LinkedIn metrics for who has added the cert to their profile.
|
||||||
TODO: Send Georgina the pricing for OpenSesame.
|
DONE: Send Georgina the pricing for OpenSesame.
|
||||||
|
|||||||
@ -531,3 +531,13 @@ Enrollment:
|
|||||||
* They want to know what resources they have selected.
|
* They want to know what resources they have selected.
|
||||||
* So what is the difference between the adoption and enrollment?
|
* So what is the difference between the adoption and enrollment?
|
||||||
* Travis: Overall enrollment (300k), then down a level of who has entered into a category, and then into an activity.
|
* Travis: Overall enrollment (300k), then down a level of who has entered into a category, and then into an activity.
|
||||||
|
|
||||||
|
## 06/28/2023
|
||||||
|
|
||||||
|
### Just Ece
|
||||||
|
|
||||||
|
* Leadership meeting will happen on a monthly recurring basis at the same time as the first meeting.
|
||||||
|
* She wants us to configure the ops training requirements before end of next week. Allow ops team to configure the training items.
|
||||||
|
* This is for showing items in the help menu.
|
||||||
|
* Ece also wanted an update on the dashboard for analytics. We are not ready for them yet. We don't have an ETA.
|
||||||
|
* No questions from Jagannatha
|
||||||
|
|||||||
82
TS1.html
Normal file
82
TS1.html
Normal file
@ -0,0 +1,82 @@
|
|||||||
|
=
|
||||||
|
<p dir="ltr" id="isPasted" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
In addition to the Getting Started training, Talkspace requires that all prescribers complete a series of annual compliance courses. We are unable to substitute similar courses that you have completed independently of Talkspace.
|
||||||
|
|
||||||
|
</span></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:700;font-style:italic;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
You should complete the courses within 30 days of receiving this email. You will be compensated $110 within 60 days of completing this training.
|
||||||
|
|
||||||
|
</span></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
Important Information:
|
||||||
|
|
||||||
|
</span></p>
|
||||||
|
<ul style="margin-top:0;margin-bottom:0;padding-inline-start:48px;">
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
Best practice is to open the link and bookmark the page for easy access.</span></p>
|
||||||
|
</li>
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
Log into Northpass using the same email address that you use for the Talkspace platform.
|
||||||
|
|
||||||
|
</span></p>
|
||||||
|
</li>
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
Best practice is once you start a course, finish it. Pausing may cause completion issues.
|
||||||
|
|
||||||
|
</span></p>
|
||||||
|
</li>
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
Courses perform best on a computer or laptop. The use of mobile devices is not recommended.
|
||||||
|
|
||||||
|
</span></p>
|
||||||
|
</li>
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
Northpass automatically sends reminder emails to you until the courses are completed.
|
||||||
|
|
||||||
|
</span></p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Selecting the correct course group link:</span></p>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
|
||||||
|
If you are a prescriber licensed in California please make sure you select the “Licensed in CA” link. If you are not licensed in California please select the “Not licensed in CA” link.
|
||||||
|
|
||||||
|
|
||||||
|
</span></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><a href="https://talkspacefountain.northpass.com/g/e2e6a0156c23fd887192149ff089b4c8ca3d8bad" style="text-decoration:none;"><span style="font-size:12pt;font-family:Arial;color:#1155cc;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:underline;-webkit-text-decoration-skip:none;text-decoration-skip-ink:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
|
||||||
|
Licensed in CA
|
||||||
|
|
||||||
|
|
||||||
|
</span></a></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><a href="https://talkspacefountain.northpass.com/g/3547900eab2a276a063cc1fc6999a07c363e69ff" style="text-decoration:none;"><span style="font-size:12pt;font-family:Arial;color:#1155cc;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:underline;-webkit-text-decoration-skip:none;text-decoration-skip-ink:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
NOT Licensed in CA
|
||||||
|
|
||||||
|
</span></a></p>
|
||||||
|
<br><br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">
|
||||||
|
|
||||||
|
Questions about compliance courses and payout should be directed to
|
||||||
|
|
||||||
|
</span><a href="mailto:training@talkpace.com" style="text-decoration:none;"><span style="font-size:12pt;font-family:Arial;color:#1155cc;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:underline;-webkit-text-decoration-skip:none;text-decoration-skip-ink:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">training@talkpace.com</span></a><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"> </span></p>
|
||||||
31
TS2.html
Normal file
31
TS2.html
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
<p dir="ltr" id="isPasted" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">In addition to the Getting Started & Managed Care training, Talkspace requires that all providers complete a series of annual compliance courses. We are unable to substitute similar courses that you have completed independently of Talkspace.</span></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:700;font-style:italic;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">You should complete the courses within 30 days of receiving this email. You will be compensated $110 within 60 days of completing this training.</span></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Important Information:</span></p>
|
||||||
|
<ul style="margin-top:0;margin-bottom:0;padding-inline-start:48px;">
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Best practice is to open the link and bookmark the page for easy access.</span></p>
|
||||||
|
</li>
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Log into Northpass using the same email address that you use for the Talkspace platform.</span></p>
|
||||||
|
</li>
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Best practice is once you start a course, finish it. Pausing may cause completion issues.</span></p>
|
||||||
|
</li>
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Courses perform best on a computer or laptop. The use of mobile devices is not recommended.</span></p>
|
||||||
|
</li>
|
||||||
|
<li dir="ltr" style="list-style-type:disc;font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;">
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Northpass automatically sends reminder emails to you until the courses are completed.</span></p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:700;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Selecting the correct course group link:</span></p>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">If you are a provider licensed in California please make sure you select the “Licensed in CA” link. If you are not licensed in California please select the “Not licensed in CA” link.</span></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><a href="https://talkspacefountain.northpass.com/g/c7735faeee4ebe9b5de23a0501f3f032ddbe9275" style="text-decoration:none;"><span style="font-size:12pt;font-family:Arial;color:#1155cc;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:underline;-webkit-text-decoration-skip:none;text-decoration-skip-ink:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Licensed in CA</span></a></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><a href="https://talkspacefountain.northpass.com/g/0f77755bdc0507be4fc93b1d234f4bf73543ba30" style="text-decoration:none;"><span style="font-size:12pt;font-family:Arial;color:#1155cc;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:underline;-webkit-text-decoration-skip:none;text-decoration-skip-ink:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">NOT Licensed in CA</span></a></p>
|
||||||
|
<br>
|
||||||
|
<p dir="ltr" style="line-height:1.38;margin-top:0pt;margin-bottom:0pt;"><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">Questions about compliance courses and payout should be directed to </span><a href="mailto:training@talkpace.com" style="text-decoration:none;"><span style="font-size:12pt;font-family:Arial;color:#1155cc;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:underline;-webkit-text-decoration-skip:none;text-decoration-skip-ink:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;">training@talkpace.com</span></a><span style="font-size:12pt;font-family:Arial;color:#000000;background-color:transparent;font-weight:400;font-style:normal;font-variant:normal;text-decoration:none;vertical-align:baseline;white-space:pre;white-space:pre-wrap;"> </span></p>
|
||||||
Reference in New Issue
Block a user