site/_includes/themes/apache/_navigation_doc.html

<nav id="navbar" class="doc-nav" data-spy="affix" data-offset-top="60" data-offset-bottom="200">
    {% assign DOC_PAGES = .site.pages | where: "type", "doc" %}
    {% assign DOC_GROUPS = DOC_PAGES | group_by: "section" %}
    {% assign ACTIVE_PAGE_ID = .page.path %}

    <style>
        .doc-nav h3 {
            text-transform: uppercase;
            font-size: 2rem;
            color: black;
        }

        .doc-nav a {
            color: #666;
            display: block;
            margin-left: 0px;
            font-weight: 400;
            text-decoration: none;
            padding-left: 0px !important;
        }

        .doc-nav a.active {
            color: #C15757;
        }

        .doc-nav li .doc-section {
            border-bottom: 1px solid #ccc;
        }
        .doc-nav li:last-child .doc-section {
            border-bottom: 0px;
        }
    </style>
    <ul class="nav">
    {% for s in site.data.documentation %}
        {% assign g = DOC_GROUPS | where: "name", s.section_id | first %}
        {% assign pages = g["items"] | default: [] %}
        {% if pages | size > 0 %}
            {% assign pages = pages | sort: "weight" %}
        {% endif %}

        <li>
            <div class="doc-section">
                <h3>{{ s.section_name }}</h3>
                <ul class="nav">
                    {% for p in pages %}
                        <li>
                            <a class="{% if p.path == ACTIVE_PAGE_ID %}active{% endif %}"
                                href="{{ p.url }}">{{ p.title }}</a>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        </li>
    {% endfor %}
    </ul>
</nav>