Custom templates for Courtney and iAdvize, and some notes for anthology, glassdoor, and stopit.
This commit is contained in:
Norm Rasmussen
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
Binary file not shown.
@ -0,0 +1,54 @@
|
||||
{% comment %}Get number of sections in course{% endcomment %}
|
||||
{% assign course_count = 0 %}
|
||||
{% for section in course.published_sections %}
|
||||
{% assign course_count = forloop.index %}
|
||||
{% endfor %}
|
||||
|
||||
{% assign categories = course.course_category_names %}
|
||||
<li class="uk-width-large-1-3 uk-width-medium-1-2 uk-width-small-1-1 school-website-course-tile course-card" data-categories="{{ categories }}">
|
||||
<div class="uk-panel uk-panel-box uk-panel-box-secondary course-card__body">
|
||||
{% if course.ribbon %}
|
||||
<div class="uk-panel-badge uk-badge">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="uk-panel-teaser">
|
||||
{% if current_person.enrolled_in_course? %}
|
||||
<a href="{{ course.cover_path }}" class="main-link">
|
||||
<img src="{{ course.list_image_url }}" class="uk-responsive-width uk-width-1-1">
|
||||
</a>
|
||||
{% else %}
|
||||
<a href="{{ course.details_path }}" class="main-link">
|
||||
<img src="{{ course.list_image_url }}" class="uk-responsive-width uk-width-1-1">
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<h3 class="uk-panel-title uk-margin-bottom-remove">
|
||||
{% if current_person.enrolled_in_course? %}
|
||||
<a href="{{ course.cover_path }}" data-test="course-name">{{ course.name }}</a>
|
||||
{% else %}
|
||||
<a href="{{ course.details_path }}" data-test="course-name">{{ course.name }}</a>
|
||||
{% endif %}
|
||||
</h3>
|
||||
<div class="course-card__footer c--grey">
|
||||
<div class="number-of-courses">
|
||||
<span class="number-of-courses__label"></span>
|
||||
<span class="number-of-courses__count">
|
||||
{{ course_count }}
|
||||
</span>
|
||||
</div>
|
||||
{% if current_person.enrolled_in_course? %}
|
||||
<a href="{{ course.cover_path }}" class="uk-button uk-button-primary school-website-course-tile-action uk-position-bottom-right" data-test="go-to-course-button">{{ course.go_to_label }}</a>
|
||||
<p class="progress-text">{{ course.progress_text }}</p>
|
||||
{% else %}
|
||||
<a href="{{ course.details_path }}" class="uk-button uk-button-outline school-website-course-tile-action uk-position-bottom-right">
|
||||
{% if current_school.apps.commerce.active? %}
|
||||
{{ course.formatted_price }}
|
||||
{% else %}
|
||||
{{ course.view_label }}
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
@ -0,0 +1,17 @@
|
||||
<div class="uk-width-1-1 uk-padding-large-vertical uk-padding-horizontal bg-greytowhite">
|
||||
<div class="content-wrapper isflex p-top-bottom">
|
||||
<div class="w-40">
|
||||
<h2>My events</h2>
|
||||
<div class="uk-margin-bottom sk-text-link">
|
||||
You haven't registered for any events yet.
|
||||
</div>
|
||||
|
||||
<a href="/training_events" class="uk-button uk-button-primary">
|
||||
Discover Events
|
||||
</a>
|
||||
</div>
|
||||
<div class="w-60">
|
||||
img
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,188 @@
|
||||
<footer class="footer">
|
||||
<div class="footer__container container">
|
||||
<div class="footer__logo">
|
||||
<a href="/" title="">
|
||||
<img src="https://storage.googleapis.com/idz-garden/northpass/images/idz-logo-white.png" style="height: 30px; width: auto;" alt="" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="idz-custom-data" style="display: none;">
|
||||
<div class="learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<script>
|
||||
(function(){
|
||||
var userLang = navigator.language || navigator.userLanguage;
|
||||
var curLang = userLang.toLowerCase().indexOf('fr') > -1 ? 'fr' : 'en';
|
||||
|
||||
var headerNavElements = [
|
||||
{
|
||||
fr: {
|
||||
label: "Parcours",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: true,
|
||||
},
|
||||
en: {
|
||||
label: "Courses",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: true,
|
||||
}
|
||||
},
|
||||
{
|
||||
fr: {
|
||||
label: "Webinars",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: false,
|
||||
},
|
||||
en: {
|
||||
label: "Webinars",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: false,
|
||||
}
|
||||
},
|
||||
];
|
||||
|
||||
var footerNavElements = [
|
||||
{
|
||||
fr: {
|
||||
label: "Base de connaissance",
|
||||
href:"https://help.iadvize.com/hc/fr",
|
||||
title: "",
|
||||
internal: false,
|
||||
},
|
||||
en: {
|
||||
label: "Knowledge base",
|
||||
href:"https://help.iadvize.com/hc/en-gb",
|
||||
title: "",
|
||||
internal: false,
|
||||
}
|
||||
},
|
||||
{
|
||||
fr: {
|
||||
label: "iAdvize.com",
|
||||
href:"https://iadvize.com",
|
||||
title: "",
|
||||
internal: false,
|
||||
},
|
||||
en: {
|
||||
label: "iAdvize.com",
|
||||
href:"https://iadvize.com",
|
||||
title: "",
|
||||
internal: false,
|
||||
}
|
||||
},
|
||||
|
||||
];
|
||||
|
||||
var initialNavElements = [
|
||||
{
|
||||
fr: {
|
||||
label: "Accueil",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: true,
|
||||
},
|
||||
en: {
|
||||
label: "Home",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: true,
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
var createNavigation = function(parentSelector, className = '', lang = 'en', navigationElements = initialNavElements) {
|
||||
var parent = document.querySelectorAll(parentSelector);
|
||||
|
||||
if(
|
||||
parent &&
|
||||
parent.length &&
|
||||
navigationElements.length
|
||||
) {
|
||||
var nav = document.createElement('nav');
|
||||
nav.classList.add(className);
|
||||
var navList = document.createElement('ul');
|
||||
navList.classList.add('nav');
|
||||
|
||||
navigationElements
|
||||
.map(function(navEl) {
|
||||
return navEl[lang];
|
||||
})
|
||||
.forEach(function(el) {
|
||||
var item = document.createElement('li');
|
||||
item.classList.add('nav__item');
|
||||
var link = document.createElement('a');
|
||||
link.href = el.href;
|
||||
link.title = el.title;
|
||||
link.target = el.internal ? '_self' : '_blank';
|
||||
|
||||
link.append(el.label);
|
||||
item.append(link);
|
||||
navList.append(item);
|
||||
});
|
||||
nav.append(navList);
|
||||
parent[0].append(nav);
|
||||
}
|
||||
}
|
||||
createNavigation('.footer__container', 'footer__nav', curLang, footerNavElements);
|
||||
})()
|
||||
|
||||
</script>
|
||||
|
||||
<!-- START IADVIZE LIVECHAT -->
|
||||
<script type='text/javascript'>
|
||||
var idzCustomData = {};
|
||||
(function() {
|
||||
var idz = document.createElement('script');
|
||||
idz.type = 'text/javascript';
|
||||
idz.async = true;
|
||||
idz.src = document.location.protocol + '//halc.iadvize.com/iadvize.js?sid=7163';
|
||||
var s = document.getElementsByTagName('script')[0];
|
||||
s.parentNode.insertBefore(idz, s);
|
||||
})();
|
||||
</script><!-- END IADVIZE LIVECHAT -->
|
||||
|
||||
<!-- Start Screeb -->
|
||||
|
||||
<script type="text/javascript">
|
||||
(function (w,d,s,o,f,js,fjs) {
|
||||
w['ScreebObject']=o;w[o]=w[o]||function(){(w[o].q=w[o].q||[]).push(arguments)};
|
||||
js=d.createElement(s),fjs=d.getElementsByTagName(s)[0];js.type='text/javascript';
|
||||
js.id=o;js.src=f;js.async=1;d.getElementsByTagName("head")[0].appendChild(js);
|
||||
}(window,document,'script','$screeb','https://t.screeb.app/tag.js'));
|
||||
$screeb('init', '54db1ce2-aae0-4c6c-b481-e1725ce24935');
|
||||
$screeb('identity', '{{ current_person.email }}', {
|
||||
name: '{{ current_person.name }}',
|
||||
});
|
||||
|
||||
const interval = setInterval(() => {
|
||||
if (!!window.iAdvize && !!iAdvize.platform && iAdvize.platform.length > 0 && !!iAdvize.client_id) {
|
||||
$screeb('identity.properties', {
|
||||
CID: iAdvize.platform+'-'+iAdvize.client_id,
|
||||
});
|
||||
clearInterval(interval);
|
||||
}
|
||||
}, 1000);
|
||||
|
||||
</script>
|
||||
<!-- End Screeb -->
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
var language = window.navigator.userLanguage || window.navigator.language;
|
||||
|
||||
console.log(language);
|
||||
|
||||
if( language != 'fr' ){
|
||||
$( "a:contains('Aller au cours')" ).text("Go to the course");
|
||||
$('input[name="q"]').attr("placeholder", "Search by keyword");
|
||||
}
|
||||
|
||||
});
|
||||
</script>
|
||||
@ -0,0 +1,7 @@
|
||||
<title>iAdvize Academy</title>
|
||||
<link rel="stylesheet" media="all" href="{{ routes.schoolkeep_v3_styles_url }}">
|
||||
<link rel="stylesheet" media="all" href="{{ routes.color_scheme_path }}">
|
||||
|
||||
{% if current_school.has_custom_styles? %}
|
||||
<link rel="stylesheet" media="all" href="{{ routes.custom_styles_path }}">
|
||||
{% endif %}
|
||||
@ -0,0 +1,87 @@
|
||||
<header class="school-website-header uk-z-4">
|
||||
<div class="uk-padding-horizontal uk-container uk-container-center header__container">
|
||||
<nav class="uk-navbar" data-behavior="dropdown">
|
||||
<a href="{{ current_school.logo_navigation_url }}" class="uk-brand header__logo">
|
||||
{% if current_school.logo_url %}
|
||||
<img src="{{ current_school.logo_url }}" alt="{{ current_school.name }}">
|
||||
{% else %}
|
||||
<span class="uk-text-large uk-text-bold">{{ current_school.name }}</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
<div class="uk-navbar-flip">
|
||||
<ul class="uk-navbar-nav uk-hidden-small" id="header__navigation">
|
||||
{% search %}
|
||||
<li class="uk-padding-top">
|
||||
{% include "search_form" with "" %}
|
||||
</li>
|
||||
{% endsearch %}
|
||||
|
||||
{% catalog_search %}
|
||||
<li class="uk-padding-top">
|
||||
{% include "catalog_search_form" with "" %}
|
||||
</li>
|
||||
{% endcatalog_search %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<li class="uk-parent" data-uk-dropdown="{mode:'click'}">
|
||||
<a href="#" class="learner-name">{{ current_person.name }}</a>
|
||||
<div class="uk-dropdown uk-dropdown-flip uk-dropdown-navbar">
|
||||
<ul class="uk-nav uk-nav-navbar">
|
||||
<li><a href="{{ routes.log_out_path }}" data-method="delete" rel="nofollow">{% t .log_out %}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
{% else %}
|
||||
<li><a href="{{ routes.log_in_path }}">{% t .log_in %}</a></li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
<div class="uk-visible-small">
|
||||
{% search %}
|
||||
<button class="uk-button uk-button-link uk-navbar-toggle mobile-search-toggle mobile-navbar-toggle" data-uk-toggle="{target:'#mobile-search'}">
|
||||
</button>
|
||||
{% endsearch %}
|
||||
|
||||
{% catalog_search %}
|
||||
<button class="uk-button uk-button-link uk-navbar-toggle mobile-search-toggle mobile-navbar-toggle" data-uk-toggle="{target:'#mobile-search'}">
|
||||
</button>
|
||||
{% endcatalog_search %}
|
||||
<a href="#mobile-nav" class="mobile-navbar-toggle uk-navbar-toggle" data-uk-offcanvas></a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% search %}
|
||||
<div id="mobile-search" class="school-website-header uk-visible-small uk-position-top uk-padding uk-block-default uk-flex uk-border-bottom {% if hide_search_box %}uk-hidden {% endif %}">
|
||||
{% include "search_form" with "" %}
|
||||
<a class="uk-button uk-button-link" href="{{ routes.my_content_path }}">{% t .cancel %}</a>
|
||||
</div>
|
||||
{% endsearch %}
|
||||
|
||||
{% catalog_search %}
|
||||
<div id="mobile-search" class="school-website-header uk-visible-small uk-position-top uk-padding uk-block-default uk-flex uk-border-bottom {% if hide_search_box %}uk-hidden {% endif %}">
|
||||
{% include "catalog_search_form" with "" %}
|
||||
<a class="uk-button uk-button-link" href="{{ routes.school_website_catalog_path }}">{% t .cancel %}</a>
|
||||
</div>
|
||||
{% endcatalog_search %}
|
||||
|
||||
<div id="mobile-nav" class="uk-offcanvas">
|
||||
<div class="uk-offcanvas-bar uk-offcanvas-bar-flip">
|
||||
<ul class="uk-nav uk-nav-offcanvas" data-uk-nav>
|
||||
{% for website_navigation in header_navigations %}
|
||||
<li>
|
||||
<a href="{{ website_navigation.path }}" {% if website_navigation.external? %} target="_blank" {% endif %}>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<li><a href="{{ routes.log_out_path }}" data-method="delete" rel="nofollow">{% t .log_out %}</a></li>
|
||||
{% else %}
|
||||
<li><a href="{{ routes.log_in_path }}">{% t .log_in %}</a></li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,38 @@
|
||||
<li class="uk-width-large-1-3 uk-width-medium-1-2 uk-width-small-1-1 uk-margin-large-bottom school-website-course-tile my-dashboard__tile">
|
||||
<div class="uk-panel uk-panel-box uk-panel-box-secondary">
|
||||
<div class="uk-panel-teaser">
|
||||
{% if current_person.enrolled_in_learning_path? %}
|
||||
<a href="{{ learning_path.cover_path }}" class="main-link">
|
||||
<img src="{{ learning_path.list_image_url }}" class="uk-responsive-width uk-width-1-1">
|
||||
</a>
|
||||
{% else %}
|
||||
<a href="{{ learning_path.details_path }}" class="main-link">
|
||||
<img src="{{ learning_path.list_image_url }}" class="uk-responsive-width uk-width-1-1">
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.filtering_enabled? and current_school.learning_paths_enabled? %}
|
||||
<span>
|
||||
{{ learning_path.learning_path_category_names }}
|
||||
</span>
|
||||
{% endif %}
|
||||
<h3 class="uk-panel-title uk-margin-bottom-remove">
|
||||
{% if current_person.enrolled_in_learning_path? %}
|
||||
<a href="{{ learning_path.cover_path }}" data-test="learning-path-name">{{ learning_path.name }}</a>
|
||||
{% else %}
|
||||
<a href="{{ learning_path.details_path }}" data-test="learning-path-name">{{ learning_path.name }}</a>
|
||||
{% endif %}
|
||||
</h3>
|
||||
<p class="uk-margin-small-top uk-margin-large-bottom">{{ learning_path.instructor_names }}</p>
|
||||
<p class="uk-margin-small-bottom">{{ learning_path.progress_text }}</p>
|
||||
{% if current_person.enrolled_in_learning_path? %}
|
||||
<a href="{{ learning_path.cover_path }}" class="uk-button uk-button-primary my-dashboard__tile-action uk-position-bottom-right" data-test="go-to-path">
|
||||
{{ learning_path.go_to_label }}
|
||||
</a>
|
||||
{% else %}
|
||||
<a href="{{ learning_path.details_path }}" class="uk-button uk-button-outline my-dashboard__tile-action uk-position-bottom-right" data-test="go-to-path">
|
||||
{{ learning_path.view_label }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</li>
|
||||
@ -0,0 +1,4 @@
|
||||
<div class="uk-padding-large-vertical uk-padding-horizontal content-wrapper">
|
||||
<h2>{{ my_content.headline }}</h2>
|
||||
<h3 class="uk-margin-top-remove">{{ my_content.subheadline }}</h3>
|
||||
</div>
|
||||
@ -0,0 +1,22 @@
|
||||
<div class="uk-padding-large-vertical uk-padding-horizontal content-wrapper">
|
||||
<h2 data-test="my-paths">{{ my_content.learning_paths_headline }}</h2>
|
||||
<h3 class="uk-margin-top-remove">{{ my_content.learning_paths_subheadline }}</h3>
|
||||
</div>
|
||||
<div class="uk-grid uk-grid-flex uk-margin-left-remove content-wrapper">
|
||||
{% include "learning_path_filters" with "" %}
|
||||
{% if current_school.filtering_enabled? and current_school.learning_paths_enabled? and current_person.filterable_learning_path_categories.count > 0 %}
|
||||
<div class="uk-width-medium-5-6 uk-padding">
|
||||
{% else %}
|
||||
<div class="uk-width-1-1 uk-padding">
|
||||
{% endif %}
|
||||
<ul class="uk-grid uk-grid-medium my-dashboard__list learning-paths__list uk-grid-match" data-uk-grid-match="{target:'.uk-panel'}">
|
||||
{% if my_content.learning_paths.any? %}
|
||||
{% for learning_path in my_content.learning_paths %}
|
||||
{% include "learning_path" %}
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<p>{{ my_content.empty_learning_paths }}</p>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,200 @@
|
||||
<link rel="stylesheet" media="all" href="/custom_styles.css">
|
||||
<header class="uk-navbar uk-navbar-attached uk-border-bottom learning-header slide">
|
||||
<div class="uk-navbar-flip">
|
||||
<ul class="uk-navbar-nav">
|
||||
<li>
|
||||
<a id="iadvize-exit-translated-english" href="{{ routes.my_content_path }}" class="uk-border-left uk-button-small">{% t .exit %}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="uk-navbar-content uk-text-center sk-float-remove">
|
||||
{% if current_school.logo_url %}
|
||||
<img src="{{ current_school.logo_url }}" class="uk-responsive-height">
|
||||
{% else %}
|
||||
{{ current_school.name }}
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% if preview_banner %}
|
||||
{{ preview_banner }}
|
||||
{% endif %}
|
||||
|
||||
<section class="bg-isgrey">
|
||||
<div class="content-wrapper jumbo isflex p-top-60 p-bottom-100">
|
||||
<div class="w-50 course__title">
|
||||
<h1 class="mainTitle w-70">{{ course.name }}</h1>
|
||||
{% if course.learner_can_retake? %}
|
||||
<form action="{{ course.course_attempts_path }}" method="POST">
|
||||
<button type="submit" class="cta isfull" id="iadvize-retake-translated-english" data-test="retake-course-button">{{ course.retake_course }}</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a href="{{ course.outline_path }}" class="cta isfull" id="iadvize-start-translated-english" data-test="start-course-button">{{ course.start_or_continue }}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="w-50 p-top-30 course__image">
|
||||
<img src="{{ course.featured_image_url }}" alt="image" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="uk-container uk-container-center uk-padding-large uk-margin-large-top">
|
||||
|
||||
<div{% if course.has_outline? %} class="uk-grid uk-grid-large"{% endif %}>
|
||||
<div class="uk-width-medium-1-2 uk-margin-bottom{% unless course.has_outline? %} uk-container-center{% endunless %}">
|
||||
<article class="uk-article">
|
||||
{% comment %} <img src="{{ course.featured_image_url }}" /> {% endcomment %}
|
||||
<h3 id="iadvize-aboutCourse-translated-english">{{ course.about_label }}</h3>
|
||||
<p>{{ course.full_description }}</p>
|
||||
<h3 id="iadvize-progress-translated-english">{{ course.progress_title }}</h3>
|
||||
{{ course.progress_bar }}
|
||||
</article>
|
||||
|
||||
{% if course.instructors.count > 0 %}
|
||||
<article class="uk-article">
|
||||
<h3>{{ course.instructors_title }}</h3>
|
||||
{% for instructor in course.instructors %}
|
||||
<div>
|
||||
<div class="uk-comment-header">
|
||||
<img
|
||||
src="{{ instructor.image_url }}"
|
||||
alt="{{ instructor.name }}"
|
||||
class="uk-comment-avatar"
|
||||
width="80">
|
||||
<h4 class="uk-comment-title">{{ instructor.name }}</h4>
|
||||
<div class="uk-comment-meta">{{ instructor.title }}</div>
|
||||
</div>
|
||||
<div class="wysiwyg">{{ instructor.bio }}</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</article>
|
||||
{% endif %}
|
||||
|
||||
<article class="uk-article">
|
||||
{{ upcoming_events }}
|
||||
</article>
|
||||
|
||||
{% if course.discover_events_path %}
|
||||
<a href="{{ course.discover_events_path }}" class="uk-padding-left-remove">{% t .see_all_events %}</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if course.has_outline? %}
|
||||
<div class="uk-width-medium-1-2">
|
||||
<h3 id="iadvize-list-translated-english">Liste des cours</h3>
|
||||
<ol class="uk-list cover-outline">
|
||||
{% for section in learner_syllabus.sections %}
|
||||
<li class="uk-margin-large-bottom">
|
||||
<h3><strong>{{ section.name }}</strong></h3>
|
||||
{% if section.will_be_published? %}
|
||||
<div class="uk-margin-top">
|
||||
{% t .scheduled_info %} {{ section.published_at }}
|
||||
</div>
|
||||
{% else %}
|
||||
<ol class="uk-list cover-outline-section-activities">
|
||||
{% for activity in section.activities %}
|
||||
<li class="{% if activity.completed? %}completed {% endif %}{% if activity.locked? %}locked{% endif %}" >
|
||||
{% if activity.locked? %}
|
||||
<span>
|
||||
{% if activity.milestone? %}
|
||||
<i class="uk-icon-flag"></i>
|
||||
{% endif %}
|
||||
{{ activity.title }}
|
||||
</span>
|
||||
{% else %}
|
||||
<a href="{{ activity.path }}">
|
||||
{% if activity.milestone? %}
|
||||
<i class="uk-icon-flag"></i>
|
||||
{% endif %}
|
||||
{{ activity.title }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<footer class="footer">
|
||||
<div class="footer__container container">
|
||||
<div class="footer__logo">
|
||||
<a href="/" title="">
|
||||
<img src="https://storage.googleapis.com/idz-garden/northpass/images/idz-logo-white.png" style="height: 30px; width: auto;" alt="" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script>
|
||||
|
||||
let courseIdCover = window.location.href.split("/")[4];
|
||||
|
||||
const englishCoursesCover = {
|
||||
"7efznk51" : "messenger-admins",
|
||||
"z3y62h8o" : "messenger-agents",
|
||||
"atotcben" : "messenger-managers",
|
||||
"nuh1wvf8" : "discover iAdvize",
|
||||
"kshgymrm" : "get started",
|
||||
"4sjntvpq" : "improve your commercial performance",
|
||||
"u4xhu0nx" : "increase you productivity",
|
||||
"76uqobvm" : "Take care of your customer satisfaction",
|
||||
"m4ala288" : "Improve agents response",
|
||||
"ywjecyta" : "art of chatting",
|
||||
"ej4oubpt" : "New: the snooze button",
|
||||
"hilvaoiv" : "Replay: Administrators and Managers: Get ready for the iAdvize launch",
|
||||
"w3t3x0uf" : "Replay: Agents, discover your iAdvize conversation desk.",
|
||||
"bwmtqkt6" : "Deploy the video channel (7min)",
|
||||
"cuyvmz5e" : "Get started on iAdvize (8min / 38min)",
|
||||
"wdky0d9x" : "Increase your team's productivity (12 min)",
|
||||
"pvfzkpdw" : "The snooze button (13 min)",
|
||||
"hiyij7vo" : "Discover our new bots (6 min)",
|
||||
"lit8ro7g" : "Create user accounts (9min)",
|
||||
"jth9adfp" : "Take care of your Customer Satisfaction (17 min)",
|
||||
"e6amojyr" : "Your new iAdvize conversation panel (2min)",
|
||||
"dqg0kso1" : "Converse responsively (3min)",
|
||||
"ej5kzmjx" : "Encourage a pleasant conversation (3min)",
|
||||
"odtdmmqs" : "Make things easy to understand (2min)",
|
||||
"vpkmrkpo" : "User guides (EN/ES/DE)Commencer",
|
||||
"xvbmpqcs" : "Get started on the Video channel (6 min)",
|
||||
"l1gmjazx" : "Tips for WhatsApp (EN/DE/ES)",
|
||||
"qcokbjni" : "Use the iAdvize app [EN/ES]"
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
if(englishCoursesCover[courseIdCover]) {
|
||||
$("#iadvize-exit-translated-english").html("Exit");
|
||||
$("#iadvize-retake-translated-english").html("Retake Course");
|
||||
$("#iadvize-start-translated-english").html("Start");
|
||||
$("#iadvize-aboutCourse-translated-english").html("About the Course");
|
||||
$("#iadvize-list-translated-english").html("List of Activities");
|
||||
let progressText = $("#iadvize-progress-translated-english").html();
|
||||
progressText = progressText.split("%");
|
||||
progressText[1] = "Complete";
|
||||
progressText = progressText.join("% ");
|
||||
$("#iadvize-progress-translated-english").html(progressText);
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<!-- START IADVIZE LIVECHAT -->
|
||||
<script type='text/javascript'>
|
||||
var idzCustomData = {};
|
||||
(function() {
|
||||
var idz = document.createElement('script');
|
||||
idz.type = 'text/javascript';
|
||||
idz.async = true;
|
||||
idz.src = document.location.protocol + '//halc.iadvize.com/iadvize.js?sid=7163';
|
||||
var s = document.getElementsByTagName('script')[0];
|
||||
s.parentNode.insertBefore(idz, s);
|
||||
})();
|
||||
</script><!-- END IADVIZE LIVECHAT -->
|
||||
@ -0,0 +1,5 @@
|
||||
<script>
|
||||
(function(){
|
||||
console.log('coucoucoucou')
|
||||
})()
|
||||
</script>
|
||||
@ -0,0 +1,148 @@
|
||||
<script>
|
||||
(function(){
|
||||
var userLang = navigator.language || navigator.userLanguage;
|
||||
var curLang = userLang.toLowerCase().indexOf('fr') > -1 ? 'fr' : 'en';
|
||||
|
||||
var headerNavElements = [
|
||||
{
|
||||
fr: {
|
||||
label: "Parcours",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: true,
|
||||
},
|
||||
en: {
|
||||
label: "Courses",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: true,
|
||||
}
|
||||
},
|
||||
{
|
||||
fr: {
|
||||
label: "Webinars",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: false,
|
||||
},
|
||||
en: {
|
||||
label: "Webinars",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: false,
|
||||
}
|
||||
},
|
||||
];
|
||||
|
||||
var footerNavElements = [
|
||||
{
|
||||
fr: {
|
||||
label: "Base de connaissance",
|
||||
href:"https://help.iadvize.com/hc/fr",
|
||||
title: "",
|
||||
internal: false,
|
||||
},
|
||||
en: {
|
||||
label: "Knowledge base",
|
||||
href:"https://help.iadvize.com/hc/en-gb",
|
||||
title: "",
|
||||
internal: false,
|
||||
}
|
||||
},
|
||||
{
|
||||
fr: {
|
||||
label: "iAdvize.com",
|
||||
href:"https://iadvize.com",
|
||||
title: "",
|
||||
internal: false,
|
||||
},
|
||||
en: {
|
||||
label: "iAdvize.com",
|
||||
href:"https://iadvize.com",
|
||||
title: "",
|
||||
internal: false,
|
||||
}
|
||||
},
|
||||
];
|
||||
|
||||
var initialNavElements = [
|
||||
{
|
||||
fr: {
|
||||
label: "Accueil",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: true,
|
||||
},
|
||||
en: {
|
||||
label: "Home",
|
||||
href:"/",
|
||||
title: "",
|
||||
internal: true,
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
var createNavigation = function(parentSelector, className = '', lang = 'en', navigationElements = initialNavElements) {
|
||||
var parent = document.querySelectorAll(parentSelector);
|
||||
|
||||
if(
|
||||
parent &&
|
||||
parent.length &&
|
||||
navigationElements.length
|
||||
) {
|
||||
var nav = document.createElement('nav');
|
||||
nav.classList.add(className);
|
||||
var navList = document.createElement('ul');
|
||||
navList.classList.add('nav');
|
||||
|
||||
navigationElements
|
||||
.map(function(navEl) {
|
||||
return navEl[lang];
|
||||
})
|
||||
.forEach(function(el) {
|
||||
var item = document.createElement('li');
|
||||
item.classList.add('nav__item');
|
||||
var link = document.createElement('a');
|
||||
link.href = el.href;
|
||||
link.title = el.title;
|
||||
link.target = el.internal ? '_self' : '_blank';
|
||||
|
||||
link.append(el.label);
|
||||
item.append(link);
|
||||
navList.append(item);
|
||||
});
|
||||
nav.append(navList);
|
||||
parent[0].append(nav);
|
||||
}
|
||||
}
|
||||
createNavigation('.footer__container', 'footer__nav', curLang, footerNavElements);
|
||||
})()
|
||||
|
||||
// Add Custom datas
|
||||
var parentElement = document.querySelector('.page-wrapper');
|
||||
var customDataElement = document.createElement('div');
|
||||
var emailData = document.createElement('div');
|
||||
|
||||
customDataElement.classList.add('idz-custom-data');
|
||||
emailData.classList.add('learner-email');
|
||||
emailData.innerText = '{{ current_person.email }}';
|
||||
//add email
|
||||
customDataElement.appendChild(emailData);
|
||||
// hide custom data div
|
||||
customDataElement.style.display = 'none';
|
||||
|
||||
parentElement.appendChild(customDataElement);
|
||||
</script>
|
||||
|
||||
<!-- START IADVIZE LIVECHAT -->
|
||||
<script type='text/javascript'>
|
||||
var idzCustomData = {};
|
||||
(function() {
|
||||
var idz = document.createElement('script');
|
||||
idz.type = 'text/javascript';
|
||||
idz.async = true;
|
||||
idz.src = document.location.protocol + '//halc.iadvize.com/iadvize.js?sid=7163';
|
||||
var s = document.getElementsByTagName('script')[0];
|
||||
s.parentNode.insertBefore(idz, s);
|
||||
})();
|
||||
</script><!-- END IADVIZE LIVECHAT -->
|
||||
@ -0,0 +1,105 @@
|
||||
<header class="uk-navbar uk-navbar-attached uk-border-bottom learning-header slide">
|
||||
<div class="uk-navbar-flip">
|
||||
<ul class="uk-navbar-nav">
|
||||
<li>
|
||||
<a href="{{ routes.my_content_path }}" class="uk-border-left uk-button-small">{% t .exit %}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="uk-navbar-content uk-text-center sk-float-remove">
|
||||
{% if current_school.logo_url %}
|
||||
<img src="{{ current_school.logo_url }}" class="uk-responsive-height">
|
||||
{% else %}
|
||||
{{ current_school.name }}
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% if preview_banner %}
|
||||
{{ preview_banner }}
|
||||
{% endif %}
|
||||
<div class="uk-container uk-container-center uk-padding-large uk-margin-large-top learning-path-cover">
|
||||
<h4 class="uk-text-muted uk-margin-remove">{% t .title %}</h4>
|
||||
{% if learning_path.has_progress? %}
|
||||
{% learning_path_item learning_path.current_person_learning_path_item %}
|
||||
<button class="uk-button uk-float-right completion-button">
|
||||
{% t .continue %}
|
||||
</button>
|
||||
{% endlearning_path_item %}
|
||||
{% else %}
|
||||
{% if learning_path.items.count > 0 %}
|
||||
{% learning_path_item learning_path.current_person_learning_path_item %}
|
||||
<button
|
||||
class="uk-button uk-float-right completion-button"
|
||||
data-test="start-learning-path-button"
|
||||
>
|
||||
{% t .start %}
|
||||
</button>
|
||||
{% endlearning_path_item %}
|
||||
{% else %}
|
||||
<button
|
||||
disabled
|
||||
class="uk-button uk-float-right completion-button"
|
||||
data-test="start-learning-path-button"
|
||||
>
|
||||
{% t .start %}
|
||||
</button>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<h1 class="uk-margin-remove" data-test="learning-path-name">{{ learning_path.name }}</h1>
|
||||
<hr class="uk-article-divider uk-margin-top">
|
||||
|
||||
<div class="uk-grid uk-grid-large">
|
||||
<div class="uk-width-medium-1-3 uk-margin-bottom uk-container-center">
|
||||
<article class="uk-article">
|
||||
<img src="{{ learning_path.featured_image_url }}" />
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="uk-width-medium-2-3">
|
||||
<h3>{% t .about_label %}</h3>
|
||||
<p>{{ learning_path.description }}</p>
|
||||
{% if learning_path.has_instructors? %}
|
||||
<h3>{{ learning_path.instructors_title }}</h3>
|
||||
<div class="uk-grid uk-grid-large">
|
||||
{% for instructor in learning_path.instructors %}
|
||||
<div class="uk-width-medium-1-2 uk-margin-top">
|
||||
<div class="uk-comment-header">
|
||||
<img
|
||||
src="{{ instructor.image_url }}"
|
||||
alt="{{ instructor.name }}"
|
||||
class="uk-comment-avatar"
|
||||
width="80">
|
||||
<h4 class="uk-comment-title">{{ instructor.name }}</h4>
|
||||
<div class="uk-comment-meta">{{ instructor.title }}</div>
|
||||
</div>
|
||||
<div class="wysiwyg">{{ instructor.bio }}</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="uk-width-medium">
|
||||
<h3>{{ learning_path.progress_text }}</h3>
|
||||
{{ learning_path.progress_bar }}
|
||||
|
||||
<h3><strong>{% t .outline_label %}</strong></h3>
|
||||
<ol class="uk-list cover-outline learning-path-items uk-margin-large-bottom" data-test="learning-path-items">
|
||||
{% for item in learning_path.items %}
|
||||
<li class="{% if item.completed? %}completed{% endif %} {% if item.locked? %}locked{% endif %}" data-test="learning-path-item">
|
||||
{{ item.progress_icon }}
|
||||
{% learning_path_item item %}
|
||||
{{ item.type_icon }}
|
||||
{{ item.name }}
|
||||
{% if item.optional? %}
|
||||
<span class="sk-badge uk-margin-small-left">optional</span>
|
||||
{% endif %}
|
||||
{% endlearning_path_item %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,424 @@
|
||||
<section class="bg-isblue">
|
||||
<div class="content-wrapper jumbo isflex p-bottom-30">
|
||||
<div class="home__image">
|
||||
<img src="https://storage.googleapis.com/successbox/Partage%20Public/Header_EN_small.png" id="imgHeader" alt="image" />
|
||||
</div>
|
||||
<!--
|
||||
<div class="w-50 home__intro">
|
||||
<h1 class="mainTitle w-70" id="intro__title"></h1>
|
||||
<h1 class="mainTitlehome w-70" id="intro__title"></h1>
|
||||
<p class="text mediumhome p-bottom-60 w-70" id="intro__content"></p>
|
||||
< <p class="text medium p-bottom-60 w-70" id="intro__content"></p>
|
||||
<p><a href="#courses__title" class="cta isfull" title="" id="discover-button"></a></p>
|
||||
</div>-->
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{% assign fr_top_courses_found = false %}
|
||||
{% assign en_top_courses_found = false %}
|
||||
|
||||
{% for course in my_content.courses %}
|
||||
{% if course.cover_path == '/outline/xdfdaaxq/cover' or course.cover_path == '/outline/aji7wjyu/cover' or course.cover_path == '/outline/h1tchlcj/cover'%}
|
||||
{% assign fr_top_courses_found = true %}
|
||||
{% elsif course.cover_path == '/outline/rudsgfoz/cover' or course.cover_path == '/outline/0dmzvafk/cover' or course.cover_path == '/outline/pmuuq5xd/cover'%}
|
||||
{% assign en_top_courses_found = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
<!-- Section FR Top Courses -->
|
||||
{% if fr_top_courses_found %}
|
||||
<section class="bg-isgrey">
|
||||
<div class="uk-container uk-container-center school-website-course-index-list uk-margin-top uk-margin-bottom">
|
||||
<div class="uk-padding-horizontal">
|
||||
<div class="content-wrapper section-height2">
|
||||
<div class="p-bottom-5">
|
||||
<h2 class="head--2" id="onboarding__title" />
|
||||
</div>
|
||||
<div class="uk-grid uk-grid-flex uk-margin-left-remove">
|
||||
<div class="uk-width-medium-6-6 no-padding-left">
|
||||
<ul class="uk-grid uk-grid-medium school-website-course-list uk-grid-match" id="courses" data-uk-grid-match="{target:'.uk-panel'}">
|
||||
{% for course in my_content.courses %}
|
||||
{% if course.cover_path == '/outline/xdfdaaxq/cover' %}
|
||||
{% include "course" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% for course in my_content.courses %}
|
||||
{% if course.cover_path == '/outline/aji7wjyu/cover' %}
|
||||
{% include "course" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% for course in my_content.courses %}
|
||||
{% if course.cover_path == '/outline/h1tchlcj/cover' %}
|
||||
{% include "course" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
<!-- Section FR Top Courses End -->
|
||||
<!-- ------------------------------------------------------------------------------------------------------------------------------------------------------------------- -->
|
||||
<!-- Section EN Top Courses -->
|
||||
{% if en_top_courses_found %}
|
||||
<section class="bg-isgrey">
|
||||
<div class="uk-container uk-container-center school-website-course-index-list uk-margin-top uk-margin-bottom">
|
||||
<div class="uk-padding-horizontal">
|
||||
<div class="content-wrapper section-height2">
|
||||
<div class="p-bottom-5">
|
||||
<h2 class="head--2" id="onboarding__title" />
|
||||
</div>
|
||||
<div class="uk-grid uk-grid-flex uk-margin-left-remove">
|
||||
<div class="uk-width-medium-6-6 no-padding-left">
|
||||
<ul class="uk-grid uk-grid-medium school-website-course-list uk-grid-match" id="courses" data-uk-grid-match="{target:'.uk-panel'}">
|
||||
{% for course in my_content.courses %}
|
||||
{% if course.cover_path == '/outline/rudsgfoz/cover' %}
|
||||
{% include "course" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% for course in my_content.courses %}
|
||||
{% if course.cover_path == '/outline/0dmzvafk/cover' %}
|
||||
{% include "course" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% for course in my_content.courses %}
|
||||
{% if course.cover_path == '/outline/pmuuq5xd/cover' %}
|
||||
{% include "course" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
<!-- Section EN Top Courses End -->
|
||||
<!-- ------------------------------------------------------------------------------------------------------------------------------------------------------------------- -->
|
||||
<!-- Section OB Path -->
|
||||
{%- comment -%} {% for course in my_content.courses %}
|
||||
{% if course.cover_path == "/outline/0sfflxyp/cover" or course.cover_path == "/outline/cuyvmz5e/cover" %}
|
||||
<section class="bg-isgrey">
|
||||
<div class="uk-container uk-container-center school-website-course-index-list uk-margin-top uk-margin-bottom">
|
||||
<div class="uk-padding-horizontal">
|
||||
<div class="content-wrapper section-height2">
|
||||
<div class="p-bottom-5">
|
||||
<h2 class="head--2" id="onboarding__title" />
|
||||
</div>
|
||||
<div class="uk-grid uk-grid-flex uk-margin-left-remove">
|
||||
<div class="uk-width-medium-6-6 no-padding-left">
|
||||
<ul class="uk-grid uk-grid-medium school-website-course-list uk-grid-match" id="courses" data-uk-grid-match="{target:'.uk-panel'}">
|
||||
<!-- insertion course -->
|
||||
|
||||
{% include "course" %}
|
||||
|
||||
<!-- Fin insertion course -->
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
{% endfor %} {%- endcomment -%}
|
||||
<!-- Fin Section OB Path -->
|
||||
|
||||
<div class="uk-container uk-container-center school-website-course-index-list uk-margin-top uk-margin-bottom">
|
||||
<div class="uk-padding-horizontal">
|
||||
<div class="content-wrapper section-height">
|
||||
<div class="p-bottom-5">
|
||||
<h2 class="head--2" id="courses__title" />
|
||||
</div>
|
||||
|
||||
<div class="uk-grid uk-grid-flex uk-margin-left-remove">
|
||||
<div class="uk-width-medium-6-6 no-padding-left">
|
||||
<ul class="uk-grid uk-grid-medium school-website-course-list uk-grid-match" id="courses" data-uk-grid-match="{target:'.uk-panel'}">
|
||||
{% for course in my_content.courses %}
|
||||
{% if course.cover_path != "/outline/0sfflxyp/cover" and course.cover_path != "/outline/cuyvmz5e/cover" %}
|
||||
{% include "course" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
var idz = {
|
||||
lang: 'en',
|
||||
role: 'agent',
|
||||
};
|
||||
|
||||
(function(){
|
||||
var wording = {
|
||||
title: {
|
||||
fr: 'Bienvenue sur l\'iAdvize Academy,',
|
||||
en: 'Welcome to iAdvize Academy,',
|
||||
},
|
||||
content: {
|
||||
fr: 'votre espace d\'apprentissage dédié aux enjeux de la conversation en ligne.',
|
||||
en: 'the learning space dedicated to your online conversation challenges.',
|
||||
},
|
||||
discover_button: {
|
||||
fr: 'Découvrez nos parcours',
|
||||
en: 'Discover our paths',
|
||||
},
|
||||
courses: {
|
||||
fr: 'Parcours',
|
||||
en: 'Paths',
|
||||
},
|
||||
onboarding: {
|
||||
fr: 'Premiers pas',
|
||||
en: 'Onboarding Path',
|
||||
},
|
||||
ob_course: {
|
||||
fr: 'Démarrez sur iAdvize (8min / 38min)',
|
||||
en: 'Get start on iAdvize (8min / 38min)',
|
||||
},
|
||||
number_of_courses: {
|
||||
fr: 'Nombre de cours',
|
||||
en: 'Number of courses',
|
||||
},
|
||||
course_button_start: {
|
||||
fr: 'Commencer',
|
||||
en: 'Start',
|
||||
},
|
||||
course_button_default: {
|
||||
fr: 'Continuer',
|
||||
en: 'Continue',
|
||||
},
|
||||
course_button_complete: {
|
||||
fr: 'Recommencer',
|
||||
en: 'Retake',
|
||||
},
|
||||
course_progress: {
|
||||
fr: '% terminés',
|
||||
en: '% completed',
|
||||
},
|
||||
search_placeholder: {
|
||||
fr: 'Chercher par mot clé',
|
||||
en: 'Search',
|
||||
},
|
||||
logout: {
|
||||
fr: 'Se déconnecter',
|
||||
en: 'Log out'
|
||||
}
|
||||
};
|
||||
|
||||
var setBandeauLink = function(lang) {
|
||||
|
||||
if(lang === 'fr') {
|
||||
document.getElementById("imgHeader").src="https://storage.googleapis.com/successbox/Partage%20Public/BandeauBlue_FR_small.png";
|
||||
}
|
||||
else {
|
||||
document.getElementById("imgHeader").src="https://storage.googleapis.com/successbox/Partage%20Public/Header_EN_small.png";
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/*var getWebinarsLink = function(role, lang) {
|
||||
if(lang === 'fr') {
|
||||
switch(role) {
|
||||
case 'admin':
|
||||
return 'https://app.livestorm.co/iadvize-5/fr-administrateur-manager';
|
||||
case 'manager':
|
||||
return 'https://app.livestorm.co/iadvize-5/fr-administrateur-manager';
|
||||
default:
|
||||
return 'https://app.livestorm.co/p/35079f67-6e16-4835-b334-556c93443927';
|
||||
}
|
||||
}
|
||||
switch(role) {
|
||||
case 'admin':
|
||||
return 'https://app.livestorm.co/iadvize-5/en-administrator-manager';
|
||||
case 'manager':
|
||||
return 'https://app.livestorm.co/iadvize-5/en-administrator-manager';
|
||||
default:
|
||||
return 'https://app.livestorm.co/iadvize-5/en-agent';
|
||||
}
|
||||
}; */
|
||||
|
||||
var navigation = {
|
||||
header: {
|
||||
fr: [
|
||||
{
|
||||
label: 'Parcours',
|
||||
href: '#courses__title',
|
||||
internal: true,
|
||||
},
|
||||
/* {
|
||||
label: 'Webinars',
|
||||
href: null,
|
||||
internal: false,
|
||||
},*/
|
||||
],
|
||||
en: [
|
||||
{
|
||||
label: 'Paths',
|
||||
href: '#courses__title',
|
||||
internal: true,
|
||||
},
|
||||
/*{
|
||||
label: 'Webinars',
|
||||
href: null,
|
||||
internal: false,
|
||||
}, */
|
||||
],
|
||||
},
|
||||
footer: {
|
||||
fr: [
|
||||
{
|
||||
label: 'Base de connaissance',
|
||||
href: 'https://help.iadvize.com/hc/fr',
|
||||
internal: false,
|
||||
},
|
||||
{
|
||||
label: 'iAdvize.com',
|
||||
href: 'https://www.iadvize.com/',
|
||||
internal: false,
|
||||
},
|
||||
],
|
||||
en: [
|
||||
{
|
||||
label: 'Knowledge base',
|
||||
href: 'https://help.iadvize.com/hc/en-gb',
|
||||
internal: false,
|
||||
},
|
||||
{
|
||||
label: 'iAdvize.com',
|
||||
href: 'https://www.iadvize.com/',
|
||||
internal: false,
|
||||
},
|
||||
],
|
||||
}
|
||||
};
|
||||
var courses = document.querySelectorAll('.course-card');
|
||||
var allCategories = [];
|
||||
courses.forEach(function(course){
|
||||
var categories = course.dataset.categories.toLowerCase().split(' ∙ ');
|
||||
allCategories.push(categories);
|
||||
});
|
||||
|
||||
var setRole = function() {
|
||||
if(allCategories.indexOf('admin') > -1){
|
||||
idz.role = 'admin';
|
||||
} else if(allCategories.indexOf('manager') > -1){
|
||||
idz.role = 'manager';
|
||||
}
|
||||
}
|
||||
var setLang = function() {
|
||||
if(allCategories.indexOf('fr') > -1){
|
||||
idz.lang = 'fr';
|
||||
}
|
||||
}
|
||||
|
||||
allCategories = allCategories.flat();
|
||||
|
||||
setRole();
|
||||
|
||||
setLang();
|
||||
|
||||
setBandeauLink(idz.lang);
|
||||
|
||||
// Create Header Navigation
|
||||
(function(){
|
||||
var headerNavigation = document.querySelector('#header__navigation');
|
||||
var headerNavFirst = headerNavigation.firstChild;
|
||||
navigation['header'][idz.lang].forEach(function(navItem) {
|
||||
var li = document.createElement('li');
|
||||
var a = document.createElement('a');
|
||||
a.innerText = navItem.label;
|
||||
a.href= navItem.label;
|
||||
if(navItem.label === 'Webinars') {
|
||||
a.href = getWebinarsLink(idz.role, idz.lang);
|
||||
}else{
|
||||
a.href = navItem.href;
|
||||
}
|
||||
if(!navItem.internal) {
|
||||
a.target = '_blank';
|
||||
}
|
||||
li.appendChild(a);
|
||||
headerNavigation.insertBefore(li, headerNavFirst);
|
||||
});
|
||||
})();
|
||||
|
||||
// Fill tags with wording
|
||||
(function(){
|
||||
var introTitle = document.querySelector('#intro__title');
|
||||
var introContent = document.querySelector('#intro__content');
|
||||
var discoverButton = document.querySelector('#discover-button');
|
||||
var coursesTitle = document.querySelector('#courses__title');
|
||||
var onboardingTitle = document.querySelector('#onboarding__title');
|
||||
var searchInput = document.querySelector('.search__input');
|
||||
var numberOfCourses = document.querySelectorAll('.number-of-courses__label');
|
||||
var dropdownLinks = document.querySelectorAll('.uk-nav-navbar li a');
|
||||
|
||||
|
||||
dropdownLinks.forEach(function(link) {
|
||||
if(link.href.indexOf('/learners/sign_out') > -1) {
|
||||
link.innerText = wording['logout'][idz.lang]
|
||||
}
|
||||
});
|
||||
|
||||
introTitle.innerText = wording['title'][idz.lang];
|
||||
|
||||
introContent.innerText = wording['content'][idz.lang];
|
||||
|
||||
discoverButton.innerText = wording['discover_button'][idz.lang];
|
||||
|
||||
coursesTitle.innerText = wording['courses'][idz.lang];
|
||||
|
||||
onboardingTitle.innerText = wording['onboarding'][idz.lang];
|
||||
|
||||
searchInput.placeholder = wording['search_placeholder'][idz.lang];
|
||||
|
||||
numberOfCourses.forEach(function(item) {
|
||||
item.innerText = wording['number_of_courses'][idz.lang];
|
||||
})
|
||||
})();
|
||||
|
||||
|
||||
|
||||
// Wording of course button
|
||||
(function(){
|
||||
var courses = document.querySelectorAll('.course-card__footer');
|
||||
courses.forEach(function(course){
|
||||
var button = course.children[1];
|
||||
var progression = course.children[2];
|
||||
var progressionPercentage = parseInt(progression.innerText, 10);
|
||||
|
||||
switch(progressionPercentage) {
|
||||
case 0:
|
||||
button.innerText = wording['course_button_start'][idz.lang];
|
||||
progression.innerText = progressionPercentage + wording['course_progress'][idz.lang];
|
||||
break;
|
||||
case 100:
|
||||
button.innerText = wording['course_button_complete'][idz.lang];
|
||||
progression.innerText = progressionPercentage + wording['course_progress'][idz.lang];
|
||||
break;
|
||||
default:
|
||||
button.innerText = wording['course_button_default'][idz.lang];
|
||||
progression.innerText = progressionPercentage + wording['course_progress'][idz.lang];
|
||||
break;
|
||||
}
|
||||
});
|
||||
})();
|
||||
})();
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,604 @@
|
||||
/*
|
||||
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 }}
|
||||
*/
|
||||
:root {
|
||||
--container-max-width: 1260px;
|
||||
--font-title: "ProximaNova-Bold", Helvetica, sans-serif;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "ProximaNova-Bold";
|
||||
src: url("https://s3-us-west-2.amazonaws.com/static.schoolkeep.com/fonts/ProximaNova-Bold.ttf");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "ProximaNova-Reg";
|
||||
src: url("https://s3-us-west-2.amazonaws.com/static.schoolkeep.com/fonts/proximanova-regular-webfont.woff");
|
||||
}
|
||||
body * {
|
||||
font-family: "ProximaNova-Reg", Helvetica, sans-serif;
|
||||
}
|
||||
.bg-isgrey{
|
||||
background: linear-gradient(#F8FBFD, #eff2f7);
|
||||
}
|
||||
.bg-isblue{
|
||||
background: linear-gradient(#025ca0, #025ca0);
|
||||
height: 300px;
|
||||
}
|
||||
.bg-isgrey.bg-reverse{
|
||||
background: linear-gradient(#eff2f7, #F8FBFD);
|
||||
}
|
||||
|
||||
.bg-iswhite{
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.isflex{
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.p-top{
|
||||
padding-top: 120px;
|
||||
}
|
||||
|
||||
.p-top-60{
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.p-bottom{
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
|
||||
.p-bottom-5{
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.p-bottom-30{
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
|
||||
.p-bottom-60{
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
|
||||
.p-bottom-100{
|
||||
padding-bottom: 100px;
|
||||
}
|
||||
|
||||
.w-60{
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.w-50{
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.w-70{
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.w-40{
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.w-25{
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.w-20{
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.w-10{
|
||||
width: 10%;
|
||||
}
|
||||
|
||||
body{
|
||||
margin: 0;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
*{
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
a{
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
img{
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.content-wrapper{
|
||||
width: var(--container-max-width);
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.mainTitle{
|
||||
color: #34393F;
|
||||
font-size: 50px;
|
||||
font-family: var(--font-title);
|
||||
line-height: initial;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.secondTitle{
|
||||
color: #34393F;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.title{
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.text{
|
||||
color: #707689;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.text.medium{
|
||||
font-size: 17px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.cta{
|
||||
padding: 15px 25px;
|
||||
color: #1BC74E;
|
||||
font-size: 15px;
|
||||
border-radius: 40px;
|
||||
border: 1px solid #1BC74E;
|
||||
}
|
||||
|
||||
.cta.isfull{
|
||||
color: #ffffff;
|
||||
background-color: #1BC74E;
|
||||
}
|
||||
|
||||
.link{
|
||||
color: #1BC74E;
|
||||
text-decoration :underline;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.bg-greytowhite{
|
||||
background: linear-gradient(#F8FBFD, #eff2f7);
|
||||
}
|
||||
|
||||
.isflex{
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.w-40{
|
||||
width: 40%
|
||||
}
|
||||
|
||||
.w-60{
|
||||
width: 60%
|
||||
}
|
||||
|
||||
.p-top-bottom{
|
||||
padding-top: 120px;
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
|
||||
/**********/
|
||||
|
||||
.uk-grid-medium>*{
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.content-wrapper{
|
||||
width: var(--container-max-width);
|
||||
margin: 0 auto!important;
|
||||
}
|
||||
|
||||
.uk-button{
|
||||
border-radius: 40px;
|
||||
}
|
||||
|
||||
.uk-panel-teaser {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.uk-panel-teaser img{
|
||||
box-shadow: 0 0 10px rgba(112,118,137,.20);
|
||||
}
|
||||
|
||||
.uk-panel-box .uk-margin-small-bottom{
|
||||
position: absolute;
|
||||
right: 180px;
|
||||
bottom: 35px
|
||||
}
|
||||
|
||||
.uk-panel-box{
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
.uk-panel-box [class*='uk-position-bottom']{
|
||||
position: initial!important;
|
||||
}
|
||||
|
||||
.uk-panel-box>.uk-panel-teaser{
|
||||
margin-left: 0!important;
|
||||
margin-right: 0!important;
|
||||
}
|
||||
|
||||
.uk-panel-title {
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
|
||||
.uk-panel-title a {
|
||||
color: #34393F !important;
|
||||
font-size: 24px;
|
||||
font-family: "ProximaNova-Bold", helvetica, sans-serif;
|
||||
}
|
||||
|
||||
.uk-panel-teaser {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.school-website-header {
|
||||
background: #025ca0;
|
||||
box-shadow: none;
|
||||
padding-top: 26px;
|
||||
}
|
||||
|
||||
.school-website-header .uk-navbar a {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.c--grey {
|
||||
color: #707689;
|
||||
}
|
||||
|
||||
.header__container {
|
||||
max-width: var(--container-max-width);
|
||||
}
|
||||
|
||||
.header__logo img {
|
||||
height: 60px;
|
||||
width: auto;
|
||||
max-height: 60px !important;
|
||||
}
|
||||
|
||||
.head--2 {
|
||||
color: #34393F;
|
||||
font-size: 40px;
|
||||
font-family: var(--font-title);
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.search {
|
||||
width: 200px;
|
||||
border-radius: 100px;
|
||||
overflow: hidden;
|
||||
border: none;
|
||||
margin-left: 15px;
|
||||
box-shadow: 0 0 5px 0 rgba(100,100,100,0.1);
|
||||
}
|
||||
|
||||
.progress-text {
|
||||
display: inline-block;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.number-of-courses {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #D8D8D8;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.number-of-courses__count {
|
||||
justify-self: flex-end;
|
||||
}
|
||||
|
||||
.home__intro {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.course-card {
|
||||
height: 450px;
|
||||
margin-bottom: 110px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
.course-card2 {
|
||||
height: 450px;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.course-card__body {
|
||||
position: relative;
|
||||
min-height: 0 !important;
|
||||
}
|
||||
|
||||
.course-card__body h3 {
|
||||
line-height: initial;
|
||||
}
|
||||
|
||||
.course-card__footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 0 30px;
|
||||
width: 100%;
|
||||
}
|
||||
.container {
|
||||
width: var(--container-max-width);
|
||||
display: flex;
|
||||
margin: auto;
|
||||
}
|
||||
.nav {
|
||||
margin: 0;
|
||||
}
|
||||
.footer {
|
||||
background: #34393F;
|
||||
padding: 60px 0;
|
||||
height: auto;
|
||||
}
|
||||
.footer__nav {
|
||||
width: auto;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
}
|
||||
.footer__nav li {
|
||||
margin-left: 30px;
|
||||
list-style: none;
|
||||
display: inline-block;
|
||||
}
|
||||
.footer__nav .nav__item a {
|
||||
font-size: 15px;
|
||||
color: white !important;
|
||||
}
|
||||
.footer__nav a:hover {
|
||||
opacity: .7;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.footer ul li:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer__container {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.footer__container:after,
|
||||
.footer__container:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Hide "Discover Learning Paths" in navigation */
|
||||
a[href*="learning_paths"]{
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.no-padding-left {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
.preview-banner {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page-wrapper:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
a:not(.uk-button), .uk-link, .sidebar-nav ul li a:hover, .sidebar-nav ul li a:focus, .sidebar-nav ul li .completed i, .sidebar-nav ul li .completed:hover, .sidebar-nav ul li .completed.active, .footer-navigation i.uk-icon-check-circle-o, .uk-modal-close i {
|
||||
color: #707689;
|
||||
}
|
||||
|
||||
.cover-outline-section-activities li.completed:before {
|
||||
background: white !important;
|
||||
}
|
||||
|
||||
.uk-button-link {
|
||||
color: #34393F;
|
||||
}
|
||||
|
||||
.cta.isfull:hover {
|
||||
color: white;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.course__title {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1340px) {
|
||||
.content-wrapper {
|
||||
width: 100%;
|
||||
padding: 60px 5% 100px;
|
||||
}
|
||||
|
||||
.home__image {
|
||||
display: flex;
|
||||
}
|
||||
.course__title,
|
||||
.home__intro
|
||||
{
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.course__image,
|
||||
.home__image
|
||||
{
|
||||
/* width: 60%; */
|
||||
}
|
||||
|
||||
.mainTitle,
|
||||
.home__intro .text {
|
||||
width: 85%;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
padding: 0 5%;
|
||||
}
|
||||
|
||||
.course-card {
|
||||
height: 410px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
.mainTitle, .head--2 {
|
||||
font-size: 44px;
|
||||
}
|
||||
|
||||
.school_website-my_content .content-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.home__intro {
|
||||
width: 70%;
|
||||
}
|
||||
.home__image {
|
||||
/* position: absolute;
|
||||
right: -10%;
|
||||
bottom: 15%;
|
||||
width: 560px; */
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 992px) {
|
||||
.mainTitle, .head--2 {
|
||||
font-size: 36px;
|
||||
}
|
||||
.home__intro {
|
||||
width: 60%;
|
||||
}
|
||||
.home__image {
|
||||
/* right: -11%;
|
||||
bottom: 25%; */
|
||||
}
|
||||
.progress-text {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.course-card {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 960px) {
|
||||
.course-card {
|
||||
height: 460px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 920px) {
|
||||
.mainTitle, .head--2 {
|
||||
font-size: 36px;
|
||||
}
|
||||
.school_website-my_content .content-wrapper {
|
||||
flex-direction: column;
|
||||
}
|
||||
.home__intro {
|
||||
width: 100%;
|
||||
}
|
||||
.home__image {
|
||||
/* right: 9%;
|
||||
bottom: -12%;
|
||||
width: 50%; */
|
||||
}
|
||||
.home__intro .text {
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
.course-card {
|
||||
height: 440px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.mainTitle {
|
||||
font-size: 30px;
|
||||
width: 70%;
|
||||
margin: auto;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.head--2 {
|
||||
font-size: 30px;
|
||||
}
|
||||
.content-wrapper {
|
||||
flex-direction: column-reverse;
|
||||
padding: 0px 5% 30px;
|
||||
}
|
||||
|
||||
.school_website-my_content .content-wrapper {
|
||||
padding: 60px 5% 60px;
|
||||
}
|
||||
.school_website-my_content .mainTitle {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.course__title {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.course__image {
|
||||
width: 80%;
|
||||
margin: 30px auto;
|
||||
}
|
||||
.uk-article span {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
.course-card {
|
||||
height: auto;
|
||||
}
|
||||
.course-card__footer {
|
||||
position: static;
|
||||
padding: 0;
|
||||
}
|
||||
.p-top-60 {
|
||||
padding-top: 0;
|
||||
}
|
||||
.uk-panel-box>.uk-panel-teaser img {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 640px) {
|
||||
.bg-isgrey {
|
||||
padding: 0 5%;
|
||||
}
|
||||
.home__image {
|
||||
/* display: none; */
|
||||
}
|
||||
.uk-panel-box>.uk-panel-teaser {
|
||||
overflow: hidden;
|
||||
height: 230px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 15px;
|
||||
box-shadow: 0 0 10px rgba(112,118,137,.20);
|
||||
}
|
||||
.uk-panel-box>.uk-panel-teaser * {
|
||||
height: 100%;
|
||||
width: auto;
|
||||
max-width: none !important;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,36 @@
|
||||
{% assign course_categories = course.categories | map: "name" %}
|
||||
|
||||
<div class="np-card card-courses" data-category="{{course_categories}}">
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.instructor_names }}
|
||||
</div>
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
{% 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,72 @@
|
||||
{% assign lp_categories = learning_path.categories | map: "name" %}
|
||||
|
||||
<div class="np-card np-no-horizontal-padding card-learning-path" data-categories="{{lp_categories}}">
|
||||
<div class="np-card-container">
|
||||
<div class="np-learning-path">
|
||||
<img
|
||||
alt="{{ learning_path.name }}"
|
||||
class="np-card-image np-learning-path-image"
|
||||
src="{{ learning_path.image_url }}"
|
||||
/>
|
||||
<div class="np-card-text-wrapper">
|
||||
<div class="np-hidden-desktop np-card-header">
|
||||
<i class="np-card-header-icon far fa-road"></i>
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<div class="np-hidden-desktop np-card-header-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-card-header">
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<i class="np-card-header-icon far fa-road"></i>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ learning_path.instructor_names }}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-description">
|
||||
{{ learning_path.description }}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ learning_path.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-hidden-desktop np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
<a class="np-button" href="{% route learning_path, id: learning_path.id %}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
<span class="np-hidden-mobile np-learning-path-items">
|
||||
<i class="np-button-color np-learning-path-items-icon far fa-graduation-cap"></i>
|
||||
<span class="np-learning-path-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-stack">
|
||||
<div class="np-card-stack-level-1"></div>
|
||||
<div class="np-card-stack-level-2"></div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,318 @@
|
||||
<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? %}
|
||||
<select id="languageDropdown">
|
||||
<option value="all">All Languages</option>
|
||||
<option value="EN">English</option>
|
||||
<option value="FR">French</option>
|
||||
</select>
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input np-header-font-background-color"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button
|
||||
class="np-header-avatar-button"
|
||||
data-test="open-desktop-menu"
|
||||
data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip"
|
||||
data-toggle-outside
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
aria-label="{% t shared.sign_in %}"
|
||||
href="{% route login %}"
|
||||
>
|
||||
{% t shared.sign_in %}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form
|
||||
class="np-header-search"
|
||||
data-test="mobile-search"
|
||||
method="get"
|
||||
action="{% route search %}"
|
||||
>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
<style>
|
||||
/* Reset default styles for the dropdown */
|
||||
select {
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
background-color: transparent;
|
||||
border: 1px solid #ddd;
|
||||
padding: 8px 20px;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
width: 200px;
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
/* Style the dropdown arrow */
|
||||
select::-ms-expand {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Style the selected option */
|
||||
select option:checked {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
/* Style the dropdown when hovered */
|
||||
select:hover {
|
||||
border-color: #aaa;
|
||||
}
|
||||
|
||||
/* Style the dropdown when focused */
|
||||
select:focus {
|
||||
border-color: #007bff;
|
||||
}
|
||||
|
||||
/* Style the dropdown options */
|
||||
select option {
|
||||
padding: 8px 20px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
/* Style the dropdown container */
|
||||
.dropdown-container {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* Style the arrow icon */
|
||||
.arrow-icon {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
pointer-events: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
window.addEventListener("DOMContentLoaded", () => {
|
||||
setLanguageFromCookie()
|
||||
})
|
||||
|
||||
// Event listener for the language dropdown
|
||||
const languageDropdown = document.getElementById("languageDropdown");
|
||||
|
||||
languageDropdown.addEventListener("change", (event) => {
|
||||
const selectedLanguage = event.target.value;
|
||||
filterCoursesByLanguage(selectedLanguage);
|
||||
filterLearningPathsByLanguage(selectedLanguage)
|
||||
addToLanguageCookies(selectedLanguage);
|
||||
});
|
||||
|
||||
// Function to filter courses based on selected language
|
||||
function filterCoursesByLanguage(selectedLanguage) {
|
||||
const courseCards = document.querySelectorAll(".card-courses");
|
||||
|
||||
courseCards.forEach((course) => {
|
||||
const courseLanguage = course.getAttribute("data-category");
|
||||
|
||||
if (selectedLanguage === "all" || courseLanguage.includes(selectedLanguage)) {
|
||||
course.parentElement.style.display = "block";
|
||||
} else {
|
||||
course.parentElement.style.display = "none";
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function filterLearningPathsByLanguage(selectedLanguage) {
|
||||
const learningPathCards = document.querySelectorAll(".card-learning-path");
|
||||
|
||||
learningPathCards.forEach((learningPath) => {
|
||||
const learningPathLanguage = learningPath.getAttribute("data-categories");
|
||||
|
||||
if (selectedLanguage === "all" || learningPathLanguage.includes(selectedLanguage)) {
|
||||
learningPath.parentElement.style.display = "block";
|
||||
} else {
|
||||
learningPath.parentElement.style.display = "none";
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function setLanguageFromCookie() {
|
||||
cookie = getCookie("IAdviseLangugage")
|
||||
|
||||
if (cookie != "") {
|
||||
filterCoursesByLanguage(cookie);
|
||||
filterLearningPathsByLanguage(cookie)
|
||||
document.getElementById("languageDropdown").value = cookie
|
||||
}
|
||||
}
|
||||
|
||||
function addToLanguageCookies(selectedLanguage) {
|
||||
document.cookie = `IAdviseLangugage=${selectedLanguage}`;
|
||||
}
|
||||
|
||||
function getCookie(cname) {
|
||||
let name = cname + "=";
|
||||
let decodedCookie = decodeURIComponent(document.cookie);
|
||||
let ca = decodedCookie.split(';');
|
||||
for(let i = 0; i <ca.length; i++) {
|
||||
let c = ca[i];
|
||||
while (c.charAt(0) == ' ') {
|
||||
c = c.substring(1);
|
||||
}
|
||||
if (c.indexOf(name) == 0) {
|
||||
return c.substring(name.length, c.length);
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,49 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="{{ homepage.artwork_url }}"
|
||||
alt="{{ homepage.headline }}"
|
||||
/>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
{{ homepage.headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
{{ homepage.subheadline }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<div class="np-homepage-featured np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
{{ homepage.featured_courses_headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline">
|
||||
{{ homepage.featured_courses_subheadline }}
|
||||
</div>
|
||||
</div>
|
||||
{% if courses.featured.any? %}
|
||||
<div class="np-homepage-featured-courses row">
|
||||
{% for course in courses.featured %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="np-homepage-featured-empty">
|
||||
<div class="np-zero-state-text">
|
||||
{% t .empty, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<img
|
||||
class="np-zero-state-courses"
|
||||
alt="{% t .empty, key: current_school.course_vocabulary %}"
|
||||
/>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -0,0 +1,26 @@
|
||||
/*
|
||||
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 }}
|
||||
*/
|
||||
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
|
||||
|
||||
.np-homepage-headline, .np-card-content-title,
|
||||
.np-dashboard-resources-title, .np-resource-title,
|
||||
.np-top-title, .np-learning-path-banner-headline,
|
||||
.np-card-heading, np-learning-path-certificate-name,
|
||||
.np-text-title, .np-course-outline-title,
|
||||
.np-card-heading, .np-text-title-bold {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
|
||||
.np-card-ribbon {
|
||||
background: #1BC74E;
|
||||
}
|
||||
Reference in New Issue
Block a user