navigation soulignage de la section active
This commit is contained in:
parent
156ceebfcd
commit
95025de301
3 changed files with 20 additions and 13 deletions
|
@ -77,12 +77,17 @@ header ul li {
|
||||||
}
|
}
|
||||||
|
|
||||||
header .nav-item {
|
header .nav-item {
|
||||||
padding: 4px 2px;
|
padding: 8px 6px;
|
||||||
|
margin: 0 10px;
|
||||||
color: var(--primary-text-color);
|
color: var(--primary-text-color);
|
||||||
|
|
||||||
&:hover, &:active, &:focus {
|
&:hover, &:active, &:focus {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
border-bottom: white solid 2px;
|
border-bottom: white solid 1px;
|
||||||
|
}
|
||||||
|
&.active {
|
||||||
|
text-decoration: none;
|
||||||
|
border-bottom: white solid 3px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,20 +1,27 @@
|
||||||
{% macro render_header() %}
|
{% macro render_header() %}
|
||||||
{% set section = get_section(path="_index.md") %}
|
{% set root_section = get_section(path="_index.md") %}
|
||||||
|
{% set active_section = "" %}
|
||||||
|
{% if page and page.components %}
|
||||||
|
{% set active_section = page.components[0] %}
|
||||||
|
{% elif section and section.components %}
|
||||||
|
{% set active_section = section.components[0] %}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<a href="{{ root_section.permalink }}">
|
||||||
<a href="{{ section.permalink }}">
|
|
||||||
<div class="logo">
|
<div class="logo">
|
||||||
<img src="{{ get_url(path=config.extra.juice_logo_path) }}" alt="logo">
|
<img src="{{ get_url(path=config.extra.juice_logo_path) }}" alt="logo">
|
||||||
{{ config.extra.juice_logo_name }}
|
{{ config.extra.juice_logo_name }}
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<nav>
|
<nav>
|
||||||
<ul>
|
<ul>
|
||||||
{% for subpath in section.subsections %}
|
{% for subpath in root_section.subsections %}
|
||||||
{% set sub = get_section(path=subpath) %}
|
{% set sub = get_section(path=subpath) %}
|
||||||
|
{% set is_active = sub.components[0] == active_section %}
|
||||||
{% if not 'hide_from_menu' in sub.extra or not sub.extra.hide_from_menu %}
|
{% if not 'hide_from_menu' in sub.extra or not sub.extra.hide_from_menu %}
|
||||||
<li><a class="nav-item text" href="{{ sub.permalink }}">{{ sub.title }}</a></li>
|
<li>
|
||||||
|
<a class="nav-item text{% if is_active %} active{% endif %}" href="{{ sub.permalink }}">{{ sub.title }}</a>
|
||||||
|
</li>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% if config.extra.juice_extra_menu %}
|
{% if config.extra.juice_extra_menu %}
|
||||||
|
|
|
@ -3,11 +3,6 @@
|
||||||
|
|
||||||
{% block title %}{{ page.title }} | {{ super() }} {% endblock title %}
|
{% block title %}{{ page.title }} | {{ super() }} {% endblock title %}
|
||||||
|
|
||||||
{% block header %}
|
|
||||||
<header class="box-shadow">
|
|
||||||
{{ macros::render_header() }}
|
|
||||||
</header>
|
|
||||||
{% endblock header %}
|
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="heading-text">{{ page.description }}</div>
|
<div class="heading-text">{{ page.description }}</div>
|
||||||
|
|
Loading…
Reference in a new issue