Files
Gainsight/Custom_Templates/customer_templates/WSGC - New Hire/_sub_navigation.html.liquid

69 lines
2.2 KiB
Plaintext

<nav class="np-sub-navigation">
<div class="np-sub-navigation-content">
{% for link in navigations.sub_navigation %}
{% if link.label == "Dashboard" %}
<div class="np-sub-navigation-content-item {{ link.active_class }}">
<a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
New Hire Training
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
{% endif %}
{% endfor %}
<div class="np-sub-navigation-content-item supplementals-link">
<a class="np-sub-navigation-content-item-link" href="/app/supplementals">
Supplementals
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
<div class="np-sub-navigation-content-item supplementals-link">
<a class="np-sub-navigation-content-item-link" href="/app/TO-BE-CHANGED">
TO BE CHANGED
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
{% for course in courses.enrolled %}
{% for category in course.categories %}
{% if category.name == "Instructor-Led" %}
<div class="np-sub-navigation-content-item ilt-link">
<a class="np-sub-navigation-content-item-link" href="/app/instructor-led-training">
Instructor-Led Training
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
{% endif %}
{% endfor %}
{% endfor %}
</div>
</nav>
<style>
.np-sub-navigation {
border-top: 1px solid #000;
border-bottom: 1px solid #000;
padding-top: 12px;
}
.np-sub-navigation-content-item-link {
height: auto;
color: #000;
}
.np-sub-navigation-content-item.active > a {
font-weight: 500;
}
.np-sub-navigation-content-item.active .np-sub-navigation-content-item-bar {
display: block;
}
</style>
<script>
if (window.location.pathname == "/app/supplementals") {
document.querySelector(".supplementals-link").classList.add("active")
}
if (window.location.pathname == "/app/instructor-led-training") {
document.querySelector(".ilt-link").classList.add("active")
}
</script>