Left-Hand Menu

Left-Hand Menu

Note: The Left-Hand Menu will be hidden for small devices

Sample Page

Austin readymade church-key fanny pack meditation. Tote bag cold-pressed craft beer semiotics, food truck meh try-hard paleo Odd Future quinoa keytar High Life chia street art. PBR YOLO dreamcatcher, irony art party forage High Life tattooed. Pour-over freegan Blue Bottle, McSweeney's cray Bushwick cardigan biodiesel. Fanny pack VHS polaroid cred. Sartorial deep v Bushwick tattooed. Brunch fingerstache food truck DIY, mumblecore squid vinyl post-ironic tofu forage XOXO meggings.

Mlkshk tattooed gentrify art party, chillwave health goth 3 wolf moon polaroid viral literally Kickstarter flannel migas yr. Messenger bag Odd Future actually, authentic leggings polaroid photo booth fap Portland gastropub aesthetic brunch. Marfa roof party wolf mixtape, VHS retro salvia Blue Bottle squid four loko. Neutra slow-carb PBR gluten-free, kale chips sartorial Odd Future lo-fi blog butcher Vice semiotics Bushwick biodiesel Austin. Twee scenester try-hard, Pinterest put a bird on it viral cold-pressed four dollar toast hoodie Tumblr vegan tote bag plaid crucifix. PBR biodiesel fashion axe, banjo cornhole seitan chia twee swag art party kale chips bicycle rights 3 wolf moon Pitchfork. Pinterest aesthetic Carles wolf, mlkshk seitan hashtag vinyl cred listicle fixie street art single-origin coffee.

Note: In production, the Left-Hand Menu will be against the left-hand side of the window, with it's height always extending to the bottom.
<div id="sampleLeftHandMenu" class="has-sidebar">
  <div class="dnb-left-hand-menu hidden-xs">
    <ul class="nav nav-pills nav-stacked">
      <li role="presentation"><a href="#">Menu Item</a></li>
      <li role="presentation" class="active"><a href="#">Menu Item</a></li>
      <li role="presentation"><a href="#">Menu Item</a></li>
      <li role="presentation">
        <a class="accordion-toggle" data-toggle="accordion" href="#" role="button" aria-expanded="false">
          Menu Item <span class="caret"></span>
        </a>
        <ul class="accordion-menu" role="menu">
          <li><a href="#">Sub Menu Item</a></li>
          <li><a href="#">Sub Menu Item</a></li>
          <li>
            <a class="accordion-toggle" data-toggle="accordion" href="#" role="button" aria-expanded="false">
              Sub Menu Item <span class="caret"></span>
            </a>
            <ul class="accordion-menu" role="menu">
              <li><a href="#">Sub Menu Item</a></li>
              <li><a href="#">Sub Menu Item</a></li>
            </ul>
          </li>
          <li><a href="#">Sub Menu Item</a></li>
        </ul>
      </li>
      <li role="presentation"><a href="#">Menu Item</a></li>
      <li role="presentation">
        <a class="accordion-toggle" data-toggle="accordion" href="#" role="button" aria-expanded="false">
          Menu Item <span class="caret"></span>
        </a>
        <ul class="accordion-menu" role="menu">
          <li><a href="#">Sub Menu Item</a></li>
          <li><a href="#">Sub Menu Item</a></li>
        </ul>
      </li>
      <li role="presentation"><a href="#">Menu Item</a></li>
    </ul>
  </div>  <!-- /#left-hand-menu -->
  <div class="page-wrapper container-fluid">
    <div class="row">
      ...
    </div> <!-- /.row-->
  </div> <!-- /.container-fluid -->
</div> <!-- /#sampleLeftHandMenu -->
filed under: