A question on creating navigation

[Connohendo]

I'm working on using Jekyll to create a documentation website for my work. They want me to make something that looks like: https://registry.terraform.io/

I plan on using the https://jekyllthemes.io/theme/minimal-mistakes theme to make the site look good and because it supports the cards on the front of terraform.

My problem is I need a way to make a navigation system based off a script that pulls a bunch of README.md and CHANGELOG.md files. Could anyone give me a run down on how I would do this?

It must be formatted like so:

• Repo
  • README.md
  • CHANGELOG.md
• Repo
  • README.md
  • CHANGELOG.md
• Repo
  • README.md
  • CHANGELOG.md

I'd appreciate any help and any explanation on the navigation system building. Bonus points if i can automate it to be create based off the files pulled by my script.
Thanks in advanced.

[edheltzel]

You can just create a yaml or json file inside of your _data and then loop over those items.
create nav.yaml at _data/nav.yaml

this file would look something like this:

main:
  - name: REPO NAME
    url: '/PATH_TO_REPO/'
    submenu:
      - name: 'REPO README'
        url: '/PATH_TO_REPO_README/'
      - name: 'REPO CHANGELOG'
        url: '/PATH_TO_REPO_CHANGELOG/'

In your layout or include HTML file

          {%- for repo in site.data.nav.main -%}
            <li class="nav__item">
              <a href="{{repo.url}}" class="nav__item-link">{{repo.title}}</a>
           {% if repo.submenu %}
            <ul>
                {%- for subnav in repo.submenu -%}
                 <li class="nav__item">
                  <a href="{{ subnav.url }}" class="nav__item-link">{{ subnav.name }}</a>
                </li>
                {%- endfor -%}
            </ul>
          {% endif %}
            </li>
          {%- endfor -%}

repo can be anything you want