Deuxfleurs/guide.deuxfleurs.fr
23
4
Fork 10
Code Issues 4 Pull requests 3 Projects Releases Wiki Activity

feat(nav): soulignage de la section active dans la topbar

Browse source
This commit is contained in:
ADRN 2024-12-08 15:16:03 +01:00 committed by Marion
parent 322457d8e5
commit 953a3593f9
4 changed files with 32 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
sass/juice.scss
View file

@ -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;
} }
} }

19
templates/_macros.html
View file

@ -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 %}

15
templates/_nav.html
View file

@ -17,9 +17,11 @@
{{ nav::hamburger(root=root) }} {{ nav::hamburger(root=root) }}
{# Section title #} {# Section title #}
<!-- <div class="toc-item toc-section"> --> {#
<!-- <a class="subtext" href="{{root.permalink | safe}}">{{ root.title }}</a> --> <div class="toc-item toc-section">
<!-- </div> --> <a class="subtext" href="{{root.permalink | safe}}">{{ root.title }}</a>
</div>
#}
{# Choose between "tree" (has extra.parent) and "list" (default) collections #} {# Choose between "tree" (has extra.parent) and "list" (default) collections #}
{% set root_tree = root.pages | group_by(attribute="extra.parent") %} {% set root_tree = root.pages | group_by(attribute="extra.parent") %}
@ -46,7 +48,12 @@
{# (Private) Build a breadcrumb for the page #} {# (Private) Build a breadcrumb for the page #}
{# It's ugly because this is the hacky part of the project #} {# It's ugly because this is the hacky part of the project #}
{% macro breadcrumb(corpus, root, target) %}{% if 'parent' in target.extra and target.extra.parent != root %}{% set new_target = get_page(path=target.extra.parent) %}{{ nav::breadcrumb(corpus=corpus, root=root, target=new_target) }}:{{ new_target.relative_path }}{% endif %}{% endmacro %} {% macro breadcrumb(corpus, root, target) %}
{% if 'parent' in target.extra and target.extra.parent != root %}
{% set new_target = get_page(path=target.extra.parent) %}
{{ nav::breadcrumb(corpus=corpus, root=root, target=new_target) }}:{{ new_target.relative_path }}
{% endif %}
{% endmacro %}
{# (Private) Render a list menu (this is the simple fallback when extra.parent is not defined #} {# (Private) Render a list menu (this is the simple fallback when extra.parent is not defined #}
{% macro list(list, selected) %} {% macro list(list, selected) %}

5
templates/page.html
View file

@ -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>