One note for NinjaCat

This commit is contained in:
Norm Rasmussen
2023-12-18 17:01:20 -05:00
parent 45342b1148
commit acb947865b
31 changed files with 3635 additions and 0 deletions

View File

@ -0,0 +1,7 @@
# NinjaCat
## 12/18/2023
ChurnZero deal but having disco calls with CS AE/CAMs?
Gio Demaio joining as AE/CAM

Binary file not shown.

View File

@ -0,0 +1,66 @@
<div class="np-hidden-mobile">
<p class="avatar-description">{% t .description %}</p>
<p class="avatar-requirements">{% t .requirements %}</p>
</div>
<img
alt=""
class="np-account-avatar-image"
src="{{ form.gravatar_url }}?s=200"
id="{{version}}_gravatar_img"
{% unless form.use_gravatar? %}style="display: none"{% endunless %}
/>
<img
alt=""
class="np-account-avatar-image"
src="{{ form.secure_custom_avatar_url }}"
id="{{version}}_custom_avatar_img"
{% if form.use_gravatar? %}style="display: none"{% endif %}
/>
<div class="np-account-avatar-choice">
<div class="np-form-field">
<label class="radio radio-before np-input-label" for="{{version}}_learner_use_gravatar_true">
<span class="radio__input">
<input
id="{{version}}_learner_use_gravatar_true"
name="learner[use_gravatar]"
type="radio"
value="true"
{% if form.use_gravatar? %}checked{% endif %}
/>
<span class="np-button-color radio__control"></span>
</span>
<span class="radio__label gravatar">
{% t .use_gravatar %}
</span>
</label>
</div>
<div class="np-form-field">
<label class="radio radio-before np-input-label" for="{{version}}_learner_use_gravatar_false">
<span class="radio__input">
<input
id="{{version}}_learner_use_gravatar_false"
name="learner[use_gravatar]"
type="radio"
value="false"
{% unless form.use_gravatar? %}checked{% endunless %}
/>
<span class="np-button-color radio__control"></span>
</span>
<span class="radio__label custom">
{% t .upload_custom_photo %}
</span>
</label>
</div>
<div>
<button
id="{{version}}_upload_avatar"
type="button"
class="np-button np-button-secondary" {% if form.use_gravatar? %}style="visibility: hidden"{% endif %}
>
{% t .upload %}
</button>
</div>
</div>

View File

@ -0,0 +1,93 @@
<div class="np-resource-title my-profile">
{% t .header %}
</div>
<div class="np-form-field {% if form.errors contains 'email' %}np-account-form-field-error{% endif %}">
<label class="np-input-label email" for="{{version}}_learner_email">{% t shared.email %} *</label>
<input
{% if form.options.invite? %} disabled {% endif %}
autofocus="autofocus"
class="np-input"
id="{{version}}_learner_email"
name="learner[email]"
type="email"
value="{{ form.email }}"
/>
</div>
<div class="np-form-field {% if form.errors contains 'first_name' %}np-account-form-field-error{% endif %}">
<label class="np-input-label first-name" for="{{version}}_learner_first_name">
{% t shared.first_name %} *
</label>
<input
class="np-input"
id="{{version}}_learner_first_name"
name="learner[first_name]"
value="{{ form.first_name }}"
/>
</div>
<div class="np-form-field {% if form.errors contains 'last_name' %}np-account-form-field-error{% endif %}">
<label class="np-input-label last-name" for="{{version}}_learner_last_name">
{% t shared.last_name %} *
</label>
<input
class="np-input"
id="{{version}}_learner_last_name"
name="learner[last_name]"
value="{{ form.last_name }}"
/>
</div>
<div class="np-form-field {% if form.errors contains 'display_name' %}np-account-form-field-error{% endif %}">
<label class="np-input-label display-name" for="{{version}}_learner_display_name">
{% t .display_name %}
</label>
<input
class="np-input"
id="{{version}}_learner_display_name"
name="learner[display_name]"
value="{{ form.display_name }}"
/>
</div>
<div class="np-form-field {% if form.errors contains 'password' %}np-account-form-field-error{% endif %}">
<label class="np-input-label password" for="{{version}}_learner_password">
{% t shared.password %} *
</label>
<input
class="np-input"
id="{{version}}_learner_password"
name="learner[password]"
type="password"
/>
</div>
{% unless form.options.invite? %}
<div class="np-form-field {% if form.errors contains 'password_confirmation' %}np-account-form-field-error{% endif %}">
<label class="np-input-label password-confirmation" for="{{version}}_learner_password_confirmation">
Confirm New Password *
</label>
<input
class="np-input"
id="{{version}}_learner_password_confirmation"
name="learner[password_confirmation]"
type="password"
/>
</div>
{% endunless %}
{% if form.options.invite? %}
<div class="np-form-field terms-of-service {% if form.errors contains 'terms_of_service_accepted' %}np-account-form-field-error{% endif %}">
<input
id="{{version}}_learner_terms_of_service"
name="learner[terms_of_service_accepted]"
type="checkbox"
/>
<div class="label">
{% t .terms_of_service %}
</div>
</div>
<input
id="{{version}}_invite_token"
name="learner[token]"
value="{{ form.invite_token }}"
type="hidden"
/>
{% endif %}

View File

@ -0,0 +1,468 @@
<style>
.np-dashboard-resources-title.lp,
.np-dashboard-resources-title.modules,
.np-dashboard-resources-title.events,
.np-zero-state-text,
.np-button.np-button-wide,
.np-footer-support-item.np-footer-support-help,
.np-card-content-progress.np-button-color.notstarted,
.np-zero-state-text.training-events,
.np-button.lp,
.sub-navigation-label:nth-child(1),
.np-resource-title.modules,
.np-resource-subtitle.modules,
.np-resource-title.lp,
.np-resource-subtitle.lp,
.np-card-header-type,
.np-resource-title.events,
.np-resource-subtitle.events,
.np-button.dropdown-button,
.np-top-vocabulary.np-text-title.np-text-muted,
.np-top-cta-progress-title.np-text-title,
.np-top-button.np-button-font-color.np-button.np-button-big,
.np-text-title.np-course-outline-title,
.np-card-heading,
.np-top-cta-progress-text.np-button-color,
.np-card-heading.lp,
.np-top-cta-progress-title.np-text-title.lp,
.np-top-vocabulary.np-text-title,
.Home.sub-navigation-label,
.Modules.sub-navigation-label,
.Events.sub-navigation-label,
.Learning.Paths.sub-navigation-label,
.Home.np-footer-navigation-link.np-button-color,
.Learning.Paths.np-footer-navigation-link.np-button-color,
.Events.np-footer-navigation-link.np-button-color,
.course-completion,
.np-header-avatar-tooltip-navigation-link,
.np-header-avatar-tooltip-navigation-link.np-danger,
.np-button.np-button-big.np-button-large-font.np-form-action,
.np-resource-title.my-profile,
.np-input-label.email,
.np-input-label.first-name,
.np-input-label.last-name,
.np-input-label.display-name,
.np-input-label.password,
.np-input-label.password-confirmation,
.avatar-description,
.avatar-requirements,
.radio__label.gravatar,
.radio__label.custom,
#desktop_upload_avatar
{
text-indent: -9999999px;
}
/* HEADER */
.np-header-avatar-tooltip-navigation-link::after {
/* Profile Settings */
text-indent: 0;
line-height: 0;
display: block;
content: "إعدادات الملف الشخصي";
}
.np-header-avatar-tooltip-navigation-link.np-danger::after {
/* Sign Out */
text-indent: 0;
line-height: 0;
display: block;
content: "خروج";
}
/* ACCOUNT */
.radio__label.gravatar::after {
/* Use Gravatar™ */
text-indent: 0;
line-height: 0;
display: block;
content: "استخدم Gravatar ™";
}
.radio__label.custom::after{
/* Upload Custom Photo */
text-indent: 0;
line-height: 0;
display: block;
content: "تحميل صورة مخصصة";
}
#desktop_upload_avatar::after {
/* Upload Photo */
text-indent: 0;
line-height: 0;
display: block;
content: "حمل الصورة";
}
.avatar-description::after {
/* Adding a photo adds a personal touch to your profile. Your profile picture is used as the icon for your account to represent you. It is also displayed in various other places next to your name. */
text-indent: 0;
line-height: auto;
display: block;
content: "تضيف إضافة صورة لمسة شخصية إلى ملفك الشخصي. تُستخدم صورة ملفك الشخصي كرمز لحسابك لتمثيلك. يتم عرضها أيضًا في أماكن أخرى مختلفة بجوار اسمك.";
}
.avatar-requirements::after {
/* For the best results, your profile picture size should be at least 400x400 pixels, and a max size of 2MB. The file format should be PNG, JPG or GIF. */
text-indent: 0;
line-height: auto;
display: block;
content: "للحصول على أفضل النتائج ، يجب أن يكون حجم صورة ملفك الشخصي 400 × 400 بكسل على الأقل ، وبحد أقصى 2 ميجا بايت. يجب أن يكون تنسيق الملف هو PNG أو JPG أو GIF.";
}
.np-button.np-button-big.np-button-large-font.np-form-action::after {
/* Save Profile */
text-indent: 0;
line-height: 0;
display: block;
content: "احفظ الملف";
}
.np-resource-title.my-profile::after {
/* My Profile */
text-indent: 0;
line-height: 1;
display: block;
content: "ملفي";
margin-bottom: 24px;
margin-top: -24px;
}
.np-input-label.email::after {
/* Email */
text-indent: 0;
line-height: 1;
display: block;
content: "بريد الالكتروني *";
}
.np-input-label.first-name::after {
/* First Name */
text-indent: 0;
line-height: 1;
display: block;
content: "اسم *";
}
.np-input-label.last-name::after {
/* Last Name */
text-indent: 0;
line-height: 1;
display: block;
content: "الكنية *";
}
.np-input-label.display-name::after {
/* Display Name */
text-indent: 0;
line-height: 1;
display: block;
content: "اسم العرض";
}
.np-input-label.password::after {
/* Password */
text-indent: 0;
line-height: 1;
display: block;
content: "كلمه السر *";
}
.np-input-label.password-confirmation::after {
/* Password Confirmation */
text-indent: 0;
line-height: 1;
display: block;
content: "تأكيد كلمة المرور *";
}
/* MAIN CONTENT */
.np-dashboard-resources-title.lp::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "مسارات التعلم";
}
.np-dashboard-resources-title.modules::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "الوحدات";
}
.np-dashboard-resources-title.events::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "الأحداث";
}
/* SUB-NAVIGATION */
.Home.sub-navigation-label::after {
/* Home */
text-indent: 0;
line-height: 0;
display: block;
content: "الصفحة الرئيسية";
margin-top: -9px;
}
.Events.sub-navigation-label::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "الأحداث";
margin-top: -9px;
}
.Modules.sub-navigation-label::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "الوحدات";
margin-top: -9px;
}
.Learning.Paths.sub-navigation-label::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "مسارات التعلم";
margin-top: -9px;
}
/* LEARNING PATHS */
.np-button.lp::after {
/* View */
text-indent: 0;
line-height: 0;
display: block;
content: "رأي";
}
.np-zero-state-text::after {
/* Bummer! You're not assigned any Learning Paths. */
text-indent: 0;
line-height: inherit;
display: block;
content: "المشكله! لم يتم تعيين أي مسارات تعلم لك.";
margin-top: -10px;
}
.np-resource-subtitle.lp::after {
/* Explore curated sets of courses for a tailored learning experience */
text-indent: 0;
line-height: 0;
display: block;
content: "استكشف مجموعات الدورات المنسقة للحصول على تجربة تعليمية مخصصة";
}
.np-card-header-type::after,
.np-resource-title.lp::after,
.np-top-vocabulary.np-text-title::after
{
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "مسارات التعلم";
}
.np-top-cta-progress-text.np-button-color::after {
/* Not started */
text-indent: 0;
line-height: 1;
display: block;
content: "لم يبدأ";
}
.np-card-heading.lp::after {
/* About This Learning Path */
text-indent: 0;
line-height: 1;
display: block;
content: "حول مسار التعلم هذا";
}
/* COURSE CARDS */
.np-button.np-button-wide::after {
/* View */
text-indent: 0;
line-height: 0;
display: block;
content: "رأي";
}
.np-card-content-progress.np-button-color.notstarted::after {
/* Not started */
text-indent: 0;
line-height: 1;
display: block;
content: "لم يبدأ";
}
.np-top-cta-progress-title.np-text-title.lp::after {
/* Learning Path Progress */
text-indent: 0;
line-height: 1;
display: block;
content: "تقدم مسار التعلم";
}
.course-completion::after {
/* Complete */
text-indent: 0;
line-height: 1;
display: block;
content: "مكتمل";
margin-top: -13px;
}
/* EVENTS */
.np-zero-state-text.training-events::after {
/* You have no upcoming Events. Check back later for updates */
text-indent: 0;
line-height: inherit;
display: block;
content: "ليس لديك أحداث قادمة. التحقق مرة أخرى في وقت لاحق للحصول على التحديثات";
margin-top: -10px;
}
.np-resource-title.events::after {
/* Training Events */
text-indent: 0;
line-height: 0;
display: block;
content: "أحداث التدريب";
}
.np-resource-subtitle.events::after {
/* Discover in-person and online events to maximize your learning */
text-indent: 0;
line-height: 0;
display: block;
content: "اكتشف الأحداث الشخصية وعبر الإنترنت لتحقيق أقصى قدر من التعلم";
}
.np-button.dropdown-button::after {
/* Filter */
text-indent: 0;
line-height: 0;
display: block;
content: "منقي";
}
/* FOOTER */
.np-footer-support-item.np-footer-support-help::after {
/* Need help? */
text-indent: 0;
line-height: 0;
display: block;
float: right;
content: "تحتاج مساعدة؟";
margin-top: 8px;
}
.Home.np-footer-navigation-link.np-button-color::after {
/* Home */
text-indent: 0;
line-height: 0;
display: block;
content: "الصفحة الرئيسية";
margin-top: -9px;
}
.Events.np-footer-navigation-link.np-button-color::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "الأحداث";
margin-top: -9px;
}
.Learning.Paths.np-footer-navigation-link.np-button-color::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "مسارات التعلم";
margin-top: -9px;
}
/* MODULES */
.np-resource-title.modules::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "الوحدات";
}
.np-resource-subtitle.modules::after {
/* Great Modules from the comfort of your home or office. */
text-indent: 0;
line-height: 0;
display: block;
content: "وحدات رائعة من راحة منزلك أو مكتبك.";
}
.np-top-vocabulary.np-text-title.np-text-muted::after {
/* Module */
text-indent: 0;
line-height: 0;
display: block;
content: "وحدة";
}
.np-top-cta-progress-title.np-text-title::after {
/* Course Progress */
text-indent: 0;
line-height: 0;
display: block;
content: "تقدم الدورة";
margin-bottom: 8px;
}
.np-top-button.np-button-font-color.np-button.np-button-big::after {
/* Continue */
text-indent: 0;
line-height: 0;
display: block;
content: "يكمل";
}
.np-text-title.np-course-outline-title::after {
/* Module outline */
text-indent: 0;
line-height: 0;
display: block;
content: "مخطط الوحدة";
}
.np-card-heading::after {
/* About the module */
text-indent: 0;
line-height: 0;
display: block;
content: "حول الوحدة";
}
</style>

