Files
Gainsight/Custom_Templates/customer_templates/Walmart Scintilla Prod/_sub_navigation.html.liquid

50 lines
2.0 KiB
Plaintext

<nav class="np-sub-navigation np-hidden-mobile">
<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>
{{ link.label }}
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
{% endfor %}
<div class="np-sub-navigation-content-item articles-link">
<a class="np-sub-navigation-content-item-link" href="/app/articles">
<i class="far fa-file-alt np-button-color np-sub-navigation-content-item-icon"></i>
Blog
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
<div class="np-sub-navigation-content-item certifications-link">
<a class="np-sub-navigation-content-item-link" href="/app/certifications">
<i class="far fa-file-certificate np-button-color np-sub-navigation-content-item-icon"></i>
Certifications
</a>
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
</div>
</div>
</nav>
<script>
if (window.location.pathname == "/app/articles") {
document.querySelector(".articles-link").classList.add("np-sub-navigation-content-item-active")
} else {
document.querySelector(".articles-link").classList.add("np-sub-navigation-content-item-inactive")
}
if (window.location.pathname == "/app/certifications") {
document.querySelector(".certifications-link").classList.add("np-sub-navigation-content-item-active")
} else {
document.querySelector(".certifications-link").classList.add("np-sub-navigation-content-item-inactive")
}
</script>
<style>
.np-sub-navigation-content-item-link,
.np-sub-navigation-content-item-active .np-sub-navigation-content-item-link {
color:#333;
}
</style>