Updated Harri Script from Charlie, a bunch of notes and todos for clients.
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,59 @@
|
||||
<div class="row additional-resources">
|
||||
<a class="col-sm-12 col-md-4 additional-resource" href="https://terminus.com/blog/">
|
||||
<div class="additional-resource-container">
|
||||
<img class="resource-image" src="https://s3.amazonaws.com/static.northpass.com/Terminus/LMS-TERMINUS-blog-1200x768.jpg" alt="">
|
||||
<div class="resource-title">Visit the Terminus Blog</div>
|
||||
<div class="resource-subtitle">Hear the latest news and insights from the go-to-market experts</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="col-sm-12 col-md-4 additional-resource" href="https://terminus.com/terminus-rock-stars/">
|
||||
<div class="additional-resource-container">
|
||||
<img class="resource-image" src="https://s3.amazonaws.com/static.northpass.com/Terminus/LMS-TERMINUS-rockstars-1200x768.jpg" alt="">
|
||||
<div class="resource-title">Visit the Terminus Rockstars</div>
|
||||
<div class="resource-subtitle">Lorem ipsum</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="col-sm-12 col-md-4 additional-resource" href="https://support.terminus.com/hc/en-us">
|
||||
<div class="additional-resource-container">
|
||||
<img class="resource-image" src="https://s3.amazonaws.com/static.northpass.com/Terminus/LMS-TERMINUS-knowledge-base-1200x768.jpg" alt="">
|
||||
<div class="resource-title">Visit the Knowledge Base</div>
|
||||
<div class="resource-subtitle">Hear the latest news and insights from the go-to-market experts</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.additional-resources * {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.additional-resource {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.additional-resource-container {
|
||||
background-color: #025589;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.resource-image {
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
border-top-right-radius: 10px;
|
||||
border-top-left-radius: 10px;
|
||||
}
|
||||
|
||||
.resource-title, .resource-subtitle {
|
||||
color: #fff;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.resource-title {
|
||||
font-weight: 600;
|
||||
font-size: 20px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,52 @@
|
||||
{% assign activities_count = 0 %}
|
||||
{% for course_section in course.sections %}
|
||||
{% for course_activity in course_section.activities %}
|
||||
{% assign activities_count = activities_count | plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
<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="np-card-content-footer">
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
<div class="np-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ course.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
</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="course-button-container">
|
||||
<a class="np-button np-button-wide" href="{{ course_path }}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
<span>
|
||||
{{ activities_count }} {% if activities_count == 1 %}Activity{% else %}Activities{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,19 @@
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
<img
|
||||
class="np-card-image"
|
||||
src="{{ image_url }}"
|
||||
>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ school_name }}
|
||||
</h3>
|
||||
<div class="np-card-content-footer">
|
||||
<a class="cards-school-button" href="{{ school_url }}">
|
||||
Start Path
|
||||
<i class="arrow-in-button far fa-long-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,166 @@
|
||||
<header class="np-header np-header-color">
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% comment %} {% 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 %} {% endcomment %}
|
||||
</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 %}
|
||||
|
||||
{% comment %}
|
||||
{% 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 %} {% endcomment %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% comment %}
|
||||
<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> {% endcomment %}
|
||||
|
||||
{% include "messages" %}
|
||||
@ -0,0 +1,40 @@
|
||||
<div class="row popular-topics">
|
||||
<div class="col-xs-12 col-sm-6 col-md-3 popular-topic">
|
||||
<a href="">
|
||||
Certifications
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-3 popular-topic">
|
||||
<a href="">
|
||||
Account Based Marketing Strategy
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-3 popular-topic">
|
||||
<a href="">
|
||||
Platform Training
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-3 popular-topic">
|
||||
<a href="">
|
||||
ABM Playbooks
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.popular-topics a {
|
||||
padding: 0 10px;
|
||||
text-decoration: none;
|
||||
color: #5087c7;
|
||||
font-weight: 500;
|
||||
border: 2px solid #bac4ca;
|
||||
border-radius: 10px;
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,96 @@
|
||||
<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>
|
||||
{% comment %} <a class="np-homepage-hero-cta np-button" href="{% route catalog %}">
|
||||
DISCOVER CATALOG
|
||||
</a> {% endcomment %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-homepage-featured np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
A Curated Learning Experience
|
||||
</div>
|
||||
<div class="np-homepage-subheadline" style="font-weight:300">
|
||||
Terminus Academy is more than just an e-learning platform. We've designed curated learning experiences for our unique audiences to help you build, operate, and measure go-to-market strategies at scale, and allow you to level up your expertise at your own pace.
|
||||
<br><br>
|
||||
To get started in the Academy, please choose the appropriate sign in option below.
|
||||
</div>
|
||||
</div>
|
||||
{% capture login_path %}{% route login %}{% endcapture %}
|
||||
<div class="np-homepage-featured-courses row">
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{%
|
||||
include "cards_school",
|
||||
image_url: "https://s3.amazonaws.com/static.northpass.com/Terminus/Customer+Login+Image.jpg",
|
||||
school_name: "Customer Login",
|
||||
school_url: "https://cherrill-hartman-s-school-8121.northpass.com/learners/sign_in"
|
||||
%}
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{%
|
||||
include "cards_school",
|
||||
image_url: "https://s3.amazonaws.com/static.northpass.com/Terminus/Employee+Login+Image.jpg",
|
||||
school_name: "Employee Login",
|
||||
school_url: login_path
|
||||
%}
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{%
|
||||
include "cards_school",
|
||||
image_url: "https://s3.amazonaws.com/static.northpass.com/Terminus/Partner+Login+Image.jpg",
|
||||
school_name: "Partners Login",
|
||||
school_url: "https://cherrill-hartman-s-school.northpass.com/learners/sign_in"
|
||||
%}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<style>
|
||||
.np-sub-navigation {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.np-card-image {
|
||||
height: 250px;
|
||||
object-fit: cover;
|
||||
object-position: 25% 25%;
|
||||
}
|
||||
|
||||
.arrow-in-button {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.cards-school-button {
|
||||
color: #1b3e4f;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.np-homepage-featured .np-homepage-headline,
|
||||
.np-homepage-featured .np-homepage-subheadline {
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.np-homepage-featured .np-homepage-subheadline {
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.np-homepage-featured .np-homepage-headline {
|
||||
font-size: 3rem;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,34 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
<div class="np-homepage-hero">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Terminus/terminus-LMS-learn-without-limits+Catalog+Header.jpg"
|
||||
/>
|
||||
</div>
|
||||
{% 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" %}
|
||||
|
||||
<style>
|
||||
.np-sub-navigation {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,40 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
|
||||
<div class="np-homepage-hero">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Terminus/terminus-LMS-academy-3+Dashboard+Header.jpg"
|
||||
/>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div class="row np-flex-center">
|
||||
<div class="col-xs-12 col-sm-8">
|
||||
{% if features.learning_paths? %}
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t shared.learning_paths %}
|
||||
</div>
|
||||
{% include "learning_paths_index", items: learning_paths.enrolled %}
|
||||
{% endif %}
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t shared.course_vocabulary.plural, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
{% include "courses_index", class: "col-xs-12 col-sm-6 np-stretch-content" %}
|
||||
</div>
|
||||
{% if features.training_events? %}
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-4">
|
||||
<div class="np-dashboard-resources-title">
|
||||
UPCOMING EVENTS
|
||||
</div>
|
||||
{% include "training_events_dashboard" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-sub-navigation {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,143 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-homepage-hero">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="https://s3.amazonaws.com/static.northpass.com/Terminus/terminus-LMS-academy-3+Homepage+Header.jpg"
|
||||
/>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div class="row np-flex-center">
|
||||
<div class="col-xs-12 col-sm-8">
|
||||
<div class="np-dashboard-resources-title">
|
||||
FEATURED COURSES
|
||||
</div>
|
||||
{% if courses.featured.any? %}
|
||||
<div class="np-homepage-featured-courses row">
|
||||
{% for course in courses.featured %}
|
||||
<div class="col-xs-12 np-stretch-content">
|
||||
{% include "cards_featured_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>
|
||||
{% if features.training_events? %}
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-4">
|
||||
<div class="np-dashboard-resources-title">
|
||||
UPCOMING EVENTS
|
||||
</div>
|
||||
{% include "training_events_dashboard" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="col-xs-12">
|
||||
<div class="np-dashboard-resources-title">
|
||||
POPULAR TOPICS
|
||||
</div>
|
||||
{% include 'popular_topics' %}
|
||||
</div>
|
||||
<div class="col-xs-12">
|
||||
<div class="np-dashboard-resources-title" style="margin-top: 20px;">
|
||||
ADDITIONAL RESOURCES
|
||||
</div>
|
||||
{% include 'additional_resources' %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% else %}
|
||||
{% include 'public_homepage' %}
|
||||
{% endif %}
|
||||
{% include "footer" %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<style>
|
||||
.np-sub-navigation {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-card-content {
|
||||
background: #fff;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 10px;
|
||||
border-bottom-left-radius: 10px;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-card {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-card-image {
|
||||
object-fit: cover;
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-card-container {
|
||||
flex-direction: row;
|
||||
min-height: 260px;
|
||||
box-shadow: none;
|
||||
border-radius: 10px;
|
||||
border: 2px solid #bac4ca;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-card-content-title {
|
||||
color: #5087c7;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-card-content-footer {
|
||||
flex-direction: column;
|
||||
align-items: normal;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-button {
|
||||
width: 40%;
|
||||
margin-right: 10px;
|
||||
background-color: #feac1a;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.course-button-container {
|
||||
margin-top: 15px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.course-button-container > span {
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.np-homepage-featured-courses .np-card-image {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-card-content {
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.np-homepage-featured-courses .np-card-image {
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
{% endif %}
|
||||
@ -0,0 +1,81 @@
|
||||
{% assign course_ribbon = course.ribbon | downcase %}
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
<div class="card__image" style="background-image: url({{ course.image_url }})">
|
||||
{% unless course.properties.course_image == "NULL" or course.properties.course_image == "" %}
|
||||
<img class="course-img-static" src="{{course.properties.course_image}}" />
|
||||
{% endunless %}
|
||||
{% if course.ribbon and course.ribbon.size > 0 %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
{% if course.instructor_names and course.instructor_names.size > 0 %}
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.instructor_names }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if course.short_description and course.short_description.size > 0 %}
|
||||
<div class="np-card-content-description">
|
||||
{{ course.short_description | split: " --- " | last }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-card-content-footer">
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
|
||||
{% if course_ribbon == "hochladen" or course_ribbon == "upload" %}
|
||||
<a class="np-button np-button-wide" href="{{ course_path }}">
|
||||
<span data-lang="DE">Hochladen</span>
|
||||
<span data-lang="EN">Upload</span>
|
||||
</a>
|
||||
{% else %}
|
||||
<a class="np-button np-button-wide" href="{{ course_path }}">
|
||||
<span data-lang="DE">{% t shared.view %}</span>
|
||||
<span data-lang="EN">View</span>
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
|
||||
{% if course.enrolled? %}
|
||||
{% unless course_ribbon == "demnächst" or course.name == "Neue Lerninhalte" or course_ribbon == "coming soon" or course_ribbon == "New learning content" %}
|
||||
{% if course.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% if course.completed? %}
|
||||
<span data-lang="DE">Abgeschlossen</span>
|
||||
<span data-lang="EN">Completed</span>
|
||||
{% elsif course.started? == false %}
|
||||
<span data-lang="DE">0% abgeschlossen</span>
|
||||
<span data-lang="EN">0% completed</span>
|
||||
{% else %}
|
||||
<span data-lang="DE">{% t shared.progress, count: course.progress %}</span>
|
||||
<span data-lang="EN">{{course.progress}}% completed</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
|
||||
.card__image {
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.course-img-static {
|
||||
max-width: 100%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,89 @@
|
||||
{% assign learning_path_lang = "DE" %}
|
||||
|
||||
{% for cat in learning_path.categories %}
|
||||
{% if cat.name == "English" %}
|
||||
{% assign learning_path_lang = "EN" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
<div class="np-card np-no-horizontal-padding card-learning-path" data-lang="{{learning_path_lang}}">
|
||||
<div class="np-card-container">
|
||||
<div class="np-learning-path">
|
||||
<div class="image-wrapper">
|
||||
<img
|
||||
alt="{{ learning_path.name }}"
|
||||
class="np-card-image np-learning-path-image"
|
||||
src="{{ learning_path.image_url }}"
|
||||
/>
|
||||
<div class="np-card-ribbon np-hidden-mobile">
|
||||
<i class="fa fa-book-open" aria-hidden="true"></i>
|
||||
<span data-lang="DE">{{ learning_path.items.count }} Inhalte</span>
|
||||
<span data-lang="EN">{{ learning_path.items.count }} Items</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-card-text-wrapper">
|
||||
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
|
||||
{% include "learning_path_description" %}
|
||||
|
||||
{% if learning_path.has_instructors? %}
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ learning_path.instructor_names }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-card-ribbon np-hidden-desktop">
|
||||
<i class="fa fa-book-open" aria-hidden="true"></i>
|
||||
<span data-lang="DE">{{ learning_path.items.count }} Inhalte</span>
|
||||
<span data-lang="EN">{{ learning_path.items.count }} Items</span>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer">
|
||||
<a class="np-button"
|
||||
{% if learning_path.enrolled? %}
|
||||
href="{% route learning_path, id: learning_path.id %}"
|
||||
{% else %}
|
||||
href="{% route learning_path_enrollment, code: learning_path.enrollment_code %}"
|
||||
{% endif %}
|
||||
>
|
||||
<span data-lang="DE">Weiter</span>
|
||||
<span data-lang="EN">View</span>
|
||||
</a>
|
||||
{% if learning_path.enrolled? %}
|
||||
<div class="np-card-content-progress
|
||||
np-button-color">
|
||||
<span data-lang="DE">
|
||||
{% if learning_path.completed? %}
|
||||
Abgeschlossen
|
||||
{% elsif learning_path.started? == false %}
|
||||
0% abgeschlossen
|
||||
{% else %}
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if learning_path.completed? %}
|
||||
Completed
|
||||
{% elsif learning_path.started? == false %}
|
||||
0% completed
|
||||
{% else %}
|
||||
{{learning_path.progress}}% cmopleted
|
||||
{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
</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,61 @@
|
||||
<div class="np-card card--training-event {{ card_classes }}">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ training_event.title }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle">
|
||||
{% case training_event.event_type %}
|
||||
{% when "online" %}
|
||||
<span data-lang="DE">{% t shared.event_types, key: training_event.event_type %}</span>
|
||||
<span data-lang="EN">Online Event</span>
|
||||
{% when "in_person" %}
|
||||
<span data-lang="DE">{% t shared.event_types, key: training_event.event_type %}</span>
|
||||
<span data-lang="EN">In-Person Event</span>
|
||||
{% endcase %}
|
||||
</div>
|
||||
{% if training_event.description and training_event.description.size > 0 %}
|
||||
<div class="np-card-content-description">
|
||||
|
||||
{{ training_event.description | strip }}
|
||||
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-card-training-session-date">
|
||||
|
||||
{% comment %} Fallback to the first session {% endcomment %}
|
||||
{% assign session_to_display = training_event.sessions | first %}
|
||||
{% comment %} Check for an enrolled session and preferrably display that {% endcomment %}
|
||||
{% assign enrolled_sessions = training_event.sessions | where: "registered?", true %}
|
||||
{% if enrolled_sessions and enrolled_sessions.size > 0 %}
|
||||
{% assign session_to_display = enrolled_sessions | first %}
|
||||
{% endif %}
|
||||
|
||||
{% include "training_session_date", training_session: session_to_display %}
|
||||
{% if training_event.sessions and training_event.sessions.size > 1 %}
|
||||
<div class="session-date__other-info-container">
|
||||
<div class="session-date__other-info-wrapper">
|
||||
<i class="np-card-training-sessions-icon far fa-calendar-star" aria-hidden="true"></i>
|
||||
<span class="np-card-training-sessions-label">
|
||||
{{ training_event.sessions.size | minus: 1 }}
|
||||
{% if training_event.sessions.size == 2 %}
|
||||
Other Session
|
||||
{% else %}
|
||||
Other Sessions
|
||||
{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-card-content-footer">
|
||||
<a
|
||||
class="np-button np-button-wide"
|
||||
href="{% route training_session, id: session_to_display.id %}"
|
||||
>
|
||||
{% t shared.view %} Event
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,4 @@
|
||||
<span class="np-course-outline-content-activity-title">
|
||||
{{ activity.title }}
|
||||
</span>
|
||||
|
||||
@ -0,0 +1,9 @@
|
||||
<a
|
||||
href="{% route activity_viewer,
|
||||
id: activity.id,
|
||||
course_id: params.course_id,
|
||||
learning_path_id: params.learning_path_id
|
||||
%}" class="{{ activity_classes }}"
|
||||
>
|
||||
{{ activity.title }}
|
||||
</a>
|
||||
@ -0,0 +1,50 @@
|
||||
{% if course.learner_can_retake? %}
|
||||
<form action="{% route course_retake, id: course.id %}" method="POST">
|
||||
{% form_authenticity_token %}
|
||||
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
|
||||
<span data-lang="DE">Training wiederholen</span>
|
||||
<span data-lang="EN">Retake Course</span>
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button np-button-big {% if course.ribbon == 'Demnächst' or course.ribbon == 'Coming soon' %}disabled{% endif %}"
|
||||
{% unless course.ribbon == 'Demnächst' or course.ribbon == 'Coming soon' %}
|
||||
{% if course.enrolled? %}
|
||||
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
{% endunless %}
|
||||
>
|
||||
{% assign course_ribbon = course.ribbon | downcase %}
|
||||
{% if course_ribbon == "hochladen" or course_ribbon == "upload" %}
|
||||
<span data-lang="DE">Hochladen</span>
|
||||
<span data-lang="EN">Upload</span>
|
||||
{% else %}
|
||||
<span data-lang="DE">
|
||||
{% if course.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif course.started? == false %}
|
||||
{% t shared.course.start, key: current_school.course_vocabulary %}
|
||||
{% elsif course.completed? %}
|
||||
{% t shared.course.view, key: current_school.course_vocabulary %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if course.enrolled? == false %}
|
||||
Enroll
|
||||
{% elsif course.started? == false %}
|
||||
Start
|
||||
{% elsif course.completed? %}
|
||||
Review
|
||||
{% else %}
|
||||
Continue
|
||||
{% endif %}
|
||||
</span>
|
||||
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
@ -0,0 +1,7 @@
|
||||
<h3 class="np-card-heading">
|
||||
<span data-lang="DE">Über diesen Kurs</span>
|
||||
<span data-lang="EN">About this Course</span>
|
||||
</h3>
|
||||
<div class="np-card-text">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
@ -0,0 +1,26 @@
|
||||
<h3 class="np-card-heading">
|
||||
{% t .header %}
|
||||
</h3>
|
||||
{% for event in course.events %}
|
||||
<div class="np-course-events-content-item">
|
||||
<div class="np-course-events-content-date">
|
||||
<div class="np-course-events-content-month">
|
||||
{{ event.sessions.first.abbreviated_month }}
|
||||
</div>
|
||||
<div class="np-course-events-content-day">
|
||||
{{ event.sessions.first.day }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-course-events-content-details">
|
||||
<div class="np-course-events-content-name">
|
||||
{{ event.title }}
|
||||
</div>
|
||||
<div class="np-course-events-content-type np-text-light">
|
||||
{% t shared.event_types, key: event.event_type %}
|
||||
</div>
|
||||
<div class="np-course-events-content-time">
|
||||
{{ event.sessions.first.time_period | replace: "AM", "am" | replace: "PM", "pm" | replace: "-", "–" }} {{ event.sessions.first.time_zone }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
@ -0,0 +1,6 @@
|
||||
<div class="np-top-title">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div>
|
||||
{% comment %} {% include "course_cta_button" %} {% endcomment %}
|
||||
</div>
|
||||
@ -0,0 +1,26 @@
|
||||
<h3 class="np-card-heading">
|
||||
Instructors
|
||||
</h3>
|
||||
<div class="instructors-list__container">
|
||||
{% for instructor in course.instructors %}
|
||||
<div class="np-content-instructors-content-item">
|
||||
<img
|
||||
src="{{ instructor.avatar_url }}"
|
||||
class="np-content-instructors-content-image"
|
||||
alt="{{ instructor.name }}"
|
||||
/>
|
||||
<div class="np-content-instructors-content-description">
|
||||
<div class="np-content-instructors-content-name">
|
||||
{{ instructor.name }}
|
||||
</div>
|
||||
|
||||
{% if instructor.title and instructor.title.size > 0 %}
|
||||
<div class="np-content-instructors-content-info">
|
||||
{{ instructor.title }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
@ -0,0 +1,34 @@
|
||||
<div class="np-course-outline np-card-content-divider">
|
||||
<h3 class="np-card-heading">
|
||||
<span data-lang="DE">Inhalt</span>
|
||||
<span data-lang="EN">Content</span>
|
||||
</h3>
|
||||
<div class="np-course-outline-content">
|
||||
<ol class="np-course-outline-content-section">
|
||||
{% for section in course.sections %}
|
||||
<li class="np-course-outline-content-section-list">
|
||||
<div class="np-course-outline-content-section-name">
|
||||
{{ section.name }}
|
||||
{% assign section_completed = true %}
|
||||
{% for activity in section.activities %}
|
||||
{% unless activity.completed? %}
|
||||
{% assign section_completed = false %}
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
|
||||
{% if section_completed %}
|
||||
<span class="section-status-icon"><i class="fas fa-check-circle"></i></span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.section-status-icon {
|
||||
margin-left:8px;
|
||||
color:#7625f7;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,25 @@
|
||||
<div class="np-top-cta">
|
||||
<div class="np-hidden-mobile">
|
||||
{% include "course_cta_button" %}
|
||||
</div>
|
||||
<div class="np-top-cta-progress-content">
|
||||
<div class="np-top-cta-progress-title np-text-title">
|
||||
<span data-lang="DE">Lernfortschritt</span>
|
||||
<span data-lang="EN">Progress</span>
|
||||
</div>
|
||||
<div class="np-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ course.progress }}%"
|
||||
class="np-progress-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-top-cta-progress-text">
|
||||
<span data-lang="DE">{% t shared.progress, count: course.progress %}</span>
|
||||
<span data-lang="EN">{{course.progress}}% complete</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-hidden-desktop">
|
||||
{% include "course_cta_button" %}
|
||||
</div>
|
||||
@ -0,0 +1,49 @@
|
||||
<div class="np-course-version-outdated-popup np-popup">
|
||||
<div class="np-popup-positioner">
|
||||
<i
|
||||
class="np-course-version-outdated-popup-trigger fas fa-exclamation-circle"
|
||||
data-toggle-class-on-target="np-popup-tooltip--visible"
|
||||
data-toggle-target-parent=".np-popup-tooltip"
|
||||
data-toggle-outside
|
||||
aria-label="New Version Available"
|
||||
tabindex="0"
|
||||
></i>
|
||||
<div
|
||||
class="np-popup-tooltip"
|
||||
role="tooltip"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<header class="np-popup-header">
|
||||
<i class="np-popup-header-icon fas fa-exclamation-circle" aria-hidden="true"></i>
|
||||
<h3 class="np-popup-header-title">
|
||||
{% t .title %}
|
||||
</h3>
|
||||
</header>
|
||||
<div class="np-popup-body">
|
||||
<h4>
|
||||
{% capture header_text %}
|
||||
{% t .body.header %}
|
||||
{% endcapture %}
|
||||
{{ header_text | replace: "course", "course" }}
|
||||
|
||||
</h4>
|
||||
<p>
|
||||
{% capture body_text %}
|
||||
{% t .body.content %}
|
||||
{% endcapture %}
|
||||
{{ body_text | replace: "course", "course" }}
|
||||
</p>
|
||||
<a
|
||||
class="np-popup-body-button"
|
||||
href="{{ path }}"
|
||||
>
|
||||
{% capture button_text %}
|
||||
{% t .body.button %}
|
||||
{% endcapture %}
|
||||
{{ button_text | replace: "Course", "Course" }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="np-popup-tail"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,183 @@
|
||||
{% if courses.in_catalog.any? %}
|
||||
<div class="category-header">
|
||||
{% include "filter_by_progress" %}
|
||||
</div>
|
||||
<div class="np-catalog-courses row row-with-thumbnails">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% assign is_on_the_job_video = false %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.id == "40b1f3d7-6faf-4d54-a74f-92d330831728" or category.name contains "On-The-Job" %}
|
||||
{% assign is_on_the_job_video = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% unless is_on_the_job_video %}
|
||||
{% assign progress_status_en = "jetzt-starten" %}
|
||||
{% assign progress_status_de = "not-started" %}
|
||||
|
||||
{% if course.progress > 0 and course.progress < 100 %}
|
||||
{% assign progress_status_de = "angefangen" %}
|
||||
{% assign progress_status_en = "in-progress" %}
|
||||
{% elsif course.progress == 100 %}
|
||||
{% assign progress_status_de = "abgeschlossen" %}
|
||||
{% assign progress_status_en = "completed" %}
|
||||
{% endif %}
|
||||
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content course-column {{progress_status_de}} {{progress_status_en}}" data-lang="{{course.properties.course_language}}">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% assign message = message | replace: "Courses", "Courses" %}
|
||||
{% include "courses_zero_state", message: message, filters_applied: false %}
|
||||
{% endif %}
|
||||
|
||||
<style>
|
||||
.np-progress-filter-wrapper {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.category-header {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
margin-bottom:16px;
|
||||
margin-top:24px;
|
||||
}
|
||||
|
||||
.course-img-static {
|
||||
transition:opacity 0.1s;
|
||||
}
|
||||
|
||||
.course-img-static:hover {
|
||||
opacity:0;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.np-catalog-courses {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
</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 selectedFilter = $(selectedItem).text().replace(" ", "-").toLowerCase();
|
||||
|
||||
if (selectedFilter == "0%-abgeschlossen") {
|
||||
selectedFilter = "jetzt-starten"
|
||||
}
|
||||
|
||||
$(".np-catalog-courses").find('.course-column').removeClass('np-hidden')
|
||||
if (selectedFilter != "alle-kurse" && selectedFilter != "all-courses") {
|
||||
$(".np-catalog-courses").find(`.course-column:not(.${selectedFilter})`).addClass('np-hidden')
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,200 @@
|
||||
{% if courses.enrolled and courses.enrolled.any? %}
|
||||
{%- assign all_categories = "" -%}
|
||||
|
||||
{%- for category in categories.enrolled -%}
|
||||
{% comment %} <div class="np-resource-subtitle">Rolle</div> {% endcomment %}
|
||||
{% unless category.id == "087ea56d-888b-4e0f-af1f-68627318c841" or category.id == "9be55234-19c5-4df4-bd1d-03e93f0faf83" or category.id == "6580e10e-eacf-402d-a330-51d202721cce" or category.id == "a63019c7-0a46-40bd-bc1b-935c887a4380" or category.id == "40b1f3d7-6faf-4d54-a74f-92d330831728" %}
|
||||
<div class="category-header">
|
||||
<div class="category-title" style="">
|
||||
{{category.name}}
|
||||
</div>
|
||||
{% assign topic = category.id %}
|
||||
{%
|
||||
include "filter_by_progress",
|
||||
label: "Nach Fortschritt filtern:",
|
||||
default_option: "Alle Kurse",
|
||||
topic: topic,
|
||||
%}
|
||||
</div>
|
||||
<div class="row" data-topic="{{category.id}}">
|
||||
{%- for course in courses.enrolled -%}
|
||||
{% assign all_categories = course.categories | map: "id" %}
|
||||
|
||||
{%- if all_categories contains category.id -%}
|
||||
{% assign course_status = "" %}
|
||||
|
||||
{% if course.started? == false %}
|
||||
{% assign course_status = "jetzt-starten" %}
|
||||
{% elsif course.completed? %}
|
||||
{% assign course_status = "abgeschlossen" %}
|
||||
{% elsif course.started? %}
|
||||
{% assign course_status = "angefangen" %}
|
||||
{% endif %}
|
||||
<div class="cards-course-wrapper col-xs-12 col-sm-6 col-lg-4 np-stretch-content {{course_status}}">
|
||||
{% include 'cards_course' %}
|
||||
</div>
|
||||
{%- endif -%}
|
||||
{%- endfor -%}
|
||||
</div>
|
||||
{% endunless %}
|
||||
{%- endfor -%}
|
||||
|
||||
{%- comment -%} <div class="blocks-layout">
|
||||
{% for course in courses.enrolled %}
|
||||
{% include "cards_course", course: course, card_classes: card_classes %}
|
||||
{% endfor %}
|
||||
</div> {%- endcomment -%}
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% assign message = message | replace: "Courses", "Courses" %}
|
||||
{% include "courses_zero_state", message: message, filters_applied: false %}
|
||||
{% endif %}
|
||||
|
||||
<style>
|
||||
.np-progress-filter-wrapper {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.category-header {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.category-title {
|
||||
font-size: 18px;
|
||||
line-height: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.category-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.category-title {
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
}
|
||||
</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 = $('.row[data-topic="' + filterGroup + '"]');
|
||||
console.log(filterGroup, selectedFilter, carouselGroup)
|
||||
carouselGroup.find('.cards-course-wrapper').removeClass('np-hidden')
|
||||
if (selectedFilter != "alle-kurse") {
|
||||
carouselGroup.find(`.cards-course-wrapper:not(.${selectedFilter})`).addClass('np-hidden')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,9 @@
|
||||
<div class="np-dashboard-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
<p>{{ message }}</p>
|
||||
{% if filters_applied %}
|
||||
<button class="np-button np-button-wide js-clear-filter-button js-filter-type__all">Clear All Filters</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
<img class="np-zero-state-courses" alt="{{ message }}" />
|
||||
</div>
|
||||
@ -0,0 +1,11 @@
|
||||
<div class="english-banner">
|
||||
<p>
|
||||
Switch your app to German to find all training and materials (some jobs require a certain level of German).
|
||||
</p>
|
||||
</div>
|
||||
<style>
|
||||
.english-banner {
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,147 @@
|
||||
<div class="np-progress-filter-wrapper">
|
||||
<div class="np-progress-filter-label">
|
||||
<span data-lang="DE">Nach Fortschritt filtern:</span>
|
||||
<span data-lang="EN">Filter by progress:</span>
|
||||
</div>
|
||||
<div class="progress-filter filter-select-wrapper select-wrapper np-button" style="border-radius: 8px;" data-lang="DE">
|
||||
<select>
|
||||
<option selected disabled hidden>Alle Kurse</option>
|
||||
<option value="all">Alle Kurse</option>
|
||||
<option value="not-started">0% abgeschlossen</option>
|
||||
<option value="in-progress">Angefangen</option>
|
||||
<option value="completed">Abgeschlossen</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="progress-filter filter-select-wrapper select-wrapper np-button" style="border-radius: 8px;" data-lang="EN">
|
||||
<select>
|
||||
<option selected disabled hidden>All Courses</option>
|
||||
<option value="all">All Courses</option>
|
||||
<option value="not-started">Not Started</option>
|
||||
<option value="in-progress">In progress</option>
|
||||
<option value="completed">Completed</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
body[data-lang='EN'] .progress-filter[data-lang='DE'],
|
||||
body[data-lang='DE'] .progress-filter[data-lang='EN'] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
body[data-lang='EN'] .progress-filter[data-lang='EN'],
|
||||
body[data-lang='DE'] .progress-filter[data-lang='DE'] {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.progress-filter[data-lang='DE'] {display:block;}
|
||||
.progress-filter[data-lang='EN'] {display:none;}
|
||||
|
||||
.np-progress-filter-label {
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
padding-right: 7px;
|
||||
text-transform: none;
|
||||
font-weight:500;
|
||||
font-size:0.812rem;
|
||||
}
|
||||
.np-progress-filter-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 1rem;
|
||||
margin-top:12px;
|
||||
align-items: center;
|
||||
}
|
||||
.filter-select-wrapper {
|
||||
position: relative;
|
||||
padding:0;
|
||||
border: 2px solid rgba(0, 0, 0, 0.5);
|
||||
color: #fff;
|
||||
height:auto;
|
||||
text-transform: none;
|
||||
background: transparent;
|
||||
border-radius:0;
|
||||
font-size:14px;
|
||||
}
|
||||
.filter-select-wrapper:hover {
|
||||
background:transparent;
|
||||
color:#fff;
|
||||
}
|
||||
.select-items {
|
||||
position: absolute;
|
||||
background-color: #E1E2E5;
|
||||
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: #707483;
|
||||
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: 6px 50px 6px 15px;
|
||||
position: relative;
|
||||
color:rgb(0, 0, 0);
|
||||
}
|
||||
.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.5);
|
||||
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: #707483;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.np-progress-filter-wrapper {
|
||||
margin-top:0;
|
||||
font-size:16px;
|
||||
}
|
||||
.select-selected {
|
||||
padding: 9px 66px 9px 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -0,0 +1,81 @@
|
||||
{% comment %}
|
||||
<footer class="np-footer">
|
||||
<div class="np-footer-top">
|
||||
{% if website_footer.show_navigation_links? %}
|
||||
<div class="np-footer-navigation">
|
||||
<ul class="np-footer-navigation-list">
|
||||
{% for website_navigation in navigations.footer_navigations %}
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link np-button-color"
|
||||
href="{{ website_navigation.path }}"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if current_school.logo_url %}
|
||||
<h2 class="np-footer-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-footer-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h2>
|
||||
{% else %}
|
||||
<div class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="np-footer-bottom">
|
||||
<nav class="np-footer-social-links">
|
||||
{% if website_footer.show_social_media_links? %}
|
||||
<ul class="np-footer-social-links-list">
|
||||
{% for social_media_link in website_footer.social_media_links %}
|
||||
<li class="np-footer-social-links-item">
|
||||
<a
|
||||
class="np-footer-social-links-link np-button-color"
|
||||
href="{{ social_media_link.link }}"
|
||||
target="_blank" title="{{ social_media_link.name }}"
|
||||
>
|
||||
<i class="np-footer-social-links-icon
|
||||
np-button-color
|
||||
fab fa-{{ social_media_link.name }}"
|
||||
aria-label="{{ social_media_linke.name }}"
|
||||
></i>
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</nav>
|
||||
|
||||
{% if website_footer.show_customer_service_email? and
|
||||
website_footer.school_customer_service_email
|
||||
%}
|
||||
<div class="np-footer-support">
|
||||
<div class="np-footer-support-item np-footer-support-help">
|
||||
{% t .need_help %}
|
||||
</div>
|
||||
<div class="np-footer-support-item np-footer-support-email">
|
||||
{% t .email %}
|
||||
</div>
|
||||
<a
|
||||
class="np-footer-support-item np-footer-support-link np-button-color"
|
||||
href="mailto:{{ website_footer.school_customer_service_email }}"
|
||||
>
|
||||
{{ website_footer.school_customer_service_email }}
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</footer>
|
||||
{% endcomment %}
|
||||
@ -0,0 +1,8 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="https://unpkg.com/freezeframe@3.0.10/build/css/freezeframe_styles.min.css">
|
||||
<script type="text/javascript" src="https://unpkg.com/freezeframe@3.0.10/build/js/freezeframe.pkgd.min.js"></script>
|
||||
@ -0,0 +1,602 @@
|
||||
{% assign is_in_authenticated_group = false %}
|
||||
|
||||
{% for group in current_person.groups %}
|
||||
{% if group.name == "All Users" or group.id == "6331d115-ea74-418a-99b2-af5c81208fe1" %}
|
||||
{% assign is_in_authenticated_group = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if current_person.email contains "+preview" %}
|
||||
{% assign is_in_authenticated_group = true %}
|
||||
{% endif %}
|
||||
|
||||
{% unless is_in_authenticated_group %}
|
||||
<script>
|
||||
console.log(window.location.pathname)
|
||||
if (window.location.pathname != "/app") {
|
||||
window.location.replace("/app")
|
||||
}
|
||||
</script>
|
||||
{% endunless %}
|
||||
|
||||
<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"
|
||||
>
|
||||
<i class="far fa-bars"></i>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="language-dropdown-wrapper np-hidden-desktop">
|
||||
<div class="header-language-selection">
|
||||
{{current_person.properties.user_language}}
|
||||
</div>
|
||||
<ul class="languages-dropdown">
|
||||
<li data-lang="DE" onclick="changeLanguage(this.getAttribute('data-lang'))">Deutsch</li>
|
||||
<li data-lang="EN" onclick="changeLanguage(this.getAttribute('data-lang'))">English</li>
|
||||
</ul>
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="/app/catalog">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="/app/catalog" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
<li class="np-header-desktop-nav-item">
|
||||
<a href="/app/catalog" class="np-header-desktop-nav-link trainings-link">
|
||||
<span data-lang="DE">Trainings</span>
|
||||
<span data-lang="EN">Trainings</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="np-header-desktop-nav-item">
|
||||
<a href="/app/learning_paths" class="np-header-desktop-nav-link learning-paths-link">
|
||||
<span data-lang="DE">Lernwege</span>
|
||||
<span data-lang="EN">Learning Paths</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="np-header-desktop-nav-item">
|
||||
<a href="/app/zertifikate" class="np-header-desktop-nav-link certs-link">
|
||||
<span data-lang="DE">Auszeichnungen</span>
|
||||
<span data-lang="EN">Awards</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="np-header-desktop-nav-item">
|
||||
<a href="/app/on-the-job" class="np-header-desktop-nav-link videos-link">
|
||||
<span data-lang="DE">On-The-Job Videos</span>
|
||||
<span data-lang="EN">On-The-Job Videos</span>
|
||||
</a>
|
||||
</li>
|
||||
{% for website_navigation in navigations.header_navigations_external %}
|
||||
<li class= "np-header-desktop-nav-item">
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-desktop-nav-link np-header-font-color"
|
||||
target="_blank"
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="language-dropdown-wrapper np-hidden-mobile">
|
||||
<div class="header-language-selection">
|
||||
{{current_person.properties.user_language}}
|
||||
</div>
|
||||
<ul class="languages-dropdown">
|
||||
<li data-lang="DE" onclick="changeLanguage(this.getAttribute('data-lang'))">Deutsch</li>
|
||||
<li data-lang="EN" onclick="changeLanguage(this.getAttribute('data-lang'))">English</li>
|
||||
</ul>
|
||||
</div>
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<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" aria-label="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 %}"
|
||||
>
|
||||
<span data-lang="DE">{% t .sign_out %}</span>
|
||||
<span data-lang="DE">Logout</span>
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
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">
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<a href="/app/catalog" class="np-header-mobile-menu-content-button">Trainings</a>
|
||||
<a href="/app/learning_paths" class="np-header-mobile-menu-content-button">
|
||||
<span data-lang="DE">Lernwege</span>
|
||||
<span data-lang="EN">Learning Paths</span>
|
||||
</a>
|
||||
<a href="/app/zertifikate" class="np-header-mobile-menu-content-button">
|
||||
<span data-lang="DE">Auszeichnungen</span>
|
||||
<span data-lang="EN">Awards</span>
|
||||
</a>
|
||||
<a href="/app/on-the-job" class="np-header-mobile-menu-content-button">On-The-Job Videos</a>
|
||||
<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=""
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search" aria-label="search"></i>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
|
||||
<style>
|
||||
body.mobile-menu-open main.np-main.np-hidden {
|
||||
display: block!important;
|
||||
}
|
||||
|
||||
.np-header {
|
||||
height: auto;
|
||||
padding-top: 12px;
|
||||
transition:transform 0.3s, background-color 0.2s;
|
||||
top:0;
|
||||
}
|
||||
|
||||
.np-header.sticky {
|
||||
position: sticky;
|
||||
background-color:#3e1191;
|
||||
}
|
||||
|
||||
.np-header.sticky-hide {
|
||||
transform: translateY(-100px);
|
||||
}
|
||||
|
||||
.np-header.sticky-show {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
body.mobile-menu-open .np-header {
|
||||
background-color:#3e1191;
|
||||
}
|
||||
|
||||
.np-header-logo {
|
||||
padding: 0.75rem 0;
|
||||
justify-content:flex-start;
|
||||
}
|
||||
|
||||
.np-header-logo-image {
|
||||
height:30px;
|
||||
}
|
||||
|
||||
.np-header .fa-bars {
|
||||
font-size: 28px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.np-header-mobile-menu-nav {
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.np-header-mobile-menu-content {
|
||||
background-color: #3e1191;
|
||||
top:66px;
|
||||
left:unset;
|
||||
bottom:unset;
|
||||
width:50%;
|
||||
padding: 0 0 8px;
|
||||
}
|
||||
|
||||
.np-header-mobile-menu-content .np-header-mobile-menu-content-nav {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.np-header-mobile-menu-content .np-header-mobile-menu-content-button {
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
box-shadow: none;
|
||||
border: 1px solid #fff;
|
||||
height: auto;
|
||||
font-size: 15px;
|
||||
padding: 3px;
|
||||
font-weight: 700;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.np-header-mobile-menu-content .np-header-search-input,
|
||||
.np-header-mobile-menu-content .np-header-search-input:focus {
|
||||
background: transparent;
|
||||
border: 1px solid #fff;
|
||||
color: #fff;
|
||||
padding: 8px 30px 8px 10px;
|
||||
font-size:14px;
|
||||
height:auto;
|
||||
border-radius:4px;
|
||||
}
|
||||
|
||||
.np-header-mobile-menu-content .np-header-search { padding-top:10px; }
|
||||
|
||||
.np-header-mobile-menu-content .np-header-search-icon,
|
||||
.np-header-mobile-menu-content .np-header-search-input:hover + .np-header-search-icon {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
top: 19px;
|
||||
}
|
||||
|
||||
.np-header-mobile-menu-nav-button.np-header-font-color,
|
||||
.np-header-mobile-menu-content-name { color:#fff;}
|
||||
|
||||
@media screen and ( min-width: 48rem ) {
|
||||
.np-header-logo {
|
||||
padding: 1.25rem 0;
|
||||
}
|
||||
}
|
||||
/* --- Navigation --- */
|
||||
.np-header-desktop-nav-list {
|
||||
justify-content: end;
|
||||
margin: 1rem;
|
||||
padding-left: 0;
|
||||
}
|
||||
.np-header-desktop-nav-link {
|
||||
padding: 0.1rem 0.75rem 0.15rem;
|
||||
border: transparent 2px solid;
|
||||
border-radius: 3rem;
|
||||
color:#fff;
|
||||
font-size:18px;
|
||||
margin-right:12px;
|
||||
}
|
||||
.np-header-desktop-nav-item {
|
||||
padding: 0;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.np-header-desktop-nav-link:focus,
|
||||
.np-header-desktop-nav-link:hover {
|
||||
border-color: #7625f7;
|
||||
color:#fff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.np-header-desktop-nav-link.is-active {
|
||||
background-color: #8b78fa;
|
||||
}
|
||||
.np-header-desktop-nav-link.is-active:focus {
|
||||
border-color: #275cb8;
|
||||
}
|
||||
|
||||
.np-header-search-input:hover + .np-header-search-icon {
|
||||
color: #bfe4ff;
|
||||
}
|
||||
|
||||
.np-header-search-input:focus {
|
||||
border-color: #275cb8;
|
||||
outline: none;
|
||||
border-radius: 3rem;
|
||||
padding: 0 1.25rem 0 2.5rem;
|
||||
}
|
||||
|
||||
.np-header-search-input:focus + .np-header-search-icon {
|
||||
color: #304780;
|
||||
}
|
||||
|
||||
.np-header-mobile-menu-content-button.np-danger {
|
||||
border-color: #ff5773;
|
||||
color: #E52242;
|
||||
}
|
||||
|
||||
/* LANGUAGE DROPDOWN */
|
||||
.language-dropdown-wrapper {
|
||||
position:relative;
|
||||
}
|
||||
.header-language-selection {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
padding:20px;
|
||||
font-size:20px;
|
||||
cursor:pointer;
|
||||
color:#fff;
|
||||
align-items:center;
|
||||
position:relative;
|
||||
margin-right:8px;
|
||||
}
|
||||
.header-language-selection:after {
|
||||
content: "\f078";
|
||||
font-family: "Font Awesome 5 Pro";
|
||||
position: absolute;
|
||||
font-size: 14px;
|
||||
top: 50%;
|
||||
right: 4px;
|
||||
color: #fff;
|
||||
transition: transform 0.2s;
|
||||
transform: translateY(-50%) rotate(0deg);
|
||||
}
|
||||
|
||||
.header-language-selection.active:after {
|
||||
transform: translateY(-50%) rotate(180deg);
|
||||
}
|
||||
|
||||
.languages-dropdown {
|
||||
position:absolute;
|
||||
top: 66px;
|
||||
left:50%;
|
||||
transform: translateX(-50%);
|
||||
background-color: #3e1191;
|
||||
color:#fff;
|
||||
margin:0;
|
||||
height:0;
|
||||
opacity:0;
|
||||
min-width:170px;
|
||||
list-style:none;
|
||||
transition: opacity 0.2s;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.languages-dropdown:not(.show) {
|
||||
visibility: hidden;
|
||||
}
|
||||
.languages-dropdown.show {
|
||||
height:auto;
|
||||
opacity:1;
|
||||
padding:12px;
|
||||
}
|
||||
.languages-dropdown li {
|
||||
cursor: pointer;
|
||||
width:100%;
|
||||
padding: 3px;
|
||||
font-size:16px;
|
||||
border-radius:3px;
|
||||
text-align:center;
|
||||
border: 1px solid #fff;
|
||||
margin-bottom:10px;
|
||||
}
|
||||
/* END LANGUAGE DROPDOWN */
|
||||
|
||||
@media (min-width:768px) {
|
||||
.np-header-search-input {
|
||||
opacity: unset;
|
||||
border-radius: 3rem;
|
||||
background-color: #304780;
|
||||
}
|
||||
|
||||
.np-header-search-icon {
|
||||
right: unset;
|
||||
left: 0.75rem;
|
||||
}
|
||||
|
||||
.header-language-selection {
|
||||
margin-right:20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
const currentPath = window.location.pathname;
|
||||
|
||||
if (currentPath == "/app/courses") {
|
||||
$(".trainings-link").addClass("is-active")
|
||||
} else if (currentPath.includes("/app/learning_paths")) {
|
||||
$(".learning-paths-link").addClass("is-active")
|
||||
} else if (currentPath == "/app/zertifikate") {
|
||||
$(".certs-link").addClass("is-active")
|
||||
} else if (currentPath == "/app/on-the-job") {
|
||||
$(".videos-link").addClass("is-active")
|
||||
} else if (currentPath.includes("/app/training_events")) {
|
||||
$(".events-link").addClass("is-active")
|
||||
}
|
||||
|
||||
$("button[data-test='open-mobile-menu']").click(function() {
|
||||
console.log($(this))
|
||||
$("body").addClass("mobile-menu-open")
|
||||
})
|
||||
|
||||
$(".np-header-mobile-menu-nav-button:not([data-test='open-mobile-menu'])").click(function() {
|
||||
$("body").removeClass("mobile-menu-open")
|
||||
})
|
||||
|
||||
window.onscroll = function() {detectScroll()};
|
||||
|
||||
var header = document.querySelector(".np-header");
|
||||
var lastScrollTop = 0;
|
||||
|
||||
function detectScroll() {
|
||||
var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
||||
if (window.pageYOffset > 0) {
|
||||
header.classList.add("sticky");
|
||||
} else {
|
||||
header.classList.remove("sticky");
|
||||
}
|
||||
|
||||
if (window.pageYOffset > 150) {
|
||||
if (scrollTop > lastScrollTop) {
|
||||
header.classList.remove("sticky-show");
|
||||
header.classList.add("sticky-hide");
|
||||
if (!$(".np-header-mobile-menu-content").hasClass("np-hidden")) {
|
||||
$(".np-header-mobile-menu-nav-button.fa-times").click()
|
||||
}
|
||||
|
||||
} else if (scrollTop < lastScrollTop) {
|
||||
header.classList.add("sticky-show");
|
||||
header.classList.remove("sticky-hide");
|
||||
}
|
||||
lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;
|
||||
}
|
||||
}
|
||||
|
||||
// Languages dropdown hover effect
|
||||
$(".header-language-selection").click((e) => {
|
||||
if ($(e.target).hasClass("active")) {
|
||||
$(".languages-dropdown").removeClass('show');
|
||||
$(e.target).removeClass('active');
|
||||
} else {
|
||||
$(".languages-dropdown").addClass('show');
|
||||
$(e.target).addClass('active');
|
||||
}
|
||||
})
|
||||
|
||||
function changeLanguage(lang) {
|
||||
const userPropertyLang = '{{current_person.properties.user_language}}'
|
||||
const localStorageLang = localStorage.getItem('lang', lang)
|
||||
|
||||
console.log(`Selected language: ${lang} | language set in property: ${userPropertyLang} | language in local storage: ${localStorageLang}`)
|
||||
|
||||
// hide dropdown
|
||||
$(".languages-dropdown").removeClass('show');
|
||||
$(".header-language-selection").removeClass("active")
|
||||
|
||||
// if no local storage,
|
||||
if (localStorageLang == null) {
|
||||
localStorage.setItem('lang', lang);
|
||||
}
|
||||
|
||||
if (userPropertyLang != lang) {
|
||||
$(".header-language-selection").text(lang);
|
||||
$("body").attr("data-lang", lang)
|
||||
|
||||
// make workato call here
|
||||
setLanguageWorkflow(lang)
|
||||
} else {
|
||||
$(".header-language-selection").text(lang);
|
||||
$("body").attr("data-lang", lang)
|
||||
}
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
console.log('Property {{current_person.properties.user_language}}')
|
||||
console.log(localStorage.getItem('lang'))
|
||||
const userPropertyLang = '{{current_person.properties.user_language}}'
|
||||
const localStorageLang = localStorage.getItem('lang')
|
||||
|
||||
if (localStorageLang == null) {
|
||||
console.log("no local storage, use property to set lang")
|
||||
$("body").attr("data-lang", userPropertyLang)
|
||||
$(".header-language-selection").text(userPropertyLang );
|
||||
} else {
|
||||
if (localStorageLang == userPropertyLang) {
|
||||
console.log("delete local storage and use property lang")
|
||||
$("body").attr("data-lang", userPropertyLang)
|
||||
$(".header-language-selection").text(userPropertyLang );
|
||||
localStorage.removeItem('lang');
|
||||
} else {
|
||||
console.log("use local storage lang")
|
||||
$("body").attr("data-lang", localStorageLang)
|
||||
$(".header-language-selection").text(localStorageLang );
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function setLanguageWorkflow(lang) {
|
||||
console.log("calling workato workflow")
|
||||
var data = {
|
||||
learner_uuid : '{{current_person.id}}',
|
||||
language : lang
|
||||
};
|
||||
|
||||
const schoolID = '{{current_school.id}}'
|
||||
let workatoEndpoint = ""
|
||||
|
||||
if (schoolID == "d4f9d06b-bbe9-4e0a-85ee-eadc10f17914") {
|
||||
workatoEndpoint = 'https://webhooks.workato.com/webhooks/rest/ccd1cbb2-59bc-4590-852a-a0d217d198b1/user-changes-language'
|
||||
} else if (schoolID == "6e96bbdd-7818-4920-b79c-e46132939929") {
|
||||
workatoEndpoint = 'https://webhooks.workato.com/webhooks/rest/0cb722cd-39ae-4754-9c37-380e6672cdbf/user-changes-language'
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
type : 'POST',
|
||||
url : workatoEndpoint,
|
||||
data: JSON.stringify(data),
|
||||
success:function (data) {
|
||||
console.log(data);
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.log(error)
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
@ -0,0 +1,243 @@
|
||||
{% comment %} Determine if the item should be a link or not {% endcomment %}
|
||||
{% if learning_path.enrolled? and course.unlocked? %}
|
||||
{% assign element_type = "a" %}
|
||||
{% else %}
|
||||
{% assign element_type = "div" %}
|
||||
{% endif %}
|
||||
|
||||
{% assign lp_course_required = 1 %}
|
||||
{% if course.optional? %}
|
||||
{% assign lp_course_required = 0 %}
|
||||
{% endif %}
|
||||
|
||||
<div class="lp-course" data-required="{{lp_course_required}}">
|
||||
<{{ element_type }}
|
||||
class="np-learning-path-outline-item np-card card--horizontal"
|
||||
{% if element_type == "a" %}
|
||||
href="{% route learning_path_course, learning_path_id: learning_path.id, id: course.id %}"
|
||||
{% endif %}
|
||||
>
|
||||
<div class="np-card-container">
|
||||
<div class="card__image">
|
||||
{% assign lp_image_not_cropped = item.image | replace: ',fit:crop/', '/' %}
|
||||
<img src="{{lp_image_not_cropped}}">
|
||||
{% unless course.optional? %}
|
||||
<div class="np-card-ribbon">
|
||||
<span data-lang="DE">Erforderlich</span>
|
||||
<span data-lang="EN">Required</span>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="np-card-ribbon">
|
||||
Optional
|
||||
</div>
|
||||
{% endunless %}
|
||||
</div>
|
||||
<div class="np-card-content np-learning-path-outline-content np-card-padding">
|
||||
<div class="text-wrapper">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
|
||||
<div class="np-hidden-mobile">
|
||||
{% if course.completed? %}
|
||||
<div class="outline-card__icon-container outline-card__icon-complete np-hidden-desktop">
|
||||
<i class="fas fa-check np-learning-path-outline-icon" aria-label="Course Completed"></i>
|
||||
</div>
|
||||
{% elsif element_type == "div" %}
|
||||
<div class="outline-card__icon-container outline-card__icon-locked np-hidden-desktop">
|
||||
<i class="fas fa-lock np-learning-path-outline-icon" aria-label="Course Locked"></i>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="outline-card__icon-container outline-card__icon-link np-hidden-desktop">
|
||||
{% if course.optional? %}
|
||||
{% if course.name == "Servicetraining" or course.name == "Kassentraining" %}
|
||||
<span data-lang="DE">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Fortsetzen
|
||||
{% else %}
|
||||
Anzeigen
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
Review
|
||||
{% endif %}
|
||||
</span>
|
||||
|
||||
{% else %}
|
||||
<span data-lang="DE">Heft öffnen</span>
|
||||
<span data-lang="EN">Open booklet</span>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<span data-lang="DE">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Fortsetzen
|
||||
{% else %}
|
||||
Anzeigen
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
Review
|
||||
{% endif %}
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if course.instructors and course.instructors.size > 0 %}
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.instructors }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-card-content-progress">
|
||||
<span data-lang="DE">
|
||||
{% if course.completed? %}
|
||||
Vollständig
|
||||
{% else %}
|
||||
{{ course.progress }}% Vollständig
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if course.completed? %}
|
||||
Complete
|
||||
{% else %}
|
||||
{{ course.progress }}% complete
|
||||
{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
<div class="np-hidden-desktop">
|
||||
{% if course.completed? %}
|
||||
<div class="outline-card__icon-container outline-card__icon-complete np-hidden-desktop">
|
||||
<i class="fas fa-check np-learning-path-outline-icon" aria-label="Course Completed"></i>
|
||||
</div>
|
||||
{% elsif element_type == "div" %}
|
||||
<div class="outline-card__icon-container outline-card__icon-locked np-hidden-desktop">
|
||||
<i class="fas fa-lock np-learning-path-outline-icon" aria-label="Course Locked"></i>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="outline-card__icon-container outline-card__icon-link np-hidden-desktop">
|
||||
{% if course.optional? %}
|
||||
{% if course.name == "Servicetraining" or course.name == "Kassentraining" %}
|
||||
<span data-lang="DE">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Fortsetzen
|
||||
{% else %}
|
||||
Anzeigen
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
Review
|
||||
{% endif %}
|
||||
</span>
|
||||
{% else %}
|
||||
<span data-lang="DE">Heft öffnen</span>
|
||||
<span data-lang="EN">Open booklet</span>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<span data-lang="DE">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Fortsetzen
|
||||
{% else %}
|
||||
Anzeigen
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
Review
|
||||
{% endif %}
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% comment %} Use a different icon based on the state of the learning path and course {% endcomment %}
|
||||
{% if course.completed? %}
|
||||
<div class="outline-card__icon-container outline-card__icon-complete np-hidden-mobile">
|
||||
<i class="fas fa-check np-learning-path-outline-icon" aria-label="Course Completed"></i>
|
||||
</div>
|
||||
{% elsif element_type == "div" %}
|
||||
<div class="outline-card__icon-container outline-card__icon-locked np-hidden-mobile">
|
||||
<i class="fas fa-lock np-learning-path-outline-icon" aria-label="Course Locked"></i>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="outline-card__icon-container outline-card__icon-link np-hidden-mobile">
|
||||
{% if course.optional? %}
|
||||
{% if course.name == "Servicetraining" or course.name == "Kassentraining" %}
|
||||
<span data-lang="DE">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Fortsetzen
|
||||
{% else %}
|
||||
Anzeigen
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
Review
|
||||
{% endif %}
|
||||
</span>
|
||||
{% else %}
|
||||
<span data-lang="DE">Heft öffnen</span>
|
||||
<span data-lang="EN">Open booklet</span>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<span data-lang="DE">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Fortsetzen
|
||||
{% else %}
|
||||
Anzeigen
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if course.progress == 0 %}
|
||||
Start
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
Review
|
||||
{% endif %}
|
||||
</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</{{ element_type }}>
|
||||
</div>
|
||||
@ -0,0 +1,22 @@
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button np-button-big"
|
||||
{% if learning_path.enrolled? %}
|
||||
{% if learning_path.current_item.course? %}
|
||||
href="{% route learning_path_course, id: learning_path.current_item.id, learning_path_id: learning_path.id %}"
|
||||
{% elsif learning_path.current_item.training_event? %}
|
||||
href="{% route training_session, id: learning_path.current_item.id %}"
|
||||
{% endif %}
|
||||
{% else %}
|
||||
href="{% route learning_path_enrollment, code: learning_path.enrollment_code %}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if learning_path.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif learning_path.started? == false %}
|
||||
Weiter
|
||||
{% elsif learning_path.completed? %}
|
||||
{% t shared.learning_path.view %}
|
||||
{% else %}
|
||||
Weiter
|
||||
{% endif %}
|
||||
</a>
|
||||
@ -0,0 +1,3 @@
|
||||
<div class="np-card-text">
|
||||
{{ learning_path.description }}
|
||||
</div>
|
||||
@ -0,0 +1,27 @@
|
||||
<h3 class="np-card-heading">
|
||||
Instructors
|
||||
</h3>
|
||||
<div class="np-content-instructors-content row">
|
||||
{% for instructor in learning_path.instructors %}
|
||||
<div class="np-content-instructors-content-item">
|
||||
<img
|
||||
src="{{ instructor.avatar_url }}"
|
||||
class="np-content-instructors-content-image"
|
||||
alt="{{ instructor.name }}"
|
||||
>
|
||||
<div class="np-content-instructors-content-description">
|
||||
<div class="np-content-instructors-content-name">
|
||||
{{ instructor.name }}
|
||||
</div>
|
||||
|
||||
{% assign instructor_title_size = instructor.title | size %}
|
||||
{% if instructor.title and instructor.title.size > 0 %}
|
||||
<div class="np-content-instructors-content-info">
|
||||
{{ instructor.title }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
@ -0,0 +1,160 @@
|
||||
{% assign lp_contains_ilt = false %}
|
||||
|
||||
<div class="np-learning-path-outline blocks-layout">
|
||||
{% for item in learning_path.items %}
|
||||
{% if item.course? %}
|
||||
{% include "learning_path_course", course: item %}
|
||||
{% elsif item.training_event? %}
|
||||
{% assign lp_contains_ilt = true %}
|
||||
{% include "learning_path_training_session", training_session: item %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.outline-card__icon-link {
|
||||
background-color: #3E1191;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.outline-card__icon-link:hover {
|
||||
background-color: #7625F7;;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-card-content {
|
||||
flex-direction:column;
|
||||
padding:16px;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-events-content-date-wrapper {
|
||||
height:185px;
|
||||
margin-bottom:20px;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-events-content-date {
|
||||
min-width: auto;
|
||||
width: 100%;
|
||||
padding: 8px 16px;
|
||||
height: 100%;
|
||||
margin: 0 auto 16px;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-events-content-month,
|
||||
.np-learning-path-session-card .np-events-content-day {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-events-content-time { font-size:16px;}
|
||||
|
||||
.np-learning-path-session-card .np-optional-ribbon {
|
||||
background-color: #B6B9C2;
|
||||
padding: 0.25rem 1rem;
|
||||
border-radius: 1.5rem;
|
||||
line-height: 1.1;
|
||||
text-transform: none;
|
||||
font-size: 0.75rem;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
right: 22px;
|
||||
top: 22px;
|
||||
bottom: unset;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-learning-path-outline-name {
|
||||
font-size:18px;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .register-button {
|
||||
width: auto;
|
||||
border-radius: 30px;
|
||||
padding: 6px 16px;
|
||||
min-width: 115px;
|
||||
text-align: center;
|
||||
margin-right: 0;
|
||||
background-color: #3E1191;
|
||||
color: #ffffff;
|
||||
margin-left:auto;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.np-learning-path-session-card .np-card-content {
|
||||
flex-direction:row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-events-content-date-wrapper {
|
||||
width: 40%;
|
||||
max-width: 300px;
|
||||
height: calc(100% + 32px);
|
||||
margin: -16px 0;
|
||||
padding: 16px;
|
||||
border-right: 1px solid #e0f3ff;
|
||||
position:relative;
|
||||
left: -16px;
|
||||
flex:1;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-events-content-date {
|
||||
margin: 0 8px;
|
||||
width:auto;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-events-content-day {
|
||||
font-size: 30px;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-learning-path-outline-content {
|
||||
flex-direction:column;
|
||||
padding: 6px 16px 0 0;
|
||||
height:100%;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-optional-ribbon {
|
||||
right: 22px;
|
||||
top: 22px;
|
||||
}
|
||||
|
||||
.np-learning-path-session-card .np-learning-path-outline-name {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
buttons = document.getElementsByClassName("np-learning-path-outline-item");
|
||||
|
||||
for (i = 0; i < buttons.length; i++) {
|
||||
buttons[i].href = buttons[i].href.replace('/app','');
|
||||
}
|
||||
|
||||
const lpContainsILT = {{lp_contains_ilt}}
|
||||
|
||||
//if (!lpContainsILT) {
|
||||
if (!$(".cta__container.cta--outline").hasClass('all-optional-items')) {
|
||||
console.log("reorder lp.")
|
||||
reorderLpCoursesByRequirement()
|
||||
}
|
||||
//}
|
||||
|
||||
function reorderLpCoursesByRequirement() {
|
||||
var indexes = document.querySelectorAll(".lp-course");
|
||||
var indexesArray = Array.from(indexes);
|
||||
|
||||
const sortByRequirementAttr = arr => {
|
||||
const sorter = (a, b) => {
|
||||
return b.dataset.required - a.dataset.required;
|
||||
}
|
||||
arr.sort(sorter);
|
||||
};
|
||||
|
||||
sortByRequirementAttr(indexesArray);
|
||||
$(".np-learning-path-outline").empty()
|
||||
|
||||
indexesArray.forEach(e =>
|
||||
document.querySelector(".np-learning-path-outline").appendChild(e));
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
@ -0,0 +1,32 @@
|
||||
<div class="np-top-cta">
|
||||
<div class="np-top-cta-progress-content">
|
||||
<div class="np-top-cta-progress-title np-text-title">
|
||||
<span data-lang="DE">Lernfortschritt</span>
|
||||
<span data-lang="EN">Study progress</span>
|
||||
</div>
|
||||
<div class="np-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ learning_path.progress }}%"
|
||||
class="np-progress-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-top-cta-progress-text">
|
||||
<span data-lang="DE">
|
||||
{% if learning_path.progress > 0 %}
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
{% else %}
|
||||
nicht angefangen
|
||||
{% endif %}
|
||||
</span>
|
||||
<span data-lang="EN">
|
||||
{% if learning_path.progress > 0 %}
|
||||
{{learning_path.progress}}% complete
|
||||
{% else %}
|
||||
not started
|
||||
{% endif %}
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,104 @@
|
||||
{% assign session_element_type = "a" %}
|
||||
{% if learning_path.enrolled? and training_session.unlocked? %}
|
||||
{% assign session_element_type = "a" %}
|
||||
{% else %}
|
||||
{% assign session_element_type = "div" %}
|
||||
{% endif %}
|
||||
|
||||
{% assign lp_session_required = 1 %}
|
||||
{% if training_session.optional? %}
|
||||
{% assign lp_session_required = 0 %}
|
||||
{% endif %}
|
||||
|
||||
{% assign training_session_time = training_session.time | split: " - " %}
|
||||
|
||||
{% assign start_time = training_session_time | slice: 0 | join: "" %}
|
||||
{% if start_time contains "PM" %}
|
||||
{% assign start_time = start_time | remove: " PM" %}
|
||||
{% assign split_start_time = start_time | split: ":" %}
|
||||
{% assign start_time_hour = split_start_time | slice: 0 | join: "" | abs | plus: 12 %}
|
||||
{% assign start_time_mins = split_start_time | slice: 1 | join: "" %}
|
||||
{% elsif start_time contains "AM" %}
|
||||
{% assign start_time = start_time | remove: " AM" %}
|
||||
{% endif %}
|
||||
|
||||
{% assign end_time = training_session_time | slice: 1 | join: "" %}
|
||||
{% if end_time contains "PM" %}
|
||||
{% assign end_time = end_time | remove: " PM" %}
|
||||
{% assign split_end_time = end_time | split: ":" %}
|
||||
{% assign end_time_hour = split_end_time | slice: 0 | join: "" | abs | plus: 12 %}
|
||||
{% assign end_time_mins = split_end_time | slice: 1 | join: "" %}
|
||||
{% elsif end_time contains "AM" %}
|
||||
{% assign end_time = end_time | remove: " AM" %}
|
||||
{% endif %}
|
||||
|
||||
|
||||
{% if learning_path.enrolled? and training_session.unlocked? %}
|
||||
<div class="np-learning-path-outline-bar np-hidden-mobile" style='display: none;'></div>
|
||||
<div class="np-card np-learning-path-session-card lp-course" data-required="{{lp_session_required}}">
|
||||
<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-wrapper">
|
||||
<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>
|
||||
{% if training_session.optional? %}
|
||||
<div class="np-optional-ribbon">
|
||||
{% t shared.optional %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</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">
|
||||
{% assign instructor_name = training_session.instructors | split: " " %}
|
||||
{{ instructor_name | slice: 0 }}
|
||||
</div>
|
||||
<div class="np-events-content-time np-learning-path-outline-time np-button-color">
|
||||
{{start_time_hour}}:{{start_time_mins}} - {{end_time_hour}}:{{end_time_mins}} Uhr
|
||||
</div>
|
||||
</div>
|
||||
<div class="register-button">
|
||||
<span data-lang="DE">Registrieren</span>
|
||||
<span data-lang="EN">Register</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="np-card np-learning-path-session-card lp-course">
|
||||
<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-wrapper">
|
||||
<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>
|
||||
{% if training_session.optional? %}
|
||||
<div class="np-optional-ribbon">
|
||||
{% t shared.optional %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
@ -0,0 +1,13 @@
|
||||
<div class="np-card np-search-zero-state">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content np-card-content-vertical np-search-zero-state-card">
|
||||
<h3 class="np-search-zero-state-title">
|
||||
Nichts gefunden
|
||||
</h3>
|
||||
<div class="np-search-zero-state-subtitle">
|
||||
Entschuldigung, wir konnten keine Übereinstimmungen finden. Bitte versuchen Sie es mit einem anderen Begriff.
|
||||
</div>
|
||||
<div class="np-search-zero-state-image"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,37 @@
|
||||
<nav class="np-sub-navigation">
|
||||
<div class="np-sub-navigation-content">
|
||||
|
||||
<div class="np-sub-navigation-content-item trainings-sub-link np-sub-navigation-content-item-inactive">
|
||||
<a class="np-sub-navigation-content-item-link subnav-item" href="/app/courses">
|
||||
<i class="far fa-home-lg-alt np-button-color np-sub-navigation-content-item-icon" aria-hidden="true"></i>
|
||||
<div class="oa-sub-navigation-content-item-label">
|
||||
Trainings
|
||||
</div>
|
||||
</a>
|
||||
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
||||
</div>
|
||||
|
||||
<div class="np-sub-navigation-content-item learning-paths-sub-link np-sub-navigation-content-item-inactive">
|
||||
<a class="np-sub-navigation-content-item-link subnav-item" href="/app/learning_paths/a528e5fd-cd1c-4323-865e-db795895e2a3">
|
||||
<i class="fa fa-tasks np-button-color np-sub-navigation-content-item-icon" aria-hidden="true"></i>
|
||||
<div class="oa-sub-navigation-content-item-label">
|
||||
Lernwege
|
||||
</div>
|
||||
</a>
|
||||
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<script>
|
||||
const currentSubPath = window.location.pathname;
|
||||
|
||||
if (currentSubPath == "/app/courses") {
|
||||
$(".trainings-sub-link").addClass("np-sub-navigation-content-item-active")
|
||||
$(".trainings-sub-link").removeClass("np-sub-navigation-content-item-inactive")
|
||||
} else if (currentSubPath.includes("/app/learning_paths")) {
|
||||
$(".learning-paths-sub-link").addClass("np-sub-navigation-content-item-active")
|
||||
$(".learning-paths-sub-link").removeClass("np-sub-navigation-content-item-inactive")
|
||||
}
|
||||
|
||||
</script>
|
||||
@ -0,0 +1,11 @@
|
||||
<div>
|
||||
{% if training_events.available and training_events.available.any? %}
|
||||
<div class="blocks-layout">
|
||||
{% for training_event in training_events.available %}
|
||||
{% include "cards_training_event", training_event: training_event, card_classes: "col-x-sm-6 col-sm-6 col-md-4" %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% include "training_events_zero_state" %}
|
||||
{% endif %}
|
||||
</div>
|
||||
@ -0,0 +1,45 @@
|
||||
<div class="dropdown dropdown-calendar">
|
||||
<button
|
||||
class="np-button np-button-big dropdown-calendar-button"
|
||||
data-toggle-class="is-open"
|
||||
data-toggle-escape
|
||||
data-toggle-outside
|
||||
data-toggle-target-next
|
||||
type="button"
|
||||
>
|
||||
<span data-lang="DE">{% t .add_to_calendar %}</span>
|
||||
<span data-lang="EN">Add to calendar</span>
|
||||
<i class="fas fa-chevron-down dropdown-calendar-button-chevron" aria-hidden="true"></i>
|
||||
</button>
|
||||
|
||||
<ul class="dropdown-calendar-menu">
|
||||
<li class="dropdown-calendar-item">
|
||||
<a
|
||||
class="dropdown-calendar-item-element np-button-background-color-on-hover np-button-font-color-on-hover"
|
||||
href="{{ training_session.google_calendar_url }}"
|
||||
target="_blank"
|
||||
>
|
||||
{% t .google_calendar %}
|
||||
</a>
|
||||
</li>
|
||||
<li class="dropdown-calendar-item">
|
||||
<a
|
||||
class="dropdown-calendar-item-element np-button-background-color-on-hover np-button-font-color-on-hover"
|
||||
href="{{ training_session.outlook_calendar_url }}"
|
||||
target="_blank"
|
||||
>
|
||||
<span data-lang="DE">{% t .outlook_calendar %}</span>
|
||||
<span data-lang="EN">Calendar for Outlook.com</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="dropdown-calendar-item">
|
||||
<a
|
||||
class="dropdown-calendar-item-element np-button-background-color-on-hover np-button-font-color-on-hover"
|
||||
href="{{ training_session.ical_calendar_url }}"
|
||||
target="_blank"
|
||||
>
|
||||
{% t .ical_calendar %}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -0,0 +1,34 @@
|
||||
<div class="np-training-session-cta">
|
||||
<div class="np-training-session-cta-buttons">
|
||||
<form
|
||||
action="{% route training_session_registration, id: training_session.id %}"
|
||||
method="post"
|
||||
>
|
||||
{% form_authenticity_token %}
|
||||
|
||||
{% if training_session.internal? and training_session.approved? %}
|
||||
{% if features.training_events_google_calendar? %}
|
||||
{% include "training_session_calendars" %}
|
||||
<button type="submit" class="np-button np-button-big np-button-secondary">
|
||||
<span data-lang="DE">{% t .unregister %}</span>
|
||||
<span data-lang="EN">Unregister</span>
|
||||
</button>
|
||||
{% else %}
|
||||
<button type="submit" class="np-button-font-color np-button np-button-big">
|
||||
<span data-lang="DE">{% t .unregister %}</span>
|
||||
<span data-lang="EN">Unregister</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
|
||||
<input type="hidden" name="_method" value="delete" />
|
||||
{% endif %}
|
||||
|
||||
{% if training_session.not_registered? %}
|
||||
<button type="submit" class="np-top-button np-button np-button-big">
|
||||
<span data-lang="DE">{% t .register %}</span>
|
||||
<span data-lang="EN">Register</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,12 @@
|
||||
<div class="np-card-training-session-date-bar"></div>
|
||||
<div class="np-card-training-session-date-day">
|
||||
{{ training_session.day }}
|
||||
</div>
|
||||
<div class="card__month-year-container">
|
||||
<div class="np-card-training-session-date-month">
|
||||
{{ training_session.month }}
|
||||
</div>
|
||||
<div class="np-card-training-session-date-year">
|
||||
{{ training_session.year }}
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,77 @@
|
||||
{% include "header", current_page_orgin: "training_events" %}
|
||||
<main class="np-main np-page-container np-training-session">
|
||||
<div class="blocks-layout">
|
||||
|
||||
<div class="col-md-8">
|
||||
<div class="np-card">
|
||||
<div class="np-card-container details-card__card-container">
|
||||
<div class="np-resource-header details-card__header np-card-padding-dynamic">
|
||||
<div class="np-top-title">
|
||||
{{ training_event.title }}
|
||||
</div>
|
||||
<div class="np-top-vocabulary">
|
||||
|
||||
{% case training_event.event_type %}
|
||||
{% when "online" %}
|
||||
<i class="fa fa-laptop np-training-session-icon" aria-hidden="true"></i>
|
||||
<span data-lang="DE">{% t shared.event_types, key: training_event.event_type %}</span>
|
||||
<span data-lang="EN">Online Event</span>
|
||||
{% when "in_person" %}
|
||||
<i class="fa fa-users-class np-training-session-icon" aria-hidden="true"></i>
|
||||
<span data-lang="DE">{% t shared.event_types, key: training_event.event_type %}</span>
|
||||
<span data-lang="EN">In-Person Event</span>
|
||||
{% endcase %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-divider"></div>
|
||||
<div class="np-card-padding-dynamic details-card__card-content">
|
||||
|
||||
{% if training_event.description and training_event.description.size > 0 %}
|
||||
{% include "training_session_description" %}
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
|
||||
<div class="blocks-layout">
|
||||
<div class="np-card col-sm-6 col-md-12">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
{% include "training_session_details" %}
|
||||
{% include "training_session_cta" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-6 col-md-12">
|
||||
<div class="np-training-session-sessions-title">
|
||||
<span data-lang="DE">{% t shared.more_sessions %}</span>
|
||||
<span data-lang="EN">More sessions</span>
|
||||
</div>
|
||||
{% if training_event.sessions and training_event.sessions.size > 1 %}
|
||||
{% include "training_session_more_sessions" %}
|
||||
{% else %}
|
||||
<div class="np-training-session-zero-state">
|
||||
<img
|
||||
alt="{% t .empty %}"
|
||||
class="np-zero-state-training-sessions"
|
||||
/>
|
||||
<div class="np-training-session-zero-state-text">
|
||||
<span data-lang="DE">{% t .empty %}</span>
|
||||
<span data-lang="EN">There are currently no other sessions for this event.</span>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -0,0 +1,83 @@
|
||||
{% assign training_session_time = training_session.time_period | split: " - " %}
|
||||
|
||||
{% assign start_time = training_session_time | slice: 0 | join: "" %}
|
||||
{% if start_time contains "PM" %}
|
||||
{% assign start_time = start_time | remove: " PM" %}
|
||||
{% assign split_start_time = start_time | split: ":" %}
|
||||
{% assign start_time_hour = split_start_time | slice: 0 | join: "" | abs | plus: 12 %}
|
||||
{% assign start_time_mins = split_start_time | slice: 1 | join: "" %}
|
||||
{% elsif start_time contains "AM" %}
|
||||
{% assign start_time = start_time | remove: " AM" %}
|
||||
{% endif %}
|
||||
|
||||
{% assign end_time = training_session_time | slice: 1 | join: "" %}
|
||||
{% if end_time contains "PM" %}
|
||||
{% assign end_time = end_time | remove: " PM" %}
|
||||
{% assign split_end_time = end_time | split: ":" %}
|
||||
{% assign end_time_hour = split_end_time | slice: 0 | join: "" | abs | plus: 12 %}
|
||||
{% assign end_time_mins = split_end_time | slice: 1 | join: "" %}
|
||||
{% elsif end_time contains "AM" %}
|
||||
{% assign end_time = end_time | remove: " AM" %}
|
||||
{% endif %}
|
||||
|
||||
<div class="np-card-training-session-date">
|
||||
{% include "training_session_date", training_session: training_session %}
|
||||
|
||||
{% if training_session.approved? %}
|
||||
<div class="session-date__other-info-container np-training-session-cta-note np-alert-success">
|
||||
<div class="session-date__other-info-wrapper">
|
||||
<i class="far fa-check np-training-session-icon" aria-hidden="true"></i>
|
||||
<span>You're registered!</span>
|
||||
</div>
|
||||
</div>
|
||||
{% elsif training_session.pending? %}
|
||||
<div class="session-date__other-info np-training-session-cta-note np-alert-error">
|
||||
<div class="session-date__other-info-wrapper">
|
||||
<span>Pending – waiting approval</span>
|
||||
</div>
|
||||
</div>
|
||||
{% elsif training_session.denied? %}
|
||||
<div class="session-date__other-info np-training-session-cta-note np-alert-error">
|
||||
<div class="session-date__other-info-wrapper">
|
||||
<span>Denied – contact your academy admin</span>
|
||||
</div>
|
||||
</div>
|
||||
{% elsif training_session.too_late? %}
|
||||
<div class="session-date__other-info np-training-session-cta-note np-alert-error">
|
||||
<div class="session-date__other-info-wrapper">
|
||||
<span>Too late – meeting started</span>
|
||||
</div>
|
||||
</div>
|
||||
{% elsif training_session.no_seats? %}
|
||||
<div class="session-date__other-info np-training-session-cta-note np-alert-error">
|
||||
<div class="session-date__other-info-wrapper">
|
||||
<span>No seats available</span>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="training-session__details">
|
||||
<div class="np-training-session-time">
|
||||
<i class="fa fa-clock np-training-session-icon" aria-label="Event Time"></i>
|
||||
{{start_time_hour}}:{{start_time_mins}} - {{end_time_hour}}:{{end_time_mins}} Uhr
|
||||
</div>
|
||||
<div class="np-training-session-location">
|
||||
{% if training_session.location %}
|
||||
<i class="fa fa-map-marker-alt np-training-session-icon" aria-label="Event Location"></i>
|
||||
{{ training_session.location }}
|
||||
{% elsif training_session.session_url %}
|
||||
<i class="fa fa-globe np-training-session-icon" aria-label="Event URL"></i>
|
||||
<a href="{{ training_session.session_url }}" class="np-button-color" target="_blank" >
|
||||
{{ training_session.session_url }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if training_session.instructor and training_session.instructor.size > 0 %}
|
||||
<div>
|
||||
<i class="fa fa-chalkboard-teacher np-training-session-icon" aria-label="Instructor"></i>
|
||||
{% assign instructor_name = training_session.instructor | split: " " %}
|
||||
{{ instructor_name | slice: 0 }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@ -0,0 +1,26 @@
|
||||
{% include "header" %}
|
||||
{% include "english_banner" %}
|
||||
<main class="np-main np-courses np-subpage-container">
|
||||
<h1 class="np-resource-title">
|
||||
<span data-lang="DE">Deine Trainings für mehr Jobauswahl</span>
|
||||
<span data-lang="EN">Your training for more job choices</span>
|
||||
</h1>
|
||||
{% comment %} <br>
|
||||
{% 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 %} {% endcomment %}
|
||||
{% include "courses_catalog" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-resource-title {
|
||||
text-transform:none;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,75 @@
|
||||
{% comment %} Skip cover page is course contains on the job category {% endcomment %}
|
||||
{% for cat in course.categories %}
|
||||
{% assign cat_name = cat.name | downcase %}
|
||||
{% if cat_name == "on-the-job" or cat.id == "40b1f3d7-6faf-4d54-a74f-92d330831728" %}
|
||||
|
||||
{% 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 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if course.properties.skip_course_cover_page == true %}
|
||||
{% 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 %}
|
||||
{% endif %}
|
||||
|
||||
{% include "header", current_page_orgin: "catalog" %}
|
||||
<main class="np-main np-page-container page--course-overview">
|
||||
|
||||
{% comment %} Get the full size background image by removing the modifier from the URL {% endcomment %}
|
||||
{% assign course_image_full_size = course.image_url | replace: '/resize=width:820,height:500,fit:crop/', '/' %}
|
||||
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
<div class="np-resource-header details-card__header np-card-padding-dynamic">
|
||||
{% include "course_header" %}
|
||||
</div>
|
||||
<div class="np-divider"></div>
|
||||
<div class="details-card__card-content np-card-padding-dynamic">
|
||||
|
||||
{% if course.full_description and course.full_description.size > 0 %}
|
||||
{% include "course_description" %}
|
||||
{% endif %}
|
||||
|
||||
{% if course.instructors and course.instructors.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_instructors" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% include "course_outline" %}
|
||||
|
||||
{% if course.events and course.events.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_events" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.enrolled? and course.started? %}
|
||||
{% include "course_progress_and_cta" %}
|
||||
{% else %}
|
||||
{% include "course_cta_button" %}
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-main {
|
||||
background:#8B78FA;
|
||||
}
|
||||
|
||||
.np-top-button.disabled {
|
||||
background-color: #ddd;
|
||||
cursor: text;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,20 @@
|
||||
{% include "header" %}
|
||||
{% comment %} {% include "sub_navigation", current_page: "/app/courses" %} {% endcomment %}
|
||||
<main class="np-main np-courses np-subpage-container">
|
||||
<h1 class="np-resource-title">
|
||||
Deine Trainings für mehr Jobauswahl
|
||||
</h1>
|
||||
<br>
|
||||
{% include "courses_index", card_classes: "col-xs-12 col-sm-6 col-lg-4 np-stretch-content" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-resource-title {
|
||||
text-transform:none;
|
||||
}
|
||||
</style>
|
||||
|
||||
{% comment %} <script>
|
||||
$('.np-card-image').freezeframe({'animation_play_duration': 2500, 'non_touch_device_trigger_event': 'hover'})
|
||||
</script> {% endcomment %}
|
||||
@ -0,0 +1,3 @@
|
||||
<script>
|
||||
window.location.replace("/app/courses")
|
||||
</script>
|
||||
@ -0,0 +1,393 @@
|
||||
{% assign isAuthenticatedUser = false %}
|
||||
|
||||
{% for group in current_person.groups %}
|
||||
{% if group.name == "All Users" or group.id == "6331d115-ea74-418a-99b2-af5c81208fe1" or group.name == "Internal
|
||||
Zenjob Testing" or group.id == "940a5d24-32af-45f1-8ed4-8a6b4689d9c9" %}
|
||||
{% assign isAuthenticatedUser = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if current_person.email contains "+preview" %}
|
||||
{% assign isAuthenticatedUser = true %}
|
||||
{% endif %}
|
||||
|
||||
{% unless isAuthenticatedUser %}
|
||||
<main class="np-main np-homepage unauthorized">
|
||||
<div class="np-homepage-content">
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline" style="color: #fff">
|
||||
{{ homepage.headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline">
|
||||
Entschuldigung! Es scheint, dass deine E-Mail-Adresse {{current_person.email}} nicht den richtigen Zugang erhalten hat. Es kann nach der Registrierung bis zu 24h dauern, bis du freigeschalten wirst. Sollte das Problem danach weiterhin bestehen, wende dich an talents@zenjob.com, um den Zugang zu den vollständigen Lerninhalten anzufragen.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% endunless %}
|
||||
|
||||
{% if isAuthenticatedUser %}
|
||||
{% assign catalog_courses = courses.in_catalog %}
|
||||
{% include "header", current_page_orgin: "false" %}
|
||||
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-content">
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline" style="color: #fff">
|
||||
<span data-lang="DE">{{ homepage.headline }}</span>
|
||||
<span data-lang="EN">Welcome to our Zenjob Online Campus!</span>
|
||||
</div>
|
||||
<div class="np-homepage-subheadline">
|
||||
<span data-lang="DE">Hallo {{ current_person.first_name }}, hier bereiten wir dich auf alles vor, was du für deine erste Schicht als
|
||||
<div class="dropdown homepage-content-dropdown">
|
||||
<button class="dropbtn">Job auswählen</button>
|
||||
<div class="dropdown-content">
|
||||
<a href="#kassierer-in" data-category-name="Kassierer/in">Kassierer*in</a>
|
||||
<a href="#kellner-in" data-category-name="Kellner/in">Kellner*in</a>
|
||||
<a href="#warenverräumer-in" data-category-name="Warenverräumer/in">Warenverräumer*in</a>
|
||||
</div>
|
||||
</div>
|
||||
wissen musst.
|
||||
</span>
|
||||
<span data-lang="EN">Hello {{ current_person.first_name }}, here we prepare you for everything you need to know for your first shift as a
|
||||
<div class="dropdown homepage-content-dropdown">
|
||||
<button class="dropbtn">select job</button>
|
||||
<div class="dropdown-content">
|
||||
<a href="#kassierer-in" data-category-name="Kassierer/in">Cashier</a>
|
||||
<a href="#kellner-in" data-category-name="Kellner/in">Waitress</a>
|
||||
<a href="#warenverräumer-in" data-category-name="Warenverräumer/in">Goods mover</a>
|
||||
</div>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="homepage-cards-section row np-max-width">
|
||||
{% for course in catalog_courses %}
|
||||
{% if course.properties.homepage_course %}
|
||||
{% for cat in course.categories %}
|
||||
{% if cat.id == "087ea56d-888b-4e0f-af1f-68627318c841" or cat.id == "9be55234-19c5-4df4-bd1d-03e93f0faf83" or cat.id == "6580e10e-eacf-402d-a330-51d202721cce" or cat.id == "a63019c7-0a46-40bd-bc1b-935c887a4380" or cat.name == "Warenverräumer/in" or cat.name == "Kellner/in" or cat.name == "Kassierer/in" %}
|
||||
<div class="col-xs-12 col-sm-6 col-md-3 homepage-card-column" style="display:none;" data-category="{{cat.id}}" data-category-name="{{cat.name}}" data-lang="{{course.properties.course_language}}">
|
||||
<a href="{% route course, id: course.id %}" class="homepage-card">
|
||||
<div class="homepage-card-content">
|
||||
<div class="homepage-card-img">
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/zenjob/FINAL+-+Zenjob+(Purple+Cashier).png" alt="">
|
||||
</div>
|
||||
<div class="homepage-card-title-wrapper">
|
||||
<div>{{course.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% for learning_path in learning_paths.available %}
|
||||
{% assign learning_path_lang = "DE" %}
|
||||
{% for learning_path_cat in learning_path.categories %}
|
||||
{% if learning_path_cat.name == "English" %}
|
||||
{% assign learning_path_lang = "EN" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% for learning_path_cat in learning_path.categories %}
|
||||
{% if learning_path_cat.id == "087ea56d-888b-4e0f-af1f-68627318c841" or learning_path_cat.id == "9be55234-19c5-4df4-bd1d-03e93f0faf83" or learning_path_cat.id == "6580e10e-eacf-402d-a330-51d202721cce" or learning_path_cat.id == "a63019c7-0a46-40bd-bc1b-935c887a4380" or learning_path_cat.name == "Warenverräumer/in" or learning_path_cat.name == "Kellner/in" or learning_path_cat.name == "Kassierer/in" %}
|
||||
<div class="col-xs-12 col-sm-6 col-md-3 homepage-card-column" style="display:none;" data-category="{{learning_path_cat.id}}" data-category-name="{{learning_path_cat.name}}" data-lang="{{learning_path_lang}}">
|
||||
<a href="{% route learning_path, id: learning_path.id %}" class="homepage-card">
|
||||
<div class="homepage-card-content">
|
||||
<div class="homepage-card-img">
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/zenjob/opened-book.png" alt="">
|
||||
</div>
|
||||
<div class="homepage-card-title-wrapper">
|
||||
<div>{{learning_path.name}} <span>(optional)</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
{% endif %}
|
||||
|
||||
<style>
|
||||
|
||||
.np-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
main.np-homepage {
|
||||
background-color: rgba(118,37,247,1);
|
||||
background: linear-gradient(90deg, rgba(62,17,145,1) 0%, rgba(118,37,247,1) 50%, rgba(139,120,250,1) 100%);
|
||||
background-size: cover;
|
||||
animation: gradient 15s ease-in-out infinite;
|
||||
height: 100%;
|
||||
padding-top: 100px;
|
||||
margin-bottom:0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
main.np-homepage.unauthorized {
|
||||
padding-top:0;
|
||||
}
|
||||
|
||||
.np-homepage-content {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
flex-direction: column;
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
|
||||
.unauthorized .np-homepage-content {
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.np-homepage-hero-content {
|
||||
position: unset;
|
||||
padding-bottom: 2.5rem;
|
||||
text-align: center;
|
||||
}
|
||||
.np-homepage-content .np-homepage-headline {
|
||||
font-size: 1.75rem;
|
||||
color: #fff;
|
||||
line-height: 1.1;
|
||||
}
|
||||
.np-homepage-content .np-homepage-subheadline {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.1;
|
||||
color: #fff;
|
||||
opacity: 100%;
|
||||
}
|
||||
|
||||
@keyframes gradient {
|
||||
0% {
|
||||
background-position: 0% 79%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 22%;
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 79%;
|
||||
}
|
||||
}
|
||||
|
||||
.homepage-content-dropdown {
|
||||
margin-right: 13px;
|
||||
}
|
||||
|
||||
.dropbtn {
|
||||
background-color: transparent;
|
||||
color: #fff;
|
||||
border: black;
|
||||
text-decoration: underline;
|
||||
font-weight: 700;
|
||||
position:relative;
|
||||
cursor:pointer;
|
||||
padding: 0 4px 0 0;
|
||||
}
|
||||
|
||||
.dropbtn:after {
|
||||
content:"▼";
|
||||
position:absolute;
|
||||
right: -13px;
|
||||
top: 8px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #E1E2E5;
|
||||
color:#707483;
|
||||
min-width: 100%;
|
||||
box-shadow: 0px 8px 8px 0px rgba(0,0,0,0.2);
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.dropdown-content a {
|
||||
color: black;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown:hover .dropdown-content {display: block;}
|
||||
|
||||
.dropdown:hover .dropbtn {background-color: #635bff60;}
|
||||
|
||||
|
||||
/* CARDS SECTION */
|
||||
.homepage-cards-section {
|
||||
padding: 0 24px;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.homepage-card {
|
||||
margin: 0 auto 24px;
|
||||
max-width: 350px;
|
||||
text-decoration:none;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.homepage-card-content {
|
||||
display:flex;
|
||||
align-items:center;
|
||||
background-color: #fff;
|
||||
border-radius: 16px;
|
||||
box-shadow: rgb(141 148 158 / 30%) 0px 4px 12px;
|
||||
}
|
||||
|
||||
.homepage-card-title-wrapper {
|
||||
width:65%;
|
||||
color: #3E1191;
|
||||
font-weight:700;
|
||||
text-align:center;
|
||||
padding:16px;
|
||||
transition:all 0.2s;
|
||||
}
|
||||
|
||||
.homepage-card:hover .homepage-card-title-wrapper {
|
||||
color:#7625F7;
|
||||
}
|
||||
|
||||
.homepage-card-img {
|
||||
width:45%;
|
||||
border-right: 1px solid #e0f3ff;
|
||||
padding:24px 16px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.homepage-card-img img {
|
||||
max-width: 90px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.np-homepage-hero-content {
|
||||
padding-top: 5rem;
|
||||
padding-bottom: 3rem;
|
||||
max-width:1170px;
|
||||
}
|
||||
.np-homepage-content .np-homepage-headline {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
.np-homepage-content .np-homepage-subheadline {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.homepage-content-dropdown {
|
||||
margin-right: 22px;
|
||||
}
|
||||
|
||||
.dropbtn:after {
|
||||
right: -21px;
|
||||
top: 12px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.homepage-cards-section {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.homepage-card {
|
||||
max-width: 275px;
|
||||
height: 100%;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.homepage-card-content {
|
||||
flex-direction: column-reverse;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.homepage-card-title-wrapper {
|
||||
font-size: 18px;
|
||||
line-height: 22px;
|
||||
width:100%;
|
||||
border-bottom:1px solid #e0f3ff;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.homepage-card-img {
|
||||
width: 100%;
|
||||
border: none;
|
||||
padding: 40px 16px;
|
||||
}
|
||||
|
||||
.homepage-card-img img {
|
||||
width: 120px;
|
||||
height:120px;
|
||||
max-width:120px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
$("document").ready(function() {
|
||||
if (window.location.hash) {
|
||||
filterCoursesByHash(window.location.hash)
|
||||
} else {
|
||||
//$(".homepage-card-column[data-category='087ea56d-888b-4e0f-af1f-68627318c841']").show()
|
||||
if ($("body").attr("data-lang") == "DE") {
|
||||
$(".homepage-card-column[data-category-name='Kassierer/in'][data-lang='DE']").show()
|
||||
} else if ($("body").attr("data-lang") == "EN") {
|
||||
$(".homepage-card-column[data-category-name='Kassierer/in'][data-lang='EN']").show()
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
$(".dropdown-content a").click(function() {
|
||||
$(".dropbtn").text($(this).text())
|
||||
filterCoursesBySelectedJob($(this))
|
||||
})
|
||||
|
||||
function filterCoursesBySelectedJob(selection) {
|
||||
const selectedCategory = $(selection).data("category-name")
|
||||
|
||||
$(".homepage-card-column").hide()
|
||||
|
||||
if ($("body").attr("data-lang") == "DE") {
|
||||
$(`.homepage-card-column[data-category-name='${selectedCategory}'][data-lang='DE']`).show()
|
||||
} else if ($("body").attr("data-lang") == "EN") {
|
||||
$(`.homepage-card-column[data-category-name='${selectedCategory}'][data-lang='EN']`).show()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function filterCoursesByHash(urlHash) {
|
||||
if ($("body").attr("data-lang") == "DE") {
|
||||
$("span[data-lang='DE'] .dropdown-content a").each(function() {
|
||||
if ($(this).attr('href') == urlHash) {
|
||||
$("span[data-lang='DE'] .dropbtn").text($(this).text())
|
||||
filterCoursesBySelectedJob($(this))
|
||||
}
|
||||
})
|
||||
} else if ($("body").attr("data-lang") == "EN") {
|
||||
$("span[data-lang='EN'] .dropdown-content a").each(function() {
|
||||
if ($(this).attr('href') == urlHash) {
|
||||
$("span[data-lang='EN'] .dropbtn").text($(this).text())
|
||||
filterCoursesBySelectedJob($(this))
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,157 @@
|
||||
{% include "header", current_page_orgin: "learning_paths" %}
|
||||
|
||||
{% assign lp_items_all_optional = true %}
|
||||
{% for item in learning_path.items %}
|
||||
{% unless item.optional? %}
|
||||
{% assign lp_items_all_optional = false %}
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
|
||||
<main class="np-main np-page-container page--learning-path-overview">
|
||||
|
||||
{% assign learning_path_image_full_size = learning_path.image_url | replace: '/resize=width:820,height:500,fit:crop/', '/' %}
|
||||
|
||||
<div class="blocks-layout">
|
||||
|
||||
<div class="col-md-5 col-lg-6">
|
||||
<div class="np-card">
|
||||
<div class="details-card__card-container np-card-container">
|
||||
<div class="np-resource-header details-card__header np-card-padding-dynamic">
|
||||
<div class="np-top-title">
|
||||
{{ learning_path.name }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-divider"></div>
|
||||
<div class="details-card__card-content np-card-padding-dynamic">
|
||||
{% if learning_path.description and learning_path.description.size > 0 %}
|
||||
{% include "learning_path_description" %}
|
||||
{% endif %}
|
||||
|
||||
{% if learning_path.instructors and learning_path.instructors.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "learning_path_instructors" %}
|
||||
</div>
|
||||
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-7 col-lg-6">
|
||||
<div class="cta__container cta--outline {% if lp_items_all_optional %}all-optional-items{% endif %}">
|
||||
{% include "learning_path_progress_and_cta" %}
|
||||
</div>
|
||||
{% include "learning_path_outline" %}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
|
||||
.cta__container.cta--outline.all-optional-items {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.page--learning-path-overview {
|
||||
background: #8B78FA;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .np-card-container {
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .card__image {
|
||||
width:100%;
|
||||
padding:16px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .card__image > img {
|
||||
max-width:100%;
|
||||
max-height:200px;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .card__image .np-card-ribbon {
|
||||
right:22px;
|
||||
top:22px;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-content {
|
||||
margin-left: 0;
|
||||
padding: 0 16px 16px;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .np-card-content-title {
|
||||
font-size:18px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.outline-card__icon-container {
|
||||
width: auto;
|
||||
border-radius: 30px;
|
||||
padding: 6px 16px;
|
||||
min-width: 115px;
|
||||
text-align: center;
|
||||
margin-right:0;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .np-card-content-progress {
|
||||
font-size:14px;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
|
||||
.np-learning-path-outline-item .np-card-container {
|
||||
flex-direction: row;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .card__image {
|
||||
width:40%;
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .card__image > img {
|
||||
max-height:130px;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-content {
|
||||
padding: 16px;
|
||||
display:flex;
|
||||
flex-direction:row;
|
||||
justify-content: space-between;
|
||||
height:auto;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-content .text-wrapper {
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .np-card-content-title {
|
||||
font-size:16px;
|
||||
flex:1;
|
||||
}
|
||||
|
||||
.outline-card__icon-container {
|
||||
margin-left:16px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (min-width:1400px) {
|
||||
.np-learning-path-outline-item .np-card-content-title,
|
||||
.np-learning-path-session-card .np-learning-path-outline-name {
|
||||
font-size:18px;
|
||||
}
|
||||
|
||||
.np-learning-path-outline-item .np-card-content-progress {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,74 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main np-learning-paths np-subpage-container">
|
||||
{% include "learning_paths_index", items: learning_paths.available %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
|
||||
body[data-lang='EN'] .card-learning-path[data-lang='DE'],
|
||||
body[data-lang='DE'] .card-learning-path[data-lang='EN'] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
body[data-lang='EN'] .card-learning-path[data-lang='EN'],
|
||||
body[data-lang='DE'] .card-learning-path[data-lang='DE'] {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.card-learning-path[data-lang='DE'] {display:block;}
|
||||
.card-learning-path[data-lang='EN'] {display:none;}
|
||||
|
||||
.np-learning-paths {
|
||||
background: #8B78FA;
|
||||
}
|
||||
|
||||
.np-resource-title {
|
||||
color:#fff;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources {
|
||||
max-width: 1200px;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources .np-card-container {
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources .image-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources .image-wrapper img {
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources .np-card-ribbon {
|
||||
position: absolute;
|
||||
right: 16px;
|
||||
top: 12px;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources .np-card-content-title {
|
||||
font-size:18px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.np-learning-paths .np-learning-path-image {
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources .image-wrapper {
|
||||
width: 35%;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources .np-card-text-wrapper {
|
||||
width:65%;
|
||||
}
|
||||
|
||||
.np-learning-paths-resources .np-card-content-title {
|
||||
font-size:24px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,57 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main np-courses np-subpage-container">
|
||||
<h1 class="np-resource-title">
|
||||
On-The-Job Videos
|
||||
</h1>
|
||||
<br>
|
||||
|
||||
{% assign num_of_video_courses = 0 %}
|
||||
{% if courses.in_catalog.any? %}
|
||||
<div class="np-catalog-courses row row-with-thumbnails">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% for cat in course.categories %}
|
||||
{% if cat.id == "40b1f3d7-6faf-4d54-a74f-92d330831728" or cat.name == "On-The-Job" %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content video-column" data-lang="{{course.properties.course_language}}">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% assign num_of_video_courses = num_of_video_courses | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% comment %} {% capture message %}
|
||||
{% t shared.zero_state.courses.catalog,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %} {% endcomment %}
|
||||
<div class="np-dashboard-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
<p> {% t shared.zero_state.courses.catalog,
|
||||
key: current_school.course_vocabulary
|
||||
%}</p>
|
||||
</div>
|
||||
<img class="np-zero-state-courses" />
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if num_of_video_courses == 0 %}
|
||||
<div class="np-dashboard-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
<p> {% t shared.zero_state.courses.catalog,
|
||||
key: current_school.course_vocabulary
|
||||
%}</p>
|
||||
</div>
|
||||
<img class="np-zero-state-courses" />
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-resource-title {
|
||||
text-transform:none;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,58 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main np-search np-subpage-container np-max-width">
|
||||
<div class="np-resource-title">
|
||||
{% t .title %}
|
||||
</div>
|
||||
<div class="np-search-header">
|
||||
<div class="np-resource-subtitle">
|
||||
{% t .showing %}
|
||||
<span class="np-resource-subtitle-number">{{ results.count }}</span>
|
||||
{% t .results_for %}
|
||||
<span class="np-button-color">"{{ results.term }}"</span>
|
||||
</div>
|
||||
{% capture label %}{% t shared.filters.by_type %}{% endcapture %}
|
||||
{%
|
||||
include "filter_dropdown",
|
||||
filters: results.filters,
|
||||
key: "type",
|
||||
label: label
|
||||
%}
|
||||
</div>
|
||||
{% if results.items.any? %}
|
||||
{% render "search_result" for results.items as result %}
|
||||
{% else %}
|
||||
{% include "search_zero_state" %}
|
||||
{% endif %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
|
||||
.np-search-result {
|
||||
height: auto;
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.np-search-result a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.np-search-result .np-card-content {
|
||||
flex-direction: row;
|
||||
padding:0;
|
||||
}
|
||||
.np-search-result-snippet {
|
||||
overflow: hidden;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
.np-search-result-image {
|
||||
margin-right:12px;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.np-search-result-image {
|
||||
margin-right:24px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
1969
Custom_Templates/customer_templates/Zenjob Sandbox/styles.css.liquid
Normal file
1969
Custom_Templates/customer_templates/Zenjob Sandbox/styles.css.liquid
Normal file
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,15 @@
|
||||
{% include "header", current_page_orgin: "training_events" %}
|
||||
<main class="np-main np-training-events np-subpage-container">
|
||||
<div class="page__header-wrapper">
|
||||
<h1 class="np-resource-title">
|
||||
<span data-lang="DE">{% t .title %}</span>
|
||||
<span data-lang="EN">Training Events</span>
|
||||
</h1>
|
||||
<div class="np-resource-subtitle">
|
||||
<span data-lang="DE">{% t .subtitle %}</span>
|
||||
<span data-lang="EN">Discover face-to-face and online events that help you maximize your learning success</span>
|
||||
</div>
|
||||
</div>
|
||||
{% include "training_events_index" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -0,0 +1 @@
|
||||
{% include "training_session_desktop_view" %}
|
||||
@ -0,0 +1,89 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main np-certificates np-subpage-container">
|
||||
<h1 class="np-resource-title">
|
||||
<span data-lang="DE">{{custom_page.headline}}</span>
|
||||
<span data-lang="EN">Awards</span>
|
||||
|
||||
</h1>
|
||||
<div class="np-resource-subtitle"></div>
|
||||
|
||||
<div class="badges-section">
|
||||
<div class="row">
|
||||
{% assign number_of_badges = 0 %}
|
||||
{% for course in courses.in_catalog %}
|
||||
{% unless course.properties.course_badge == "none" or course.properties.course_badge == "" %}
|
||||
<div class="col-xs-12 col-sm-6 col-md-3 badge-column" data-lang="{{course.properties.course_language}}">
|
||||
<a href="{% route course, id: course.id %}" class="badge-container">
|
||||
|
||||
<img src="{{course.properties.course_badge}}" class="{% if course.progress < 100 %}inactive{% endif %}" />
|
||||
<div class="badge-course-title">{{course.name}}</div>
|
||||
</a>
|
||||
</div>
|
||||
{% assign number_of_badges = number_of_badges | plus: 1 %}
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
|
||||
{% if number_of_badges == 0 %}
|
||||
<div class="np-dashboard-resources-container">
|
||||
<img class="np-zero-state-courses" alt="" />
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
body[data-lang='EN'] .badge-column[data-lang='DE'],
|
||||
body[data-lang='DE'] .badge-column[data-lang='EN'] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
body[data-lang='EN'] .badge-column[data-lang='EN'],
|
||||
body[data-lang='DE'] .badge-column[data-lang='DE'] {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.badge-column[data-lang='DE'] {display:block;}
|
||||
.badge-column[data-lang='EN'] {display:none;}
|
||||
|
||||
.np-resource-title {
|
||||
text-transform:none;
|
||||
}
|
||||
|
||||
.badges-section {
|
||||
margin-top:32px;
|
||||
}
|
||||
|
||||
.badge-container {
|
||||
text-align:center;
|
||||
padding: 32px;
|
||||
background: #fff;
|
||||
box-shadow: rgb(141 148 158 / 80%) 0px 4px 12px;
|
||||
border-radius: 16px;
|
||||
margin: 0 16px 32px;
|
||||
display: block;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
.badge-container img {
|
||||
max-width:100%;
|
||||
}
|
||||
|
||||
.badge-container img.inactive {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
.badge-course-title {
|
||||
line-height: 1.3;
|
||||
color: #333333;
|
||||
font-weight:700;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.badge-course-title {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -112,7 +112,7 @@ page, etc.
|
||||
|
||||
## 04/06/2023
|
||||
|
||||
TODO: Ask if we can invite KC to their Wistia Project
|
||||
DONE: Ask if we can invite KC to their Wistia Project
|
||||
TODO: Create ExcelSheet for what Northpass needs to accurately update the SRT file.
|
||||
WARN: Wants to start uploading within the week
|
||||
|
||||
|
||||
@ -125,7 +125,7 @@ Feedback:
|
||||
- They need rich search (find across multiple platforms) and community functionality with experts and asking people for information.
|
||||
- Taylor: challenges with reporting
|
||||
|
||||
TODO: Send extension contract for one-two months.
|
||||
DONE: Send extension contract for one-two months.
|
||||
|
||||
Time line Needs (3 primary things):
|
||||
|
||||
@ -134,9 +134,9 @@ Time line Needs (3 primary things):
|
||||
- Can Fuse transfer over progress data?
|
||||
- Export CSVs per course? or Group?
|
||||
DONE: Ask what the data set should be.
|
||||
TODO: Ask Charlie for Course CSV (Just like Walmart) - Do it for BOTH academies, internal & external
|
||||
DONE: Ask Charlie for Course CSV (Just like Walmart) - Do it for BOTH academies, internal & external
|
||||
|
||||
## 03/02/2023
|
||||
|
||||
### Data Extract Inquiry
|
||||
TODO: Can we export all quiz data - questions and answers?
|
||||
DONE: Can we export all quiz data - questions and answers?
|
||||
|
||||
@ -315,4 +315,4 @@ DONE: Send Katlin and Erin examples of customized login pages, forms, learning p
|
||||
|
||||
## 04/04/2023
|
||||
|
||||
TODO: Reach out to Katlin regarding admin/embedded.
|
||||
DONE: Reach out to Katlin regarding admin/embedded.
|
||||
|
||||
@ -22,3 +22,19 @@ Actually start on 27th. 23rd is 100% ready and QA done. 27th are real people.
|
||||
|
||||
TODO: Confirm dates with Matt for Sales conference.
|
||||
Matt to collect the rest of the videos etc for the course.
|
||||
|
||||
## 05/16/2023
|
||||
|
||||
### Running Launch
|
||||
|
||||
Greg - West Region Sales Manager
|
||||
Matt - East ? Region Sales Manager
|
||||
Diamond - Project Manager that will be building content. Originally from Japan.
|
||||
|
||||
Launch Date: June 5th.
|
||||
Action items:
|
||||
|
||||
* NP Register & Homepage - Patrycja
|
||||
* Courses from Norm and Matt
|
||||
* Style Guide from Greg
|
||||
* Certificate Creation - Greg/Matt
|
||||
|
||||
@ -221,3 +221,11 @@ The only way to fix it it’s a requesting the user to clean cache in his browse
|
||||
to app/courses, we will redirect him to sign_in page with 301. The browser will cache sign_in page, and the user will be automatically redirected to sign_in page when the user tries visit app/courses. This will cause a loop.
|
||||
|
||||
301 makes sense if the website they are accessing was permanently moved to other location. In this case they are trying to access courses list but are redirected to sign in page because they have to be authenticated before they can access it. If we redirected them from courses to sign in page with 301 the user’s browser would save the redirect location (sign in page) and whenever the user tried to access courses web page their browser would move them automatically to sign in page making courses page inaccessible for the user. The only way out of it is cleaning browsers cache. However once they cleared the cache they would remove the cookies as well. The cookies keep the information about users identity. This is helpful because with that they don’t have to log in each time they visit our platform. But once the cookies are removed they would be again redirected to sign in page keeping them in this vicious circle. The reason to use 301 is to tell the browser “forget about this old location of the page you are accessing, this page is now here, also store this location and use it whenever you try to access this old location”.
|
||||
|
||||
|
||||
## 05/16/2023
|
||||
|
||||
Search results - can't click enough Northpass
|
||||
Only the title can be clicked when search results are returned. We need to be able to click the icon or description as well Not a problem - will get this started ASAP
|
||||
|
||||
DONE: Directly ask Chloe about the technical complications.
|
||||
|
||||
@ -29,3 +29,17 @@ Campaign process, controlled by pre-sales marketing.
|
||||
Gainsight could be a great option, but people have to meet "criteria" to send emails.
|
||||
|
||||
They use LeanData for checking for duplicates in their various systems. That's where Webhooks would be created.
|
||||
|
||||
## 05/16/2023
|
||||
|
||||
DONE: Remove Discover Catalog
|
||||
TODO: Add new header image that Cherrill will send.
|
||||
TODO: Make Footer similar to Terminus.com - at least the background as blue and text as white.
|
||||
DONE: Remove sign in in header.
|
||||
DONE: Move sub-nav to under header image
|
||||
TODO: minimize padding around logo. Mimic sign-in/main page.
|
||||
TODO: Addtl. Resources boxes same height
|
||||
TODO: Feature course, view button align left
|
||||
TODO: If no events, link saying "checkout upcoming events!" and link to /app/training_events
|
||||
TODO: Filter Button to Terminus Green or Orange
|
||||
TODO: Catalog: Sections divided by categories with headings at each section.
|
||||
|
||||
@ -84,4 +84,4 @@ function csvReader(someArray, filePath) {
|
||||
})
|
||||
}
|
||||
|
||||
csvReader(array, "Untitled spreadsheet - harri-academy-people.csv")
|
||||
csvReader(array, "Harri Activation Report - 2023.05.15.csv")
|
||||
|
||||
Reference in New Issue
Block a user