View File

@ -0,0 +1,47 @@
<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="course-details">
{% if course.started? %}
<div class="np-card-content-progress np-button-color">
{{ course.progress }}% Complete
</div>
{% else %}
<div class="np-card-content-progress np-button-color notstarted">
Not started
</div>
{% endif %}
<div class="np-card-content-progress np-button-color">
{% if course.properties.course_time > 0 %}
{{course.properties.course_time}} Min
{% endif %}
</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 %}
<a class="np-button np-button-wide" href="{{ course_path }}">
{% t shared.view %}
</a>
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,112 @@
{%comment%}{% if learning_path.progress == 0%}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar red-bar"%}
{% assign wrapperClassText = "np-card-content-progress np-button-color red-text"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color red-text"%}
{% else if learning_path.progress > 0 and learning_path.progress < 100%}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar yellow-bar"%}
{% assign wrapperClassText = "np-card-content-progress np-button-color yellow-text"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color yellow-text"%}
{% else %}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar green-bar"%}
{% assign wrapperClassText = "np-card-content-progress np-button-color green-text"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color green-text"%}
{% endif %}{%endcomment%}
{% if learning_path.enrolled? %}
{% assign lp_courses_count = 0 | times: 1 %}
{% assign sum_of_progress = 0.0 | times: 1 %}
{% for item in learning_path.items %}
{% if item.course? %}
{% assign lp_courses_count = lp_courses_count | plus: 1 %}
{% assign sum_of_progress = sum_of_progress | plus: item.progress %}
{% endif %}
{% endfor %}
{% if lp_courses_count == 0 %}
{% assign lp_progress = 0 %}
{% else %}
{% assign lp_progress = sum_of_progress | divided_by: lp_courses_count | round %}
{% endif %}
{% else %}
{% assign lp_progress = 0 %}
{% endif %}
{% comment %}
{% for group in current_person.groups %}
{{group.id}}
{% endfor %} {% endcomment %}
<div class="np-card np-no-horizontal-padding">
<div class="np-card-container">
<div class="np-learning-path">
<img
alt="{{ learning_path.name }}"
class="np-card-image np-learning-path-image"
src="{{ learning_path.image_url }}"
/>
<div class="np-card-text-wrapper">
<div class="np-hidden-desktop np-card-header">
<i class="np-card-header-icon far fa-road"></i>
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
<div class="np-hidden-desktop np-card-header-items-count">
{{ learning_path.items.count }} {% t .items %}
</div>
</div>
<div class="np-hidden-mobile np-card-header">
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
<i class="np-card-header-icon far fa-road"></i>
</div>
<div class="np-card-content np-card-padding np-card-content-vertical">
<h3 class="np-card-content-title">
{{ learning_path.name }}
</h3>
<div class="np-card-content-subtitle">
{{ learning_path.instructor_names }}
</div>
<div class="np-hidden-mobile np-card-content-description">
{{ learning_path.description }}
</div>
{% if lp_progress > 0 %}
<div class="np-card-content-progress np-button-color">
<p style="margin-bottom:-25px">{{ lp_progress }}%</p> <p class="course-completion" style="margin-left:25px"><span>Complete</span></p>
</div>
{% else %}
<div class="np-card-content-progress np-button-color">
Not started
</div>
{% endif %}
<div class="np-hidden-mobile np-card-progress-bar-container">
<div
style="width: {{lp_progress}}%;"
class="np-button-background-color np-card-progress-bar">
</div>
</div>
<div class="np-card-content-footer">
<div class="np-hidden-desktop np-card-content-progress
np-button-color">
{% t shared.progress, count: lp_progress %}
</div>
<a class="np-button lp" href="{% route learning_path, id: learning_path.id %}">
{% t shared.view %}
</a>
<span class="np-hidden-mobile np-learning-path-items">
<i class="np-button-color np-learning-path-items-icon far fa-graduation-cap"></i>
<span class="np-learning-path-items-count">
{{ learning_path.items.count }} {% t .items %}
</span>
</span>
</div>
</div>
</div>
</div>
</div>
<div class="np-card-stack">
<div class="np-card-stack-level-1"></div>
<div class="np-card-stack-level-2"></div>
</div>
</div>

View File

@ -0,0 +1,11 @@
<i class="far fa-lock-alt np-course-outline-content-activity-icon-locked"></i>
{% assign activity_title = activity.title | split: ' ~ ' %}
{% if activity_title.size > 1 %}
<div class="activity-time">
{{ activity_title[1] | strip }}
</div>
{% endif %}
<span class="np-course-outline-content-activity-title">
{{ activity_title[0] | strip }}
</span>

View File

@ -0,0 +1,15 @@
{% assign activity_title = activity.title | split: '~' %}
{% if activity_title.size > 1 %}
<div class="activity-time">
{{ activity_title[1] | strip }}
</div>
{% endif %}
<a
href="{% route activity_viewer,
id: activity.id,
course_id: params.course_id,
learning_path_id: params.learning_path_id
%}" class="{{ class }}"
>
{{ activity_title[0] | strip }}
</a>

View File

@ -0,0 +1,191 @@
<script src="https://kit.fontawesome.com/41a3aee3ad.js" crossorigin="anonymous"></script>
<div class="np-course-outline">
<div class="np-text-title np-course-outline-title">
{% t .header, key: current_school.course_vocabulary %}
</div>
<div class="np-course-outline-content">
<ol class="np-course-outline-content-section">
{% for section in course.sections %}
{% comment %}<li class="np-course-outline-content-section-list">
<div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold">
{{ section.name }}
</div>
<ol class="np-course-outline-content-activity">
{% for activity in section.activities %}
<li class="np-course-outline-content-activity-list" >
{% if activity.completed? %}
<i class="fas fa-circle np-course-outline-content-activity-icon np-button-color" style="color: green; font-weight: 900"></i>
{% if activity.locked? %}
{% include "course_activity_locked" %}
{% else %}
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link-completed" %}
{% endif %}
<div class="np-course-outline-content-activity-list-bar" style="background: green"></div>
<div class="np-button-background-color np-course-outline-content-activity-list-bar" style="color: green"></div>
{% else %}
<i class="far fa-circle np-course-outline-content-activity-icon" style="color: red; font-weight: 900"></i>
{% if activity.locked? %}
{% include "course_activity_locked" %}
{% else %}
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link" %}
{% endif %}
<div class="np-course-outline-content-activity-list-bar" style="background: red"></div>
{% endif %}
</li>
{% endfor %}
</ol>
</li>{% endcomment %}
<div class="np-accordion">
<div class="accordion-btn">
<i class="fal fa-plus"></i>
<div class="accordion-title">
<div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold">
{{ section.name }}
</div>
</div>
</div>
<div class="accordion-panel">
<div class="accordion-panel-content">
<ol class="np-course-outline-content-activity">
{% for activity in section.activities %}
<li class="np-course-outline-content-activity-list" >
{% if activity.completed? %}
<i class="fas fa-circle np-course-outline-content-activity-icon np-button-color" style="color: green; font-weight: 900"></i>
{% if activity.locked? %}
{% include "course_activity_locked" %}
{% else %}
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link-completed" %}
{% endif %}
<div class="np-course-outline-content-activity-list-bar" style="background: green"></div>
{%comment%}<div class="np-button-background-color np-course-outline-content-activity-list-bar" style="color: green"></div>{%endcomment%}
{% else %}
<i class="far fa-circle np-course-outline-content-activity-icon" style="color: red; font-weight: 900"></i>
{% if activity.locked? %}
{% include "course_activity_locked" %}
{% else %}
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link" %}
{% endif %}
<div class="np-course-outline-content-activity-list-bar" style="background: red"></div>
{% endif %}
</li>
{% endfor %}
</ol>
</div>
</div>
</div>
{% endfor %}
</ol>
</div>
</div>
<script>
let accordions = document.getElementsByClassName("accordion-btn");
for (let i = 0; i < accordions.length; i++) {
accordions[i].addEventListener("click", function() {
this.querySelector('.fal').classList.toggle("fa-plus");
this.querySelector('.fal').classList.toggle("fa-minus");
let panel = this.nextElementSibling;
panel.classList.toggle("panel-open");
if (panel.style.maxHeight) {
panel.style.maxHeight = null;
} else {
panel.style.maxHeight = panel.scrollHeight + "px";
}
});
}
</script>
<style>
.np-faq {
margin-bottom: 3rem;
}
.np-accordion {
margin: 0 22px 32px;
}
.accordion-btn {
color: #000000;
cursor: pointer;
width: 100%;
min-height: 76px;
padding: 0 18px 0 92px;
text-align: left;
border: none;
outline: none;
transition: 0.4s;
position: relative;
display: flex;
align-items: center;
}
.fa-plus,
.fa-minus {
color: #000000;
font-size: 2.5rem;
position: absolute;
left: 0;
top: 0;
width: 76px;
height: 76px;
display: flex;
align-items: center;
justify-content: center;
transition: 0.4s;
}
.accordion-title,
.accordion-panel-content {
line-height: 1.375rem;
position: relative;
}
.accordion-panel-content {
padding: 18px;
}
.accordion-panel-content p {
margin-top: 0;
}
.accordion-panel-content:before {
content: "";
width: 75px;
height: 1px;
position: absolute;
top: 0;
left: 18px;
}
.accordion-panel {
max-height: 0;
overflow: hidden;
transition: max-height 0.4s ease-out;
margin-left: 76px;
}
@media (min-width: 768px) {
.np-faqs {
margin: 0 4.0625rem;
}
.np-accordion {
margin: 0 8px 32px;
}
}
</style>
<style>
.activity-time {
background: darkgrey;
padding: 4px 8px;
border-radius: 1px;
margin-right: 10px;
color: #1b1b1b;
font-weight: 600;
font-size: 1rem;
}
.np-course-outline-content-activity-link {
align-self: center;
}
</style>

View File

@ -0,0 +1,57 @@
{%comment%}{% if course.progress == 0%}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar red-bar"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color red-text"%}
{% else if course.progress > 0 and course.progress < 100%}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar yellow-bar"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color yellow-text"%}
{% else %}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar green-bar"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color green-text"%}
{% endif %}{%endcomment%}
<div class="np-top-cta-progress-content">
<div class="np-top-cta-progress-title np-text-title">
{% t .header %}
</div>
<div class="np-progress-bar-container">
<div
style="width: {{ course.progress }}%"
class="np-button-background-color np-card-progress-bar">
</div>
</div>
<div class="np-card-content-progress
{% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
">
{% t shared.progress, count: course.progress %}
</div>
</div>
{% if course.learner_can_retake? %}
<form action="{% route course_retake, id: course.id %}" method="POST">
{% form_authenticity_token %}
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
{% t .retake, key: current_school.course_vocabulary %}
</button>
</form>
{% else %}
<a
class="np-top-button np-button-font-color np-button np-button-big"
{% if course.enrolled? %}
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
{% else %}
href="{% route course_enrollment, code: course.enrollment_code %}"
{% endif %}
>
{% if course.enrolled? == false %}
{% t shared.enroll %}
{% elsif course.started? == false %}
{% t shared.course.start, key: current_school.course_vocabulary %}
{% elsif course.completed? %}
{% t shared.course.view, key: current_school.course_vocabulary %}
{% else %}
{% t shared.continue %}
{% endif %}
</a>
{% endif %}

View File

@ -0,0 +1,102 @@
<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="{{ website_navigation.name }} 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 }}"
></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">
{% comment %} {% t .email %} {% endcomment %}
Contact ATOS at:
</div>
{% comment %} <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 }}
{% endcomment %}
<a
class="np-footer-support-item np-footer-support-link np-button-color"
href="tel:18005153636" >
1-800-515-3636
</div>
{% endif %}
</div>
{% if current_person.signed_in? %}
{% if current_person.properties.language == "es" %}
{% include "spanish_lang" %}
{% elsif current_person.properties.language == "fr" %}
{% include "french_lang" %}
{% elsif current_person.properties.language == "ru" %}
{% include "russian_lang" %}
{% elsif current_person.properties.language == "ar" %}
{% include "arabic_lang" %}
{% endif %}
{% endif %}
</footer>
<style>
.np-powered-by.show {
padding-top: 10px;
}
</style>

