<button class="usa-nav__close">
<img src="../../dist/img/usa-icons/close.svg" role="img" alt="Cerrar">
</button>
<ul class="usa-nav__primary usa-accordion">
<li class="usa-nav__primary-item">
<button class="usa-accordion__button usa-nav__link usa-current" aria-expanded="false" aria-controls="undefinednav-section-one">
<span><Current section></span>
</button>
<ul id="undefinednav-section-one" class="usa-nav__submenu">
<li class="usa-nav__submenu-item">
<a href="#">
<Navigation link>
</a>
</li>
<li class="usa-nav__submenu-item">
<a href="#">
<Navigation link>
</a>
</li>
<li class="usa-nav__submenu-item">
<a href="#">
<Navigation link>
</a>
</li>
</ul>
</li>
<li class="usa-nav__primary-item">
<button class="usa-accordion__button usa-nav__link" aria-expanded="false" aria-controls="undefinednav-section-two">
<span><Section></span>
</button>
<ul id="undefinednav-section-two" class="usa-nav__submenu">
<li class="usa-nav__submenu-item">
<a href="#">
<Navigation link>
</a>
</li>
<li class="usa-nav__submenu-item">
<a href="#">
<Navigation link>
</a>
</li>
<li class="usa-nav__submenu-item">
<a href="#">
<Navigation link>
</a>
</li>
</ul>
</li>
<li class="usa-nav__primary-item">
<a href="javascript:void(0)" class="usa-nav__link">
<span><Simple link></span>
</a>
</li>
</ul>
No notes defined.
{% macro primaryLink(href, class, is_current, text) %}
{% set link_classes = class ~ ('usa-current' if is_current) %}
<a href="{{ href }}" {% if link_classes %}class="{{ link_classes }}"{% endif %}>
{% if class %}
<span>{{ text }}</span>
{% else %}
{{ text }}
{% endif %}
</a>
{% endmacro %}
<button class="usa-nav__close">
<img src="{{ uswds.path }}/img/usa-icons/close.svg" role="img" alt="{{ nav.close.label }}">
</button>
<ul class="usa-nav__primary usa-accordion">
{%- for link in nav.links -%}
<li class="usa-nav__primary-item">
{% if link.links -%}
{% set nav_id = nav.id_prefix ~ link.id %}
<button
class="usa-accordion__button usa-nav__link{% if link.is_current %} usa-current{% endif %}"
aria-expanded="false"
aria-controls="{{ nav_id }}">
<span>{{ link.text }}</span>
</button>
{% if not nav.mega %}
<ul id="{{ nav_id }}" class="usa-nav__submenu">
{%- for child in link.links -%}
{%- if loop.index < 4 -%}
<li class="usa-nav__submenu-item">
{{ primaryLink(child.href, '', child.is_current, child.text) }}
</li>
{%- endif -%}
{%- endfor -%}
</ul>
{% else %}
<div id="{{ nav_id }}" class="usa-nav__submenu usa-megamenu">
<div class="grid-row grid-gap-4">
{%- for group in link.links | batch(3) -%}
<div class="usa-col">
<ul class="usa-nav__submenu-list">
{%- for child in group -%}
<li class="usa-nav__submenu-item">
{{ primaryLink(child.href, '', child.is_current, child.text) }}
</li>
{%- endfor -%}
</ul>
</div>
{%- endfor -%}
</div>
</div>
{% endif %}
{%- else -%}
{{ primaryLink(link.href, 'usa-nav__link', link.is_current, link.text) }}
{% endif -%}
</li>
{%- endfor -%}
</ul>
{%- if nav.search -%}
{%
set search_opts = {
search_header: true,
id_prefix: nav.id_prefix
}
%}
{% if lang == "es" %}
{% render '@search--small-lang-es', search_opts, true %}
{% else %}
{% render '@search--small', search_opts, true %}
{% endif %}
{%- endif -%}
package:
name: null
version: 2.1.0
uswds:
path: ../../dist
lang: es
nav:
search: false
close:
label: Cerrar
links:
- text: <Current section>
is_current: true
id: nav-section-one
links:
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
is_current: false
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
- text: <A very long navigation link that goes onto two lines>
href: '#'
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
- text: <Section>
id: nav-section-two
links:
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
is_current: false
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
- text: <A very long navigation link that goes onto two lines>
href: '#'
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
- text: <Navigation link>
href: '#'
- text: <Simple link>
href: javascript:void(0)