title: Ruby on Rail application generated with Happy Seed, need navbar explained
body: <p>I am relatively new to building rails applications and I created am new rails application using <a href="http://seed.happyfuncorp.com/" rel="nofollow">Happy Seed</a>. I can't seem to figure out what exactly is happening in the header. Happy Seed generates an app using bootstrap-sass and haml. What I'm not sure about is, its the <code>= navbar do</code>, <code>= vertical do</code>, and <code>= horizontal do</code>. Is this something built into rails? Bootstrap? I have tried googling but couldn't find anything relevant. If anyone could point me towards any sort of documentation, that would be great.</p>
  
  <p>Here is the "_header.html.haml" file:</p>
  
  <pre><code>= navbar position: :static do
    = vertical do
      = link_to root_path do
        %span.glyphicon.glyphicon-cloud
        Home
    = horizontal do
      = nav class: 'navbar-right' do
        = link_to 'Contact', ""
        = link_to 'About', ""
        = render partial: "application/account_dropdown"
  </code></pre>
  
  <p>And this is what it is generating when I view the source:</p>
  
  <pre><code>&lt;nav class="navbar navbar-default navbar-static-top" role="navigation"&gt;
    &lt;div class="container"&gt;
      &lt;div class="navbar-header"&gt;&lt;button class="navbar-toggle" data-target="#navbar-collapse-7238422159" data-toggle="collapse" type="button"&gt;&lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
  &lt;span class="icon-bar"&gt;&lt;/span&gt;
  &lt;span class="icon-bar"&gt;&lt;/span&gt;
  &lt;span class="icon-bar"&gt;&lt;/span&gt;&lt;/button&gt;
  &lt;li class="active"&gt;&lt;a class="navbar-brand" href="/"&gt;&lt;span class='glyphicon glyphicon-cloud'&gt;&lt;/span&gt;
  Home
  &lt;/a&gt;&lt;/li&gt;
  &lt;/div&gt;
  &lt;div class="collapse navbar-collapse" id="navbar-collapse-7238422159"&gt;&lt;ul class="navbar-right nav navbar-nav"&gt;&lt;li&gt;&lt;a href=""&gt;Contact&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=""&gt;About&lt;/a&gt;&lt;/li&gt;
  &lt;li class='dropdown'&gt;
    &lt;a aria-expanded='false' class='dropdown-toggle' data-toggle='dropdown' href='#' role='button'&gt;
      Account &lt;span class="caret"&gt;&lt;/span&gt;
    &lt;/a&gt;
    &lt;ul class='dropdown-menu'&gt;
      &lt;!-- CONNECT --&gt;
      &lt;li&gt;&lt;a href="/users/sign_in"&gt;Sign In&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="/users/sign_up"&gt;Sign Up&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  
    &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>