View File

@ -0,0 +1,468 @@
<style>
.np-dashboard-resources-title.lp,
.np-dashboard-resources-title.modules,
.np-dashboard-resources-title.events,
.np-zero-state-text,
.np-button.np-button-wide,
.np-footer-support-item.np-footer-support-help,
.np-card-content-progress.np-button-color.notstarted,
.np-zero-state-text.training-events,
.np-button.lp,
.sub-navigation-label:nth-child(1),
.np-resource-title.modules,
.np-resource-subtitle.modules,
.np-resource-title.lp,
.np-resource-subtitle.lp,
.np-card-header-type,
.np-resource-title.events,
.np-resource-subtitle.events,
.np-button.dropdown-button,
.np-top-vocabulary.np-text-title.np-text-muted,
.np-top-cta-progress-title.np-text-title,
.np-top-button.np-button-font-color.np-button.np-button-big,
.np-text-title.np-course-outline-title,
.np-card-heading,
.np-top-cta-progress-text.np-button-color,
.np-card-heading.lp,
.np-top-cta-progress-title.np-text-title.lp,
.np-top-vocabulary.np-text-title,
.Home.sub-navigation-label,
.Modules.sub-navigation-label,
.Events.sub-navigation-label,
.Learning.Paths.sub-navigation-label,
.Home.np-footer-navigation-link.np-button-color,
.Learning.Paths.np-footer-navigation-link.np-button-color,
.Events.np-footer-navigation-link.np-button-color,
.course-completion,
.np-header-avatar-tooltip-navigation-link,
.np-header-avatar-tooltip-navigation-link.np-danger,
.np-button.np-button-big.np-button-large-font.np-form-action,
.np-resource-title.my-profile,
.np-input-label.email,
.np-input-label.first-name,
.np-input-label.last-name,
.np-input-label.display-name,
.np-input-label.password,
.np-input-label.password-confirmation,
.avatar-description,
.avatar-requirements,
.radio__label.gravatar,
.radio__label.custom,
#desktop_upload_avatar
{
text-indent: -9999999px;
}
/* HEADER */
.np-header-avatar-tooltip-navigation-link::after {
/* Profile Settings */
text-indent: 0;
line-height: 0;
display: block;
content: "Paramètres de profil";
}
.np-header-avatar-tooltip-navigation-link.np-danger::after {
/* Sign Out */
text-indent: 0;
line-height: 0;
display: block;
content: "Se déconnecter";
}
/* ACCOUNT */
.radio__label.gravatar::after {
/* Use Gravatar™ */
text-indent: 0;
line-height: 0;
display: block;
content: "Utiliser Gravatar™";
}
.radio__label.custom::after{
/* Upload Custom Photo */
text-indent: 0;
line-height: 0;
display: block;
content: "Télécharger une Photo Personnalisée";
}
#desktop_upload_avatar::after {
/* Upload Photo */
text-indent: 0;
line-height: 0;
display: block;
content: "Envoyer la Photo";
}
.avatar-description::after {
/* Adding a photo adds a personal touch to your profile. Your profile picture is used as the icon for your account to represent you. It is also displayed in various other places next to your name. */
text-indent: 0;
line-height: auto;
display: block;
content: "L'ajout d'une photo ajoute une touche personnelle à votre profil. Votre photo de profil est utilisée comme icône de votre compte pour vous représenter. Il est également affiché à divers autres endroits à côté de votre nom.";
}
.avatar-requirements::after {
/* For the best results, your profile picture size should be at least 400x400 pixels, and a max size of 2MB. The file format should be PNG, JPG or GIF. */
text-indent: 0;
line-height: auto;
display: block;
content: "Pour de meilleurs résultats, la taille de votre photo de profil doit être d'au moins 400 x 400 pixels et une taille maximale de 2 Mo. Le format de fichier doit être PNG, JPG ou GIF.";
}
.np-button.np-button-big.np-button-large-font.np-form-action::after {
/* Save Profile */
text-indent: 0;
line-height: 0;
display: block;
content: "Enregistrer le Profil";
}
.np-resource-title.my-profile::after {
/* My Profile */
text-indent: 0;
line-height: 1;
display: block;
content: "Mon Profil";
margin-bottom: 24px;
margin-top: -24px;
}
.np-input-label.email::after {
/* Email */
text-indent: 0;
line-height: 1;
display: block;
content: "E-mail *";
}
.np-input-label.first-name::after {
/* First Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Nom *";
}
.np-input-label.last-name::after {
/* Last Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Nom de Famille *";
}
.np-input-label.display-name::after {
/* Display Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Afficher un Nom";
}
.np-input-label.password::after {
/* Password */
text-indent: 0;
line-height: 1;
display: block;
content: "Mot de Passe *";
}
.np-input-label.password-confirmation::after {
/* Password Confirmation */
text-indent: 0;
line-height: 1;
display: block;
content: "Confirmation Mot de Passe *";
}
/* MAIN CONTENT */
.np-dashboard-resources-title.lp::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Parcours d'apprentissage";
}
.np-dashboard-resources-title.modules::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Modules";
}
.np-dashboard-resources-title.events::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Événements";
}
/* SUB-NAVIGATION */
.Home.sub-navigation-label::after {
/* Home */
text-indent: 0;
line-height: 0;
display: block;
content: "Page d'accueil";
margin-top: -9px;
}
.Events.sub-navigation-label::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Événements";
margin-top: -9px;
}
.Modules.sub-navigation-label::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Módulos";
margin-top: -9px;
}
.Learning.Paths.sub-navigation-label::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Parcours d'apprentissage";
margin-top: -9px;
}
/* LEARNING PATHS */
.np-button.lp::after {
/* View */
text-indent: 0;
line-height: 0;
display: block;
content: "Vue";
}
.np-zero-state-text::after {
/* Bummer! You're not assigned any Learning Paths. */
text-indent: 0;
line-height: inherit;
display: block;
content: "Dommage! Aucun parcours d'apprentissage ne vous est attribué.";
margin-top: -10px;
}
.np-resource-subtitle.lp::after {
/* Explore curated sets of courses for a tailored learning experience */
text-indent: 0;
line-height: 0;
display: block;
content: "Explorez des ensembles de cours organisés pour une expérience d'apprentissage sur mesure";
}
.np-card-header-type::after,
.np-resource-title.lp::after,
.np-top-vocabulary.np-text-title::after
{
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Parcours d'apprentissage";
}
.np-top-cta-progress-text.np-button-color::after {
/* Not started */
text-indent: 0;
line-height: 1;
display: block;
content: "Pas commencé";
}
.np-card-heading.lp::after {
/* About This Learning Path */
text-indent: 0;
line-height: 1;
display: block;
content: "À propos de ce parcours d'apprentissage";
}
/* COURSE CARDS */
.np-button.np-button-wide::after {
/* View */
text-indent: 0;
line-height: 0;
display: block;
content: "Vue";
}
.np-card-content-progress.np-button-color.notstarted::after {
/* Not started */
text-indent: 0;
line-height: 1;
display: block;
content: "No empezado";
}
.np-top-cta-progress-title.np-text-title.lp::after {
/* Learning Path Progress */
text-indent: 0;
line-height: 1;
display: block;
content: "Progression du parcours d'apprentissage";
}
.course-completion::after {
/* Complete */
text-indent: 0;
line-height: 1;
display: block;
content: "Compléter";
margin-top: -13px;
}
/* EVENTS */
.np-zero-state-text.training-events::after {
/* You have no upcoming Events. Check back later for updates */
text-indent: 0;
line-height: inherit;
display: block;
content: "Vous n'avez aucun événement à venir. Vérifiez plus tard pour avoir les mises à jour.";
margin-top: -10px;
}
.np-resource-title.events::after {
/* Training Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Événements de formation";
}
.np-resource-subtitle.events::after {
/* Discover in-person and online events to maximize your learning */
text-indent: 0;
line-height: 0;
display: block;
content: "Découvrez des événements en personne et en ligne pour maximiser votre apprentissage";
}
.np-button.dropdown-button::after {
/* Filter */
text-indent: 0;
line-height: 0;
display: block;
content: "Filtre";
}
/* FOOTER */
.np-footer-support-item.np-footer-support-help::after {
/* Need help? */
text-indent: 0;
line-height: 0;
display: block;
float: right;
content: "Besoin d'aide?";
margin-top: 8px;
}
.Home.np-footer-navigation-link.np-button-color::after {
/* Home */
text-indent: 0;
line-height: 0;
display: block;
content: "Page d'accueil";
margin-top: -9px;
}
.Events.np-footer-navigation-link.np-button-color::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Événements";
margin-top: -9px;
}
.Learning.Paths.np-footer-navigation-link.np-button-color::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Parcours d'apprentissage";
margin-top: -9px;
}
/* MODULES */
.np-resource-title.modules::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Modules";
}
.np-resource-subtitle.modules::after {
/* Great Modules from the comfort of your home or office. */
text-indent: 0;
line-height: 0;
display: block;
content: "Grands modules dans le confort de votre maison ou de votre bureau.";
}
.np-top-vocabulary.np-text-title.np-text-muted::after {
/* Module */
text-indent: 0;
line-height: 0;
display: block;
content: "Module";
}
.np-top-cta-progress-title.np-text-title::after {
/* Course Progress */
text-indent: 0;
line-height: 0;
display: block;
content: "Progression du cours";
margin-bottom: 8px;
}
.np-top-button.np-button-font-color.np-button.np-button-big::after {
/* Continue */
text-indent: 0;
line-height: 0;
display: block;
content: "Continuer";
}
.np-text-title.np-course-outline-title::after {
/* Module outline */
text-indent: 0;
line-height: 0;
display: block;
content: "Aperçu du module";
}
.np-card-heading::after {
/* About the module */
text-indent: 0;
line-height: 0;
display: block;
content: "À propos du module";
}
</style>

