title: What component is used in the Twitter Bootstrap's docs for sidebar?
body: <p>I'm wondering what is the easiest way to build this kind of sidebar with Bootstrap 4.</p>
  
  <blockquote>
    <p><a href="https://i.stack.imgur.com/3eKwN.png" rel="noreferrer"><img src="https://i.stack.imgur.com/3eKwN.png" alt=""></a></p>
  </blockquote>
  
  <p>To me, it looks like a custom component they built for the docs page, not being included in the framework. I'm not sure if I'm right.</p>
  
  <pre><code>&lt;ul class="nav bd-sidenav"&gt;
    &lt;li class="active bd-sidenav-active"&gt;
      &lt;a href="/docs/4.0/getting-started/introduction/"&gt;
        Introduction
      &lt;/a&gt;
    &lt;/li&gt;
    &lt;li&gt;
      &lt;a href="/docs/4.0/getting-started/download/"&gt;
        Download
      &lt;/a&gt;
    &lt;/li&gt;
     ...
  &lt;/ul&gt;
  </code></pre>
  
  <p>The closest I got was by creating something like this:</p>
  
  <pre><code>&lt;ul class="nav"&gt;
    &lt;li class="w-100"&gt;
      &lt;a href="#"&gt;
        Item 1
      &lt;/a&gt;
    &lt;/li&gt;
     ...
  &lt;/ul&gt;
  </code></pre>
  
  <p>But I think there should be a better way.</p>
  
  <p>What is the right way to build such a sidebar/table of contents with Bootstrap 4?</p>