Better submenus in Sidebar component

[aManNamedJed]

The submenu items need to look like they're a separate submenu with better spacing to indicate they are nested under the parent

This markup needs to be improved too:

Instead of all existing in a single list, submenus should become a separate ul:

# Psuedocode

<ul class="nav-top">
    <li class="nav-item-top">Introduction</li>
    <li class="nav-item-top">Installation</li>
    <li class="nav-item-top">Monorepo</li>
    <li class="nav-item-top has-submenu">
        Blocks
        <ul class="nav-sub">
            <li class="nav-item-sub">Create a block</li>
            <li class="nav-item-sub">Block Structure</li>
        </ul>
    </li>
</ul>

Where is this code?
blocks/src/components/Elements/Sidebar/Sidebar.tsx

What's the easiest way to fix?
Edit the story blocks/src/components/Elements/Sidebar/Sidebar.stories.tsx and pass in some values that need to be storted and should include submenus like this:

export const Default = Template.bind({})
Default.args = {
  menuItems: [
    {
      title: "Using the monorepo",
      path: "docs/v0.1.0/monorepo",
      order: "1.0"
    },
    {
      title: "Using the monorepo",
      path: "docs/v0.1.0/monorepo",
      order: "1.1"
    },
    {
      title: "Using the monorepo",
      path: "docs/v0.1.0/monorepo",
      order: "2.0"
    },
    {
      title: "Using the monorepo",
      path: "docs/v0.1.0/monorepo",
      order: "3.0"
    },
  ],
}