View File

@ -0,0 +1,52 @@
{% styles default %}
{% styles colors %}
{% styles custom %}
{% unless current_person.email contains "preview" %}
{% assign group_count = 0 %}
{% assign is_in_all_group = false %}
{% if current_person.signed_in? %}
{% assign groups = current_person.groups %}
{% for item in groups %}
{% assign group_count = group_count | plus: 1 %}
{% if group_count <= 1 and item.id contains 'd8b83557-aad1-4a4e-85ee-ddbde5d1e507' %}
{% assign is_in_all_group = true %}
<script>
document.addEventListener('DOMContentLoaded', function() {
console.log("{{group_count}}")
setTimeout(function() {
if (window.location.pathname !== '/app/second-login') {
window.location.replace('/app/second-login');
}
}, 1000);
});
</script>
{% endif %}
{% endfor %}
{% endif %}
{% if current_person.signed_in? %}
{% for item in current_person.groups %}
{% endfor %}
{% if current_person.groups.any? %}
{% else %}
<script>
document.addEventListener('DOMContentLoaded', function() {
setTimeout(function() {
if (window.location.pathname !== '/app/second-login') {
window.location.replace('/app/second-login');
}
}, 1000);
});
</script>
{% endif %}
{% endif %}
{% endunless %}
<script
src="https://code.jquery.com/jquery-3.5.1.min.js"
integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
crossorigin="anonymous"></script>

View File

