google apps and crossbeam
This commit is contained in:
Norm Rasmussen
@ -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>
|
||||
@ -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 %}
|
||||
@ -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>
|
||||
@ -0,0 +1,40 @@
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.instructor_names }}
|
||||
</div>
|
||||
<div class="np-card-content-footer">
|
||||
{% if course.started? %}
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
<p style="margin-bottom:-25px">{{ course.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 notstarted">
|
||||
Not started
|
||||
</div>
|
||||
{% endif %}
|
||||
{% 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>
|
||||
@ -0,0 +1,89 @@
|
||||
{%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%}
|
||||
|
||||
<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 learning_path.started? %}
|
||||
<div class="np-card-content-progress np-button-color"></div>
|
||||
{{ course.progress }}% <p class="course-completion"><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: {{ learning_path.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-hidden-desktop np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
<a class="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>
|
||||
@ -0,0 +1,12 @@
|
||||
<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 %}
|
||||
<i class="fal fa-clock activity-clock"></i>
|
||||
<div class="activity-clock-popup">
|
||||
{{ activity_title[1] | strip }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<span class="np-course-outline-content-activity-title">
|
||||
{{ activity_title[0] | strip }}
|
||||
</span>
|
||||
|
||||
@ -0,0 +1,16 @@
|
||||
{% assign activity_title = activity.title | split: '~' %}
|
||||
{% if activity_title.size > 1 %}
|
||||
<i class="fal fa-clock activity-clock"></i>
|
||||
<div class="activity-clock-popup">
|
||||
{{ 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>
|
||||
@ -0,0 +1,198 @@
|
||||
<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-clock {
|
||||
font-size: 1rem;
|
||||
padding: 3px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.activity-clock-popup {
|
||||
display: none;
|
||||
position: absolute;
|
||||
padding: 5px;
|
||||
background: white;
|
||||
font-size: 1rem;
|
||||
top: 0;
|
||||
left: 80px;
|
||||
border: gray 1px solid;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.activity-clock:hover+.activity-clock-popup {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
@ -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 %}
|
||||
|
||||
@ -0,0 +1,97 @@
|
||||
<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">
|
||||
{% 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>
|
||||
{% 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>
|
||||
@ -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>
|
||||
316
NP_Custom_Templates/customer_templates/Harri/_header.html.liquid
Normal file
316
NP_Custom_Templates/customer_templates/Harri/_header.html.liquid
Normal 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>
|
||||
|
||||
@ -0,0 +1,59 @@
|
||||
{% if learning_path.enrolled? and course.unlocked? %}
|
||||
<div class="np-learning-path-outline-bar np-hidden-mobile"></div>
|
||||
<a
|
||||
class="np-learning-path-outline-item np-card-container"
|
||||
href="{% route learning_path_course, learning_path_id: learning_path.id, id: course.id %}"
|
||||
>
|
||||
<div class="np-card-content np-card-padding">
|
||||
<img
|
||||
src="{{ item.image }}"
|
||||
alt="{{ course.name }}"
|
||||
class="np-learning-path-outline-course-image"
|
||||
>
|
||||
<div class="np-learning-path-outline-content">
|
||||
<div class="np-learning-path-outline-name np-top-title">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
{% if course.instructors %}
|
||||
<div class="np-learning-path-outline-caption">
|
||||
{{ course.instructors }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-learning-path-outline-progress
|
||||
{% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
|
||||
">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right np-learning-path-outline-icon"></i>
|
||||
{% comment %} {% if course.optional? %}
|
||||
<div class="np-optional-ribbon">
|
||||
{% t shared.optional %}
|
||||
</div>
|
||||
{% endif %} {% endcomment %}
|
||||
<div class="np-optional-ribbon">
|
||||
{{ course.progress }}%
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
{% else %}
|
||||
<div class="np-learning-path-outline-item np-learning-path-outline-inactive-item np-card-container">
|
||||
<div class="np-card-content np-card-padding">
|
||||
<img
|
||||
src="{{ item.image }}"
|
||||
alt="{{ course.name }}"
|
||||
class="np-learning-path-outline-course-image"
|
||||
>
|
||||
<div class="np-learning-path-outline-content">
|
||||
<div class="np-learning-path-outline-name np-top-title">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
</div>
|
||||
{% if course.optional? %}
|
||||
<div class="np-optional-ribbon">
|
||||
{% t shared.optional %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -0,0 +1,6 @@
|
||||
<h3 class="np-card-heading lp">
|
||||
{% t .about %}
|
||||
</h3>
|
||||
<div class="np-card-text">
|
||||
{{ learning_path.description }}
|
||||
</div>
|
||||
@ -0,0 +1,53 @@
|
||||
{%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? %}
|
||||
<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: {{ learning_path.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: learning_path.progress %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<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 %}
|
||||
{% t shared.learning_path.start %}
|
||||
{% elsif learning_path.completed? %}
|
||||
{% t shared.learning_path.view %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</a>
|
||||
|
||||
@ -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://northpass-production-harri-assets.s3.amazonaws.com/lockup-mcdonalds.png"
|
||||
document.getElementsByClassName("np-header-logo-image")[0].src = "https://northpass-production-harri-assets.s3.amazonaws.com/lockup-mcdonalds.png"
|
||||
</script>
|
||||
{% endif %}
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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" %}
|
||||
@ -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" %}
|
||||
@ -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" %}
|
||||
@ -0,0 +1,5 @@
|
||||
{% body %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
{% include "mcdonalds_theme" %}
|
||||
{% endif %}
|
||||
@ -0,0 +1,38 @@
|
||||
/*
|
||||
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;
|
||||
}
|
||||
@ -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" %}
|
||||
Reference in New Issue
Block a user