List Pages for Subdirectory

I am using the Tokiwa theme for this project.

here is a link to my repo

In my content folder I have my folders organized as they are in this reference image.

I want to have The main topic (writing) displayed on the home page. If you click on writing I want it to take you to a list page showing the subdirectories “Poems” and “Short Stories” Then if you click on either of those I want it to take you to another list page showing all of the content. I have other broad topics such as “Programming” organized in this same hierarchy and I wanted to get this same set up for each one. Currently my list.html is

{{ define "main" }}
<main>
<article>
    <header>
        <h1>{{.Title}}</h1>
    </header>
    <!-- "{{.Content}}" pulls from the markdown content of the corresponding _index.md -->
    {{.Content}}
</article>
<ul>
<!-- Ranges through content/posts/*.md -->
{{ range .Pages }}
{{.Dir}}<br>
    <li>
        <a href="{{.Permalink}}">{{.Date.Format "2006-01-02"}} | {{.Title}}</a>
    </li>
{{ end }}
</ul>
{{ end }}

Which seems close, but not exactly right.

Thank you for any help you can offer on this issue.

You most likely need to use:

.RegularPagesRecursive

Collection of all regular pages under a list page. This includes regular pages in nested sections/ list pages.

This feature was added in Hugo version 0.68.0

The quote is from the following page of the Hugo Documentation:

Thank you for your response,

How exactly would I use that variable? Also would that help me show the page of subdirectories “poems” and “short stories”?