@ -0,0 +1,316 @@
<header class="np-header np-header-color">
<div class="np-header-content">
<div class="np-hidden-desktop np-header-mobile-menu-nav">
{% if current_person.signed_in? %}
<button
data-toggle-class="np-hidden"
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color"
data-toggle-target=".np-header-mobile-avatar-menu,
.np-header-mobile-menu-content, .np-main, .np-footer"
></button>
<button
data-test="open-mobile-menu"
data-toggle-class="np-hidden"
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer"
>
<img
alt="{{ current_person.name }}"
class="np-header-avatar-image"
src="{{ current_person.avatar_url }}"
/>
</button>
{% endif %}
</div>
{% if current_school.logo_url %}
<h1 class="np-header-logo">
<a href="{% route home %}">
<img
alt="{{ current_school.name }}"
class="np-header-logo-image"
src="{{ current_school.logo_url }}"
/>
</a>
</h1>
{% else %}
<a href="{% route home %}" class="np-school-name np-header-font-color">
{{ current_school.name }}
</a>
{% endif %}
<div class="np-hidden-mobile np-header-desktop-nav">
<ul class="np-header-desktop-nav-list">
{% for website_navigation in navigations.header_navigations_external %}
<li class= "np-header-desktop-nav-item">
<a
href="{{ website_navigation.path }}"
class="np-header-desktop-nav-link np-header-font-color"
target="_blank"
>
{{ website_navigation.name }}
</a>
</li>
{% endfor %}
</ul>
</div>
{% if current_person.signed_in? %}
{% assign current_language = "English" %}
{% if current_person.properties.language == "en" %}
{% assign current_language = "English" %}
{% elsif current_person.properties.language == "ru" %}
{% assign current_language = "Pусский" %}
{% elsif current_person.properties.language == "ar" %}
{% assign current_language = "عربي" %}
{% elsif current_person.properties.language == "fr" %}
{% assign current_language = "Français" %}
{% elsif current_person.properties.language == "es" %}
{% assign current_language = "Español" %}
{% endif %}
<div class="dropdown">
<button onclick="myFunction()" class="dropbtn">{{current_language | upcase}}<i class="fas fa-arrow-alt-down" style="padding-left:5px"></i></button>
<div id="myDropdown" class="dropdown-content">
<a onclick="setLang('es')">Español</a>
<hr class="divider">
<a onclick="setLang('en')">English</a>
<!--<hr class="divider">
<a onclick="setLang('fr')">Français</a>
<hr class="divider">
<a onclick="setLang('ru')">Pусский</a>
<hr class="divider">
<a onclick="setLang('ar')">عربي</a>-->
</div>
</div>
{% endif %}
{% 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"
href="{% route login %}"
>
{% t shared.sign_in %}
</div>
{% endif %}
</div>
</header>
<div class="np-hidden-desktop">
<div class="np-header-mobile-menu-content np-hidden">
{% if current_person.signed_in? %}
<img
alt="{{ current_person.name }}"
class="np-header-mobile-menu-content-avatar"
src="{{ current_person.avatar_url }}"
/>
<div class="np-header-mobile-menu-content-name">
{{ current_person.name }}
</div>
{% endif %}
<div class="np-header-mobile-menu-content-nav">
<form
class="np-header-search"
data-test="mobile-search"
method="get"
action="{% route search %}"
>
<input
aria-label="{% t .search %}"
class="np-header-search-input"
type="text"
name="q"
placeholder="{% t .search %}"
/>
<i class="np-header-search-icon far fa-search"></i>
</form>
{% for website_navigation in navigations.header_navigations %}
<a
href="{{ website_navigation.path }}"
class="np-header-mobile-menu-content-button"
{% if website_navigation.external? %} target="_blank" {% endif %}
>
{{ website_navigation.name }}
</a>
{% endfor %}
<div class="np-header-mobile-menu-content-line"></div>
{% unless current_school.sso_active? %}
<a
class="np-header-mobile-menu-content-button"
href="{% route account %}"
>
{% t .profile_settings %}
</a>
{% endunless %}
<a
class="np-header-mobile-menu-content-button np-danger"
href="{% route logout %}"
>
{% t .sign_out %}
</a>
</div>
</div>
</div>
{% include "messages" %}
{% if current_person.signed_in? %}
{% assign lang = current_person.properties.language %}
{% case lang %}
{% when "Spanish" %}
{% include "spanish_lang" %}
{% endcase %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
function setLang(lang) {
var data = {
uuid : '{{current_person.id}}',
language : lang
};
$.ajax({
type : 'POST',
url : 'https://hooks.zapier.com/hooks/catch/9725311/bt60dir/', //zapier link
data: JSON.stringify(data),
success:function (data) {
console.log(data);
setTimeout(location.reload.bind(location), 700);
},
error: function(xhr, status, error) {
console.log(error)
}
});
}
/* When the user clicks on the button,
toggle between hiding and showing the dropdown content */
function myFunction() {
document.getElementById("myDropdown").classList.toggle("show");
}
// Close the dropdown if the user clicks outside of it
window.onclick = function(event) {
if (!event.target.matches('.dropbtn')) {
var dropdowns = document.getElementsByClassName("dropdown-content");
var i;
for (i = 0; i < dropdowns.length; i++) {
var openDropdown = dropdowns[i];
if (openDropdown.classList.contains('show')) {
openDropdown.classList.remove('show');
}
}
}
}
</script>
{% endif %}
<style>
.hr.divider {
border-top: 4px solid black;
border-radius: 5px;
}
.dropbtn {
background-color: white;
color: #0088dd;
padding: 13px;
font-size: 16px;
min-width: 160px;
border: none;
cursor: pointer;
margin-right: 20px;
border-radius: 5px;
max-height: 44px;
font-weight: 500;
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
text-align: center;
display: none;
position: absolute;
background-color: white;
min-width: 160px;
overflow: auto;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1000;
border-radius: 4px;
font-weight: 500;
}
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown a:hover {
color: #0088dd;
font-weight: 600;
cursor: pointer;
}
.show {display: block;}
</style>

View File

@ -0,0 +1,6 @@
<h3 class="np-card-heading lp">
{% t .about %}
</h3>
<div class="np-card-text">
{{ learning_path.description }}
</div>

View File

@ -0,0 +1,49 @@
{%comment%}{% if learning_path.progress == 0%}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar red-bar"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color red-text"%}
{% else if learning_path.progress > 0 and learning_path.progress < 100%}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar yellow-bar"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color yellow-text"%}
{% else %}
{% assign wrapperClassBar = "np-button-background-color np-card-progress-bar green-bar"%}
{% assign wrapperClassStatus = "np-card-content-progress np-button-color green-text"%}
{% endif %}{%endcomment%}
{% if learning_path.enrolled? %}
{% assign lp_courses_count = 0 | times: 1 %}
{% assign sum_of_progress = 0.0 | times: 1 %}
{% for item in learning_path.items %}
{% if item.course? %}
{% assign lp_courses_count = lp_courses_count | plus: 1 %}
{% assign sum_of_progress = sum_of_progress | plus: item.progress %}
{% endif %}
{% endfor %}
{% if lp_courses_count == 0 %}
{% assign lp_progress = 0 %}
{% else %}
{% assign lp_progress = sum_of_progress | divided_by: lp_courses_count | round %}
{% endif %}
{% else %}
{% assign lp_progress = 0 %}
{% endif %}
{% if learning_path.enrolled? %}
<div class="np-top-cta-progress-content">
<div class="np-top-cta-progress-title np-text-title lp">
{% t .progress %}
</div>
<div class="np-progress-bar-container">
<div
style="width: {{ lp_progress }}%"
class="np-button-background-color np-card-progress-bar">
</div>
</div>
<div class="np-card-content-progress
{% if learning_path.completed? %} np-color-success {% else %} np-button-color {% endif %}
">
{% t shared.progress, count: lp_progress %}
</div>
</div>
{% endif %}
{% learning_path_next_step_button learning_path, class: "np-top-button np-button-font-color np-button np-button-big" %}

View File

@ -0,0 +1,55 @@
{% assign swapped_groups = 'd1cc8cb4-fc5b-48b3-8e85-2f4faaf982dd, 0ecc1170-5761-4b5b-9047-5992232ceff4, 172784c9-7c26-4ffd-891f-4dbe8fda324f, 13765f3c-f1ee-4196-b846-1f07f63b3b64, c2caaef8-bebf-46b7-857b-79934a667495, 33842d33-6e9d-4dd6-a07c-49f2ce62b752, 011e1a52-beeb-4369-b030-a9ee3a0efe21, 216f8729-c6c6-4708-ad2c-fc732ef2d505, c1862cc1-a933-42bd-81cc-ebab4ec8d3d2' %}
{% assign is_in_group = false %}
{% for group in current_person.groups %}
{% if swapped_groups contains group.id %}
{% assign is_in_group = true %}
{% break %}
{% endif %}
{% endfor %}
{% if is_in_group%}
<div class="np-learning-paths-resources">
{% if items.any? %}
{% for learning_path in items %}
{% if learning_path.name contains "Workforce"%}
{% include "cards_learning_path" with learning_path %}
{% endif %}
{% endfor %}
{% for learning_path in items %}
{% if learning_path.name contains "CoreHR"%}
{% include "cards_learning_path" with learning_path %}
{% endif %}
{% endfor %}
{% for learning_path in items %}
{% unless learning_path.name contains "CoreHR"%}
{% unless learning_path.name contains "Workforce"%}
{% include "cards_learning_path" with learning_path %}
{% endunless%}
{% endunless %}
{% endfor %}
{% else %}
<div class="np-learning-paths-resources-container">
<div class="np-zero-state-text">
{% t .empty %}
</div>
<img class="np-zero-state-learning-paths" alt="{% t .empty %}" />
</div>
{% endif %}
</div>
{%else%}
<div class="np-learning-paths-resources">
{% if items.any? %}
{% for learning_path in items %}
{% include "cards_learning_path" with learning_path %}
{% endfor %}
{% else %}
<div class="np-learning-paths-resources-container">
<div class="np-zero-state-text">
{% t .empty %}
</div>
<img class="np-zero-state-learning-paths" alt="{% t .empty %}" />
</div>
{% endif %}
</div>
{% endif %}

View File

@ -0,0 +1,29 @@
{% if current_person.properties.company == "McDonalds" %}
<style>
.np-header-color {
background: #DE352A;
}
*[class^="np-button"]:not(i),
.np-sub-navigation-content-item-bar {
background-color: #DE352A;
}
.np-button-color {
color: #DE352A;
}
.np-button:hover {
background-color: #F9BB30;
}
.np-button, .np-button-background-color {
background-color: #DE352A;
}
.dropbtn
{
background-color: #F9BB30;
color: #DE352A;
}
</style>
<script>
document.getElementsByClassName("np-footer-logo-image")[0].src = "https://s3.amazonaws.com/static.northpass.com/Harri/lockup-mcdonalds.png"
document.getElementsByClassName("np-header-logo-image")[0].src = "https://s3.amazonaws.com/static.northpass.com/Harri/lockup-mcdonalds.png"
</script>
{% endif %}

View File

