anchor.diff: -<ul class='list-group'>
  -  <li class='list-group-item active'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-home') + " Home", '/index.html') %></li>
  -  <li class='list-group-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-user') + " Profile", '/profile.html') %></li>
  -  <li class='list-group-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-circle-o') + " Circles", '/circles.html') %></li>
  -  <li class='list-group-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-group') + " Groups", '/groups.html') %></li>
  -  <li class='list-group-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-picture-o') + " Photos", '/photos.html') %></li>
  -  <li class='list-group-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-calendar') + " Events", '/events.html') %></li>
  -  <li class='list-group-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-calendar') + " Collections", '/collections.html') %></li>
  +<ul class='side-nav'>
  +  <li class='nav-item active'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-home') + " Home", '/index.html', class: "nav-link") %></li>
  +  <li class='nav-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-user') + " Profile", '/profile.html', class: "nav-link") %></li>
  +  <li class='nav-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-circle-o') + " Circles", '/circles.html', class: "nav-link") %></li>
  +  <li class='nav-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-group') + " Groups", '/groups.html', class: "nav-link") %></li>
  +  <li class='nav-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-picture-o') + " Photos", '/photos.html', class: "nav-link") %></li>
  +  <li class='nav-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-calendar') + " Events", '/events.html', class: "nav-link") %></li>
  +  <li class='nav-item'><%= link_to(content_tag(:span, nil, class: 'fa fa-fw fa-calendar') + " Collections", '/collections.html', class: "nav-link") %></li>
     <li class='list-group-header'>Another list header</li>
  -  <li class='list-group-item'>
  -    <span class='collapse-caret collapsed dropdown-toggle' data-toggle='collapse' data-target='#profile'></span>
  -    <div class='list-group-item-wrapper'>
  -      <div class='dropdown pull-right'>
  -        <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='caret'></span></a>
  -        <ul role='menu' class='dropdown-menu'>
  -          <li><a href='#'>Action</a></li>
  -          <li><a href='#'>Another action</a></li>
  -          <li><a href='#'>Something else here</a></li>
  -          <li class='divider'></li>
  -          <li><a href='#'>Separated link</a></li>
  -        </ul>
  +  <li class='nav-item dropdown'>
  +    <span class='fa fa-angle-right fa-fw collapsed dropdown-toggle' data-toggle='collapse' data-target='#profile'></span>
  +    <div class='dropdown pull-right'>
  +      <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='fa fa-angle-down fa-fw'></span></a>
  +      <div class="dropdown-menu">
  +        <a class="dropdown-item" href="#">Action</a>
  +        <a class="dropdown-item" href="#">Another action</a>
  +        <a class="dropdown-item" href="#">Something else here</a>
  +        <div class="dropdown-divider"></div>
  +        <a class="dropdown-item" href="#">Separated link</a>
         </div>
  -
  -      <a href='#'>Profile</a>
       </div>
   
  +    <a class="nav-link" href='#'>Profile</a>
  +
       <div id='profile' class='collapse'>
  -      <ul role='menu' class='list-group-item-menu'>
  -        <li class='list-group-item'>
  -          <div class='list-group-item-wrapper'>
  -            <div class='dropdown pull-right'>
  -              <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='caret'></span></a>
  -              <ul role='menu' class='dropdown-menu'>
  -                <li><a href='#'>Action</a></li>
  -                <li><a href='#'>Another action</a></li>
  -                <li><a href='#'>Something else here</a></li>
  -                <li class='divider'></li>
  -                <li><a href='#'>Separated link</a></li>
  -              </ul>
  +      <ul role='menu' class='nav-item-menu'>
  +        <li class='nav-item'>
  +          <div class='dropdown pull-right'>
  +            <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='fa fa-angle-down fa-fw'></span></a>
  +            <div class="dropdown-menu">
  +              <a class="dropdown-item" href="#">Action</a>
  +              <a class="dropdown-item" href="#">Another action</a>
  +              <a class="dropdown-item" href="#">Something else here</a>
  +              <div class="dropdown-divider"></div>
  +              <a class="dropdown-item" href="#">Separated link</a>
               </div>
  +          </div>
   
  -            <a href='#'>Action</a>
  -          </div>
  +          <a href='#'>Action</a>
           </li>
         </ul>
       </div>
     </li>
  -  <li class='list-group-item'>
  -    <span class='collapse-caret collapsed dropdown-toggle' data-toggle='collapse' data-target='#settings'></span>
  -    <div class='list-group-item-wrapper'>
  -      <div class='dropdown pull-right'>
  -        <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='caret'></span></a>
  -        <ul role='menu' class='dropdown-menu'>
  -          <li><a href='#'>Action</a></li>
  -          <li><a href='#'>Another action</a></li>
  -          <li><a href='#'>Something else here</a></li>
  -          <li class='divider'></li>
  -          <li><a href='#'>Separated link</a></li>
  -        </ul>
  +  <li class='nav-item'>
  +    <span class='fa fa-angle-right fa-fw collapsed dropdown-toggle' data-toggle='collapse' data-target='#settings'></span>
  +    <div class='dropdown pull-right'>
  +      <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='fa fa-angle-down fa-fw'></span></a>
  +      <div class="dropdown-menu">
  +        <a class="dropdown-item" href="#">Action</a>
  +        <a class="dropdown-item" href="#">Another action</a>
  +        <a class="dropdown-item" href="#">Something else here</a>
  +        <div class="dropdown-divider"></div>
  +        <a class="dropdown-item" href="#">Separated link</a>
         </div>
  -
  -      <a href='#'>
  -        Settings
  -      </a>
       </div>
   
  +    <a href='#'>
  +      Settings
  +    </a>
  +
       <div id='settings' class='collapse'>
  -      <ul role='menu' class='list-group-item-menu'>
  -        <li class='list-group-item'>
  -          <div class='list-group-item-wrapper'>
  -            <div class='dropdown pull-right'>
  -              <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='caret'></span></a>
  -              <ul role='menu' class='dropdown-menu'>
  -                <li><a href='#'>Action</a></li>
  -                <li><a href='#'>Another action</a></li>
  -                <li><a href='#'>Something else here</a></li>
  -                <li class='divider'></li>
  -                <li><a href='#'>Separated link</a></li>
  -              </ul>
  +      <ul role='menu' class='nav-item-menu'>
  +        <li class='nav-item'>
  +          <div class='dropdown pull-right'>
  +            <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='fa fa-angle-down fa-fw'></span></a>
  +            <div class="dropdown-menu">
  +              <a class="dropdown-item" href="#">Action</a>
  +              <a class="dropdown-item" href="#">Another action</a>
  +              <a class="dropdown-item" href="#">Something else here</a>
  +              <div class="dropdown-divider"></div>
  +              <a class="dropdown-item" href="#">Separated link</a>
               </div>
  +          </div>
   
  -            <a href='#'>Action</a>
  -          </div>
  +          <a href='#'>Action</a>
           </li>
           <li class='divider'></li>
  -        <li class='list-group-item'>
  -          <span class='dropdown-toggle collapse-caret collapsed' data-toggle='collapse' data-target='#sub-settings'></span>
  -          <div class='list-group-item-wrapper'>
  -            <div class='dropdown pull-right'>
  -              <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='caret'></span></a>
  -              <ul role='menu' class='dropdown-menu'>
  -                <li><a href='#'>Action</a></li>
  -                <li><a href='#'>Another action</a></li>
  -                <li><a href='#'>Something else here</a></li>
  -                <li class='divider'></li>
  -                <li><a href='#'>Separated link</a></li>
  -              </ul>
  +        <li class='nav-item'>
  +          <span class='fa fa-angle-right fa-fw dropdown-toggle collapsed' data-toggle='collapse' data-target='#sub-settings'></span>
  +          <div class='dropdown pull-right'>
  +            <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='fa fa-angle-down fa-fw'></span></a>
  +            <div class="dropdown-menu">
  +              <a class="dropdown-item" href="#">Action</a>
  +              <a class="dropdown-item" href="#">Another action</a>
  +              <a class="dropdown-item" href="#">Something else here</a>
  +              <div class="dropdown-divider"></div>
  +              <a class="dropdown-item" href="#">Separated link</a>
               </div>
   
               <a href='#'>
  
positive.code:     </div>
    </li>
    <li class='divider'></li>
    <li class='list-group-item'><a href='#'>Help</a></li>
  </ul>
  
negative.code:           </div>
  
            <div class='collapse' id='sub-settings'>
              <ul role='menu' class='nav-item-menu'>
                <li class='nav-item'>
                  <div class='nav-item-wrapper'>
                    <div class='dropdown pull-right'>
                      <a href='#' class='dropdown-toggle' data-toggle='dropdown'><span class='fa fa-angle-down fa-fw'></span></a>
                      <div class="dropdown-menu">
                        <a class="dropdown-item" href="#">Action</a>
                        <a class="dropdown-item" href="#">Another action</a>
                        <a class="dropdown-item" href="#">Something else here</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="#">Separated link</a>
                      </div>
                    </div>
  
                    <a href='#'>Action 1</a>
  