103 lines
2.5 KiB
Plaintext
103 lines
2.5 KiB
Plaintext
{% assign omni = false %}
|
|
{% assign core = false %}
|
|
{% assign log_out = true %}
|
|
|
|
{% if current_person.signed_in? %}
|
|
{% assign log_out = false %}
|
|
{% for group in current_person.groups %}
|
|
{% if group.name contains 'Core' %}
|
|
{% assign core = true %}
|
|
{% elsif group.name contains 'Omni' %}
|
|
{% assign omni = true %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
{% endif %}
|
|
|
|
{% if log_out %}
|
|
<script>
|
|
window.location.replace('https://academy.cin7.com/learners/sign_in');
|
|
</script>
|
|
{% endif %}
|
|
|
|
{% include "header" %}
|
|
<div class="hero-homepage">
|
|
<div class="np-max-width">
|
|
<div class="hero-text">Learning Paths</div>
|
|
<div class="hero-subheading">Explore curated learning paths tailored to your function and role.</div>
|
|
</div>
|
|
</div>
|
|
<main class="np-main np-learning-paths np-subpage-container catalog-container np-max-width">
|
|
{% comment %} <div class="filter-container">
|
|
{% include 'filters_lp' %}
|
|
</div> {% endcomment %}
|
|
<div class="catalog-content-wrapper">
|
|
<div class="np-learning-paths-main np-max-width">
|
|
{% include "learning_paths_index", items: learning_paths.available %}
|
|
</div>
|
|
</div>
|
|
</main>
|
|
{% include "footer" %}
|
|
|
|
<style>
|
|
.catalog-container {
|
|
display: flex;
|
|
gap: 20px;
|
|
padding: 5% 20px;
|
|
}
|
|
.filter-container {
|
|
width: 25%;
|
|
margin: 10px;
|
|
}
|
|
|
|
.filters-container {
|
|
width: 20%;
|
|
border: 3px solid #002e6e;
|
|
border-radius: 25px;
|
|
}
|
|
.catalog-courses-container {
|
|
width: 100%;
|
|
}
|
|
@media only screen and (max-width: 768px) {
|
|
.catalog-container {
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
.filter-container {
|
|
width: 100%;
|
|
}
|
|
.catalog-content-wrapper {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
</style>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
const categoriesFromURL = urlParams.getAll('category');
|
|
if (categoriesFromURL.length === 0) {
|
|
return;
|
|
}
|
|
const cards = document.querySelectorAll('.lp-card');
|
|
|
|
const cardMatchesCategories = (card, categories) => {
|
|
const cardCategories = card.getAttribute('categories').split('[$]');
|
|
return categories.every(category => cardCategories.includes(category));
|
|
};
|
|
|
|
const filterCards = () => {
|
|
cards.forEach(card => {
|
|
if (cardMatchesCategories(card, categoriesFromURL)) {
|
|
card.style.display = 'block';
|
|
} else {
|
|
card.style.display = 'none';
|
|
}
|
|
});
|
|
};
|
|
|
|
filterCards();
|
|
});
|
|
|
|
</script> |