@ -0,0 +1,468 @@
<style>
.np-dashboard-resources-title.lp,
.np-dashboard-resources-title.modules,
.np-dashboard-resources-title.events,
.np-zero-state-text,
.np-button.np-button-wide,
.np-footer-support-item.np-footer-support-help,
.np-card-content-progress.np-button-color.notstarted,
.np-zero-state-text.training-events,
.np-button.lp,
.sub-navigation-label:nth-child(1),
.np-resource-title.modules,
.np-resource-subtitle.modules,
.np-resource-title.lp,
.np-resource-subtitle.lp,
.np-card-header-type,
.np-resource-title.events,
.np-resource-subtitle.events,
.np-button.dropdown-button,
.np-top-vocabulary.np-text-title.np-text-muted,
.np-top-cta-progress-title.np-text-title,
.np-top-button.np-button-font-color.np-button.np-button-big,
.np-text-title.np-course-outline-title,
.np-card-heading,
.np-top-cta-progress-text.np-button-color,
.np-card-heading.lp,
.np-top-cta-progress-title.np-text-title.lp,
.np-top-vocabulary.np-text-title,
.Home.sub-navigation-label,
.Modules.sub-navigation-label,
.Events.sub-navigation-label,
.Learning.Paths.sub-navigation-label,
.Home.np-footer-navigation-link.np-button-color,
.Learning.Paths.np-footer-navigation-link.np-button-color,
.Events.np-footer-navigation-link.np-button-color,
.course-completion,
.np-header-avatar-tooltip-navigation-link,
.np-header-avatar-tooltip-navigation-link.np-danger,
.np-button.np-button-big.np-button-large-font.np-form-action,
.np-resource-title.my-profile,
.np-input-label.email,
.np-input-label.first-name,
.np-input-label.last-name,
.np-input-label.display-name,
.np-input-label.password,
.np-input-label.password-confirmation,
.avatar-description,
.avatar-requirements,
.radio__label.gravatar,
.radio__label.custom,
#desktop_upload_avatar
{
text-indent: -9999999px;
}
/* HEADER */
.np-header-avatar-tooltip-navigation-link::after {
/* Profile Settings */
text-indent: 0;
line-height: 0;
display: block;
content: "Настройки профиля";
}
.np-header-avatar-tooltip-navigation-link.np-danger::after {
/* Sign Out */
text-indent: 0;
line-height: 0;
display: block;
content: "Выход";
}
/* ACCOUNT */
.radio__label.gravatar::after {
/* Use Gravatar™ */
text-indent: 0;
line-height: 0;
display: block;
content: "Используйте Gravatar™";
}
.radio__label.custom::after{
/* Upload Custom Photo */
text-indent: 0;
line-height: 0;
display: block;
content: "Загрузить собственное фото";
}
#desktop_upload_avatar::after {
/* Upload Photo */
text-indent: 0;
line-height: 0;
display: block;
content: "Загрузить фото";
}
.avatar-description::after {
/* Adding a photo adds a personal touch to your profile. Your profile picture is used as the icon for your account to represent you. It is also displayed in various other places next to your name. */
text-indent: 0;
line-height: auto;
display: block;
content: "Добавление фотографии добавляет индивидуальности вашему профилю. Изображение вашего профиля используется в качестве значка вашей учетной записи, чтобы представлять вас. Он также отображается в различных других местах рядом с вашим именем.";
}
.avatar-requirements::after {
/* For the best results, your profile picture size should be at least 400x400 pixels, and a max size of 2MB. The file format should be PNG, JPG or GIF. */
text-indent: 0;
line-height: auto;
display: block;
content: "Для достижения наилучших результатов размер изображения вашего профиля должен быть не менее 400x400 пикселей, а максимальный - 2 МБ. Формат файла должен быть PNG, JPG или GIF.";
}
.np-button.np-button-big.np-button-large-font.np-form-action::after {
/* Save Profile */
text-indent: 0;
line-height: 0;
display: block;
content: "Сохранить профиль";
}
.np-resource-title.my-profile::after {
/* My Profile */
text-indent: 0;
line-height: 1;
display: block;
content: "Мой профайл";
margin-bottom: 24px;
margin-top: -24px;
}
.np-input-label.email::after {
/* Email */
text-indent: 0;
line-height: 1;
display: block;
content: "Эл. адрес *";
}
.np-input-label.first-name::after {
/* First Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Имя *";
}
.np-input-label.last-name::after {
/* Last Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Фамилия *";
}
.np-input-label.display-name::after {
/* Display Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Отображаемое имя";
}
.np-input-label.password::after {
/* Password */
text-indent: 0;
line-height: 1;
display: block;
content: "Пароль *";
}
.np-input-label.password-confirmation::after {
/* Password Confirmation */
text-indent: 0;
line-height: 1;
display: block;
content: "Подтверждение пароля *";
}
/* MAIN CONTENT */
.np-dashboard-resources-title.lp::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Пути обучения";
}
.np-dashboard-resources-title.modules::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Модули";
}
.np-dashboard-resources-title.events::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "События";
}
/* SUB-NAVIGATION */
.Home.sub-navigation-label::after {
/* Home */
text-indent: 0;
line-height: 0;
display: block;
content: "Дом";
margin-top: -9px;
}
.Events.sub-navigation-label::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "События";
margin-top: -9px;
}
.Modules.sub-navigation-label::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Модули";
margin-top: -9px;
}
.Learning.Paths.sub-navigation-label::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Пути обучения";
margin-top: -9px;
}
/* LEARNING PATHS */
.np-button.lp::after {
/* View */
text-indent: 0;
line-height: 0;
display: block;
content: "Вид";
}
.np-zero-state-text::after {
/* Bummer! You're not assigned any Learning Paths. */
text-indent: 0;
line-height: inherit;
display: block;
content: "Облом! Вам не назначены пути обучения.";
margin-top: -10px;
}
.np-resource-subtitle.lp::after {
/* Explore curated sets of courses for a tailored learning experience */
text-indent: 0;
line-height: 0;
display: block;
content: "Изучите специально подобранные наборы курсов для индивидуального обучения";
}
.np-card-header-type::after,
.np-resource-title.lp::after,
.np-top-vocabulary.np-text-title::after
{
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Пути обучения";
}
.np-top-cta-progress-text.np-button-color::after {
/* Not started */
text-indent: 0;
line-height: 1;
display: block;
content: "Не начался";
}
.np-card-heading.lp::after {
/* About This Learning Path */
text-indent: 0;
line-height: 1;
display: block;
content: "Об этом пути обучения";
}
/* COURSE CARDS */
.np-button.np-button-wide::after {
/* View */
text-indent: 0;
line-height: 0;
display: block;
content: "Вид";
}
.np-card-content-progress.np-button-color.notstarted::after {
/* Not started */
text-indent: 0;
line-height: 1;
display: block;
content: "Не начался";
}
.np-top-cta-progress-title.np-text-title.lp::after {
/* Learning Path Progress */
text-indent: 0;
line-height: 1;
display: block;
content: "Прогресс по пути обучения";
}
.course-completion::after {
/* Complete */
text-indent: 0;
line-height: 1;
display: block;
content: "Полный";
margin-top: -13px;
}
/* EVENTS */
.np-zero-state-text.training-events::after {
/* You have no upcoming Events. Check back later for updates */
text-indent: 0;
line-height: inherit;
display: block;
content: "У вас нет предстоящих событий. Проверяйте обновления позже.";
margin-top: -10px;
}
.np-resource-title.events::after {
/* Training Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Тренировочные мероприятия";
}
.np-resource-subtitle.events::after {
/* Discover in-person and online events to maximize your learning */
text-indent: 0;
line-height: 0;
display: block;
content: "Откройте для себя личные и онлайн-мероприятия, чтобы максимизировать свое обучение";
}
.np-button.dropdown-button::after {
/* Filter */
text-indent: 0;
line-height: 0;
display: block;
content: "Фильтр";
}
/* FOOTER */
.np-footer-support-item.np-footer-support-help::after {
/* Need help? */
text-indent: 0;
line-height: 0;
display: block;
float: right;
content: "Нужна помощь?";
margin-top: 8px;
}
.Home.np-footer-navigation-link.np-button-color::after {
/* Home */
text-indent: 0;
line-height: 0;
display: block;
content: "События";
margin-top: -9px;
}
.Events.np-footer-navigation-link.np-button-color::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "События";
margin-top: -9px;
}
.Learning.Paths.np-footer-navigation-link.np-button-color::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Пути обучения";
margin-top: -9px;
}
/* MODULES */
.np-resource-title.modules::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Модули";
}
.np-resource-subtitle.modules::after {
/* Great Modules from the comfort of your home or office. */
text-indent: 0;
line-height: 0;
display: block;
content: "Отличные модули, не выходя из дома или офиса.";
}
.np-top-vocabulary.np-text-title.np-text-muted::after {
/* Module */
text-indent: 0;
line-height: 0;
display: block;
content: "Модуль";
}
.np-top-cta-progress-title.np-text-title::after {
/* Course Progress */
text-indent: 0;
line-height: 0;
display: block;
content: "Прогресс курса";
margin-bottom: 8px;
}
.np-top-button.np-button-font-color.np-button.np-button-big::after {
/* Continue */
text-indent: 0;
line-height: 0;
display: block;
content: "Продолжать";
}
.np-text-title.np-course-outline-title::after {
/* Module outline */
text-indent: 0;
line-height: 0;
display: block;
content: "Схема модуля";
}
.np-card-heading::after {
/* About the module */
text-indent: 0;
line-height: 0;
display: block;
content: "О модуле";
}
</style>

View File

