How to create drop down pages?

Hello, I am using Materalize CSS and I have started going through and changing the Deliver theme to suit my needs.

--- html
<div class="navbar-fixed">
<nav>
<div class="nav-wrapper grey darken-3">
<a href="#!" class="brand-logo ">LOGO</a>
<a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons"><span class="fa fa-caret-square-o-down"></span></i></a>
<ul class="right hide-on-med-and-down">
{% if theme_config.dropdown.enabled %}
{{ _self.loop(pages) }}
{% else %}
{% for page in pages.children.visible %}
{% set current_page = (page.active or page.activeChild) ? 'active' : '' %}
<li class="{{ current_page }}">
<a href="{{ page.url }}">
{% if page.header.icon %}<i class="fa fa-{{ page.header.icon }}"></i>{% endif %}
{{ page.menu }}
</a>
</li>
{% endfor %}
{% endif %}
</ul>
<ul class="side-nav" id="mobile-demo">
{% if theme_config.dropdown.enabled %}
{{ _self.loop(pages) }}
{% else %}
{% for page in pages.children.visible %}
{% set current_page = (page.active or page.activeChild) ? 'active' : '' %}
<li class="{{ current_page }}">
<a href="{{ page.url }}">
{% if page.header.icon %}<i class="fa fa-{{ page.header.icon }}"></i>{% endif %}
{{ page.menu }}
</a>
</li>
{% endfor %}
{% endif %}
</ul>
</div>
</nav>
</div>

The html code of a basic navbar looks like : 

--- html

<!-- Dropdown Structure -->
<ul id="dropdown1" class="dropdown-content">
  <li><a href="#!">one</a></li>
  <li><a href="#!">two</a></li>
  <li class="divider"></li>
  <li><a href="#!">three</a></li>
</ul>
<nav>
  <div class="nav-wrapper">
    <a href="#!" class="brand-logo">Logo</a>
    <ul class="right hide-on-med-and-down">
      <li><a href="sass.html">Sass</a></li>
      <li><a href="badges.html">Components</a></li>
      <!-- Dropdown Trigger -->
      <li><a class="dropdown-button" href="#!" data-activates="dropdown1">Dropdown<i class="material-icons right">arrow_drop_down</i></a></li>
    </ul>
  </div>
</nav>

I can see that the code for " theme_config.dropdown.enabled" but I don't see where it is located and to create child pages. I also want my child page to override the default base.html.twig which I assume is possible. I basically want to create a product child page.
What would my folder structure look like to achieve this?
My current folder structure for skincare is : 02.skincare/_modularpages
_modularpages
I want to achieve "silver" as a child page of "skincare" therefore would it look like 02.skincare/01.silver ?

I understand that my default makrdown has to specify the page as

content:
    items:
      '@page.children': /silver
                                /gold
                                /plantinum
---

I can't speak for "Materialize" theme as I didn't design that, but it appears much of the logic was ported from "Antimatter" theme which does have a similar approach for dropdown menus.

Once you have your pages build in a nested structure, really the only thing to enable dropdown menus is to 'turn it on in the theme config'. Once enabled, the navigation Twig, will keep recursing through the visible children to build a more in-depth navigation tree.

The only other element required is the CSS to render it appropriately.