@ -0,0 +1,468 @@
<style>
.np-dashboard-resources-title.lp,
.np-dashboard-resources-title.modules,
.np-dashboard-resources-title.events,
.np-zero-state-text,
.np-button.np-button-wide,
.np-footer-support-item.np-footer-support-help,
.np-card-content-progress.np-button-color.notstarted,
.np-zero-state-text.training-events,
.np-button.lp,
.sub-navigation-label:nth-child(1),
.np-resource-title.modules,
.np-resource-subtitle.modules,
.np-resource-title.lp,
.np-resource-subtitle.lp,
.np-card-header-type,
.np-resource-title.events,
.np-resource-subtitle.events,
.np-button.dropdown-button,
.np-top-vocabulary.np-text-title.np-text-muted,
.np-top-cta-progress-title.np-text-title,
.np-top-button.np-button-font-color.np-button.np-button-big,
.np-text-title.np-course-outline-title,
.np-card-heading,
.np-top-cta-progress-text.np-button-color,
.np-card-heading.lp,
.np-top-cta-progress-title.np-text-title.lp,
.np-top-vocabulary.np-text-title,
.Home.sub-navigation-label,
.Modules.sub-navigation-label,
.Events.sub-navigation-label,
.Learning.Paths.sub-navigation-label,
.Home.np-footer-navigation-link.np-button-color,
.Learning.Paths.np-footer-navigation-link.np-button-color,
.Events.np-footer-navigation-link.np-button-color,
.course-completion,
.np-header-avatar-tooltip-navigation-link,
.np-header-avatar-tooltip-navigation-link.np-danger,
.np-button.np-button-big.np-button-large-font.np-form-action,
.np-resource-title.my-profile,
.np-input-label.email,
.np-input-label.first-name,
.np-input-label.last-name,
.np-input-label.display-name,
.np-input-label.password,
.np-input-label.password-confirmation,
.avatar-description,
.avatar-requirements,
.radio__label.gravatar,
.radio__label.custom,
#desktop_upload_avatar
{
text-indent: -9999999px;
}
/* HEADER */
.np-header-avatar-tooltip-navigation-link::after {
/* Profile Settings */
text-indent: 0;
line-height: 0;
display: block;
content: "Configuración de Perfil";
}
.np-header-avatar-tooltip-navigation-link.np-danger::after {
/* Sign Out */
text-indent: 0;
line-height: 0;
display: block;
content: "Desconectar";
}
/* ACCOUNT */
.radio__label.gravatar::after {
/* Use Gravatar™ */
text-indent: 0;
line-height: 0;
display: block;
content: "Utilice Gravatar™";
}
.radio__label.custom::after{
/* Upload Custom Photo */
text-indent: 0;
line-height: 0;
display: block;
content: "Subir Foto Personalizada";
}
#desktop_upload_avatar::after {
/* Upload Photo */
text-indent: 0;
line-height: 0;
display: block;
content: "Subir Foto";
}
.avatar-description::after {
/* Adding a photo adds a personal touch to your profile. Your profile picture is used as the icon for your account to represent you. It is also displayed in various other places next to your name. */
text-indent: 0;
line-height: auto;
display: block;
content: "Agregar una foto agrega un toque personal a su perfil. Su foto de perfil se utiliza como icono de su cuenta para representarlo. También se muestra en varios otros lugares junto a su nombre.";
}
.avatar-requirements::after {
/* For the best results, your profile picture size should be at least 400x400 pixels, and a max size of 2MB. The file format should be PNG, JPG or GIF. */
text-indent: 0;
line-height: auto;
display: block;
content: "Para obtener los mejores resultados, el tamaño de la imagen de su perfil debe ser de al menos 400x400 píxeles y un tamaño máximo de 2 MB. El formato de archivo debe ser PNG, JPG o GIF.";
}
.np-button.np-button-big.np-button-large-font.np-form-action::after {
/* Save Profile */
text-indent: 0;
line-height: 0;
display: block;
content: "Guardar Perfil";
}
.np-resource-title.my-profile::after {
/* My Profile */
text-indent: 0;
line-height: 1;
display: block;
content: "Mi Perfil";
margin-bottom: 24px;
margin-top: -24px;
}
.np-input-label.email::after {
/* Email */
text-indent: 0;
line-height: 1;
display: block;
content: "Email *";
}
.np-input-label.first-name::after {
/* First Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Nombre *";
}
.np-input-label.last-name::after {
/* Last Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Apellido *";
}
.np-input-label.display-name::after {
/* Display Name */
text-indent: 0;
line-height: 1;
display: block;
content: "Nombre para mostrar";
}
.np-input-label.password::after {
/* Password */
text-indent: 0;
line-height: 1;
display: block;
content: "Contraseña *";
}
.np-input-label.password-confirmation::after {
/* Password Confirmation */
text-indent: 0;
line-height: 1;
display: block;
content: "Confirmación de Contraseña *";
}
/* MAIN CONTENT */
.np-dashboard-resources-title.lp::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Mis rutas";
}
.np-dashboard-resources-title.modules::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Módulos";
}
.np-dashboard-resources-title.events::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Próximos Eventos";
}
/* SUB-NAVIGATION */
.Home.sub-navigation-label::after {
/* Home */
text-indent: 0;
line-height: 0;
display: block;
content: "Página de Inicio";
margin-top: -9px;
}
.Events.sub-navigation-label::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Próximos Eventos";
margin-top: -9px;
}
.Modules.sub-navigation-label::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Módulos";
margin-top: -9px;
}
.Learning.Paths.sub-navigation-label::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Mis Rutas";
margin-top: -9px;
}
/* LEARNING PATHS */
.np-button.lp::after {
/* View */
text-indent: 0;
line-height: 0;
display: block;
content: "Ver";
}
.np-zero-state-text::after {
/* Bummer! You're not assigned any Learning Paths. */
text-indent: 0;
line-height: inherit;
display: block;
content: "¡Gorrón! No se le asignó ninguna ruta de aprendizaje.";
margin-top: -10px;
}
.np-resource-subtitle.lp::after {
/* Explore curated sets of courses for a tailored learning experience */
text-indent: 0;
line-height: 0;
display: block;
content: "Explore conjuntos de cursos seleccionados para una experiencia de aprendizaje personalizada";
}
.np-card-header-type::after,
.np-resource-title.lp::after,
.np-top-vocabulary.np-text-title::after
{
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Mis rutas";
}
.np-top-cta-progress-text.np-button-color::after {
/* Not started */
text-indent: 0;
line-height: 1;
display: block;
content: "No empezado";
}
.np-card-heading.lp::after {
/* About This Learning Path */
text-indent: 0;
line-height: 1;
display: block;
content: "Acerca de esta ruta de aprendizaje";
}
/* COURSE CARDS */
.np-button.np-button-wide::after {
/* View */
text-indent: 0;
line-height: 0;
display: block;
content: "Ver";
}
.np-card-content-progress.np-button-color.notstarted::after {
/* Not started */
text-indent: 0;
line-height: 1;
display: block;
content: "No empezado";
}
.np-top-cta-progress-title.np-text-title.lp::after {
/* Learning Path Progress */
text-indent: 0;
line-height: 1;
display: block;
content: "Progreso de la ruta de aprendizaje";
}
.course-completion::after {
/* Complete */
text-indent: 0;
line-height: 1;
display: block;
content: "Completo";
margin-top: -13px;
}
/* EVENTS */
.np-zero-state-text.training-events::after {
/* You have no upcoming Events. Check back later for updates */
text-indent: 0;
line-height: inherit;
display: block;
content: "No tienes eventos próximos. Vuelve más tarde para ver las actualizaciones.";
margin-top: -10px;
}
.np-resource-title.events::after {
/* Training Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Eventos de formación";
}
.np-resource-subtitle.events::after {
/* Discover in-person and online events to maximize your learning */
text-indent: 0;
line-height: 0;
display: block;
content: "Descubra eventos en persona y en línea para maximizar su aprendizaje";
}
.np-button.dropdown-button::after {
/* Filter */
text-indent: 0;
line-height: 0;
display: block;
content: "Filtrar";
}
/* FOOTER */
.np-footer-support-item.np-footer-support-help::after {
/* Need help? */
text-indent: 0;
line-height: 0;
display: block;
float: right;
content: "¿Necesitas ayuda?";
margin-top: 8px;
}
.Home.np-footer-navigation-link.np-button-color::after {
/* Home */
text-indent: 0;
line-height: 0;
display: block;
content: "Página de Inicio";
margin-top: -9px;
}
.Events.np-footer-navigation-link.np-button-color::after {
/* Events */
text-indent: 0;
line-height: 0;
display: block;
content: "Próximos Eventos";
margin-top: -9px;
}
.Learning.Paths.np-footer-navigation-link.np-button-color::after {
/* Learning Paths */
text-indent: 0;
line-height: 0;
display: block;
content: "Mis Rutas";
margin-top: -9px;
}
/* MODULES */
.np-resource-title.modules::after {
/* Modules */
text-indent: 0;
line-height: 0;
display: block;
content: "Módulos";
}
.np-resource-subtitle.modules::after {
/* Great Modules from the comfort of your home or office. */
text-indent: 0;
line-height: 0;
display: block;
content: "Grandes módulos desde la comodidad de su hogar u oficina.";
}
.np-top-vocabulary.np-text-title.np-text-muted::after {
/* Module */
text-indent: 0;
line-height: 0;
display: block;
content: "Módulo";
}
.np-top-cta-progress-title.np-text-title::after {
/* Course Progress */
text-indent: 0;
line-height: 0;
display: block;
content: "Progreso del curso";
margin-bottom: 8px;
}
.np-top-button.np-button-font-color.np-button.np-button-big::after {
/* Continue */
text-indent: 0;
line-height: 0;
display: block;
content: "Continuar";
}
.np-text-title.np-course-outline-title::after {
/* Module outline */
text-indent: 0;
line-height: 0;
display: block;
content: "Esquema del módulo";
}
.np-card-heading::after {
/* About the module */
text-indent: 0;
line-height: 0;
display: block;
content: "Sobre el modulo";
}
</style>

View File

@ -0,0 +1,13 @@
<nav class="np-sub-navigation">
<div class="np-sub-navigation-content">
{% for link in navigations.sub_navigation %}
<div class="np-sub-navigation-content-item {{ link.active_class }}">
<a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
<i class="{{ link.icon }} np-button-color np-sub-navigation-content-item-icon"></i>
<p class="{{ link.label }} sub-navigation-label" style="margin-top:0px;"> {{ link.label }} </p>
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
{% endfor %}
</div>
</nav>

View File

@ -0,0 +1,9 @@
<div class="np-dashboard-resources-container">
<div class="np-zero-state-text training-events">
{% t .empty %}
</div>
<img
class="np-zero-state-training-events"
alt="{% t .empty %}"
/>
</div>

View File

@ -0,0 +1,60 @@
<main class="np-box-container np-open-access sign-up">
<div class="np-box">
{% include "header_minimal" %}
<div class="np-box-content-container">
<form class="np-form np-box-content" action="{{ form.url }}" method="get" novalidate>
{% form_authenticity_token %}
<div class="np-form-headline">
{% t shared.welcome_to_school, school_name: current_school.name %}
</div>
<div class="np-form-subheadline">
{% t .headline, key: current_school.course_vocabulary %}
</div>
<div class="np-form-field">
<label class="np-input-label" for="learner_first_name">
{% t shared.first_name %}
</label>
<input
class="np-input"
autofocus="autofocus"
type="text"
name="first_name"
id="learner_first_name"
value="{{ form.first_name }}"
/>
</div>
<div class="np-form-field">
<label class="np-input-label" for="learner_last_name">
{% t shared.last_name %}
</label>
<input
class="np-input"
type="text"
name="last_name"
id="learner_last_name"
value="{{ form.last_name }}"
/>
</div>
<div class="np-form-field">
<label class="np-input-label" for="learner_email">
Harri {% t shared.email_address %} <br>(Please enter the email address that you use, or
plan to use, to access your Harri account.)
</label>
<input
class="np-input"
type="text"
name="email"
id="learner_email"
value="{{ form.email }}"
/>
</div>
<input
type="submit"
name="commit"
value="{% t shared.enter %}"
class="np-button np-button-big np-form-action"
/>
</form>
</div>
</div>
</main>

View File

@ -0,0 +1,16 @@
<script>
if (document.referrer.length == 0) {
window.location.replace('/app')
}
</script>
{% include "header" %}
{% include "course_version_outdated_alert", courses: courses.enrolled %}
{% include "sub_navigation" %}
<main class="np-main np-courses np-subpage-container np-max-width">
<div class="np-resource-title modules">
{% t shared.course_vocabulary.plural, key: current_school.course_vocabulary %}
</div>
<div class="np-resource-subtitle modules">{% t .headline, key: current_school.course_vocabulary %}</div>
{% include "courses_index", class: "col-xs-12 col-sm-6 col-lg-4 np-stretch-content" %}
</main>
{% include "footer" %}

View File

@ -0,0 +1,28 @@
{% include "header" %}
{% 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 lp">
{% t shared.learning_paths %}
</div>
{% include "learning_paths_index", items: learning_paths.enrolled %}
{% endif %}
<div class="np-dashboard-resources-title modules">
{% 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 events">
{% t .upcoming_events %}
</div>
{% include "training_events_dashboard" %}
</div>
{% endif %}
</div>
</main>
{% include "footer" %}

View File

@ -0,0 +1,14 @@
{% include "header" %}
{% include "sub_navigation" %}
<main class="np-main np-learning-paths np-subpage-container np-max-width">
<div class="np-learning-paths-main">
<div class="np-resource-title lp">
{% t shared.learning_paths %}
</div>
<div class="np-resource-subtitle lp">
{% t .subtitle %}
</div>
{% include "learning_paths_index", items: learning_paths.available %}
</div>
</main>
{% include "footer" %}

View File

@ -0,0 +1,5 @@
{% body %}
{% if current_person.signed_in? %}
{% include "mcdonalds_theme" %}
{% endif %}

View File

@ -0,0 +1,341 @@
{% assign group_count = 0 %}
{% assign groups = current_person.groups %}
{% for item in groups %}
{% assign group_count = group_count | plus: 1 %}
{% if group_count >= 2 and item.id contains 'd8b83557-aad1-4a4e-85ee-ddbde5d1e507'%}
<script>
document.addEventListener('DOMContentLoaded', function() {
setTimeout(function() {
if (window.location.pathname == '/app/second-login') {
window.location.replace('/app');
}
}, 1000);
});
</script>
{% endif %}
{% endfor %}
{% include "header" %}
<main class="np-main np-box-container">
<div class="np-box">
<div class="np-box-content-container">
<form id="register-form" class="np-form np-box-content" novalidate>
<div class="np-form-title text-center"> Welcome! </div>
<div class="np-form-subtitle"> Please choose the option that best matches your current role to enroll in the
appropriate learning path. </div>
{% form_authenticity_token %}
<div class="np-form-field">
<label class="np-input-label" for="learner_role">
</label>
<select
class="np-input"
type="text"
name="learner[role]"
id="learner_role"
required
>
<option class="default-option" disabled selected id="default-option">Your role</option>
<option value="General Manager">General Manager</option>
<option value="Kitchen Manager">Kitchen Manager</option>
<option value="People Manager">People Manager</option>
<option value="Guest Services Manager">Guest Services Manager</option>
<option value="Swing/Shift Manager">Swing/Shift Manager</option>
<option value="Manager Trainees">Manager Trainees</option>
<option value="Supervisor">Supervisor</option>
<option value="Supervisor/Role Assigment">Supervisor w/Role Assignment</option>
<option value="Org Admin">Org Admin/Back Office Admin</option>
<option value="Owner Operator">Owner/Operator</option>
<option value="Crew Trainer">Crew Trainer</option>
<option value="Corporate/Field Staff">McDonalds Corporate/Field Staff</option>
</select>
</div>
<div class="np-form-subtitle">Please provide your store number</div>
<div class="np-form-field">
<label class="np-input-label" for="store_number">
</label>
<input
class="np-input"
type="text"
name="store[number]"
id="store_number"
placeholder="Store Number(NSN)"
required
>
</div>
</form>
<button id="send_button" class="np-button np-button-big np-button-large-font np-form-action">
Update Information
</button>
</div>
</div>
</main>
{% include "footer" %}
<style>
@media (min-width: 1440px) {
#password-too-short-alert {
position: absolute;
right: 25.5%;
bottom: 23%;
color: salmon;
font-size: 13px;
}
#passwords-dont-match-alert {
position: absolute;
right: 23%;
bottom: 14.5%;
color: salmon;
font-size: 13px;
}
}
@media (min-width: 769px) and (max-width: 1024px) {
#password-too-short-alert {
position: absolute;
right: 24%;
bottom: 23%;
color: salmon;
font-size: 13px;
}
#passwords-dont-match-alert {
position: absolute;
right: 21.5%;
bottom: 14.5%;
color: salmon;
font-size: 13px;
}
}
@media (min-width: 426px) and (max-width: 768px) {
.np-box-content-container {
align-items: center;
}
}
@media (min-width: 376px) and (max-width: 425px) {
.np-input {
padding: 0 0.75rem;
}
}
@media (min-width: 326px) and (max-width: 375px) {
.np-input {
padding: 0 0.75rem;
}
}
@media (max-width: 325px) {
.np-input {
padding: 0 0.75rem;
}
}
.np-main {
margin: 25px 0;
}
.np-box {
display: flex;
flex-direction: row;
width: unset !important;
box-shadow: none;
}
.np-box-container {
height: unset !important;
background: none;
}
.hero-image-left-desktop {
width: 60%;
}
.hero-image-left-mobile {
width: 100%;
display: none;
}
.np-box-content-container {
margin-top: 0;
margin-bottom: 0;
padding: 2rem;
display: flex;
flex-direction: column;
}
.np-form-subtitle {
margin-bottom: 1.25rem;
}
.np-input {
background-color: #FFF6F0;
border: none;
border-radius: 4px;
}
.np-input::placeholder {
color: #6F7277;
font-size: 16px;
}
#default-option {
color: #6F7277;
font-size: 16px;
}
.selection-option {
font-family: Inter;
}
.body {
height: 100%;
}
#learner_role {
color: #1B1C1D;
text-align: left;
}
@media only screen and (min-width: 1190px) {
.hero-image-left-desktop {
min-width: 60%;
}
}
@media only screen and (max-width: 768px) {
.np-box-content-container {
padding: 2rem 2rem 2.25rem;
}
.hero-image-left-desktop {
display: none;
}
.hero-image-left-mobile {
display: block;
}
.np-box {
flex-direction: column;
margin: 0;
}
.np-main {
margin: 0;
}
.np-box-content-container {
margin-left: 0;
}
}
#send_button {
pointer-events: none;
background: #6F7277;
}
.loader {
border: 16px solid #f3f3f3;
border-radius: 50%;
border-top: 16px solid #00bf8f;
border-bottom: 16px solid #00bf8f;
width: 120px;
height: 120px;
-webkit-animation: spin 2s linear infinite;
animation: spin 2s linear infinite;
position: absolute;
top:0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style>
<style>
.np-box-container {
background: none;
}
</style>
<script>
function checkIfInputsExist (){
window.setTimeout(function(){
if ($("#store_number")[0].value.length > 0 && $("#learner_role")[0].value != "Your Role") {
$("#send_button").css("background-color","#de352a");
$("#send_button").css("pointer-events","auto");
}
else {
$("#send_button").css("background-color","#6F7277");
$("#send_button").css("pointer-events","none");
}
}, 500)
}
document.addEventListener('keydown', checkIfInputsExist);
document.getElementById("learner_role").addEventListener('change', checkIfInputsExist);
document.getElementById("send_button").addEventListener("click", function() {
var selectedRole = document.getElementById("learner_role").value;
var groupUuid ="";
switch (selectedRole) {
case "General Manager":
groupUuid = "0f977347-6e60-4de1-bad3-f6b413ab7eef";
break;
case "Kitchen Manager":
groupUuid = "df0b4cea-fac6-4991-8902-b2202b9c71c5";
break;
case "People Manager":
groupUuid = "ed4ae611-ed12-41c1-b1ff-03d339813f70";
break;
case "Guest Services Manager":
groupUuid = "df0b4cea-fac6-4991-8902-b2202b9c71c5";
break;
case "Swing/Shift Manager":
groupUuid = "9b5674c8-e5f1-47ad-a380-cc9fb1a73c02";
break;
case "Manager Trainees":
groupUuid = "1bed05ca-c5e6-4874-8e14-e2815ccdba7f";
break;
case "Supervisor":
groupUuid = "1e63de54-0676-427a-a3f8-da2625f47ce5";
break;
case "Supervisor/Role Assigment":
groupUuid = "1e63de54-0676-427a-a3f8-da2625f47ce5";
break;
case "Org Admin":
groupUuid = "007d0b66-092d-4fda-a706-6b34cf1dddf4";
break;
case "Owner Operator":
groupUuid = "bbd256f2-48e2-407d-85b6-d016010c9649";
break;
case "Crew Trainer":
groupUuid = "afc4049d-7363-4301-a729-527cfbe5ef61";
break;
case "Corporate/Field Staff":
groupUuid = "bbd256f2-48e2-407d-85b6-d016010c9649";
break;
};
console.log("Selected Role: " + selectedRole);
console.log("Group UUID: " + groupUuid);
SendInfos(selectedRole, groupUuid);
});
function SendInfos(role, groupUuid) {
var xhr = new XMLHttpRequest();
url = "https://webhooks.workato.com/webhooks/rest/aa37cb7d-653d-43fe-a7b0-e4f9c2d6bd1e/harrimc-collect-learner-information"
xhr.addEventListener("load", e => {
window.sessionStorage.propertiesAdded = 'true';
window.location.replace('/app');
});
xhr.open("POST", url, true);
xhr.send(JSON.stringify({
user_id: '{{ current_person.id }}',
mc_d_role: role,
store_number_nsn: $("#store_number")[0].value,
group_uuid: groupUuid
}));
};
</script>

View File

@ -0,0 +1,50 @@
/*
Put your custom overlay styles in here
You can use your northpass color palette in this file
{{ color_palette.button_font_color }}
{{ color_palette.button_color }}
{{ color_palette.button_hover_color }}
{{ color_palette.header_font_color }}
{{ color_palette.header_font_hover_color }}
{{ color_palette.header_color }}
*/
.red-bar{
background: red;
}
.red-text,
.red-status{
color: red;
}
.yellow-bar{
background: yellow;
}
.yellow-text,
.yellow-status{
color: yellow;
}
.green-bar{
background: green;
}
.green-text,
.green-status{
color: green;
}
.course-duration-lp {
color: #de352a;
font-size: .75rem;
font-weight: 900;
text-transform: uppercase;
margin-top: 5px;
}
.text-center {
text-align: center;
}

View File

@ -0,0 +1,19 @@
{% include "header" %}
{% include "sub_navigation" %}
<main class="np-main np-training-events np-subpage-container np-max-width">
<div class="row">
<div class="col-xs-12 col-sm-10">
<div class="np-resource-title events">
{% t .title %}
</div>
<div class="np-resource-subtitle events">
{% t .subtitle %}
</div>
</div>
<div class="col-xs-12 col-sm-2">
{% include "training_events_filter" %}
</div>
</div>
{% include "training_events_index" %}
</main>
{% include "footer" %}