<h1 class="title">Listing Servers</h1>

<div id="servers" class="tabbed">
  <ul id="servers-nav" class="tabs">
    <li><a href="#officials">ENSL NS2 Servers</a></li>
    <li><a href="#ns2">NS2 Servers</a></li>
    <li><a href="#ns1">NS1 Servers</a></li>
  </ul>

  <div class="tabbed-contents">
    <div class="tab" id="officials">
      <%= render partial: "server", collection: @officials %>
    </div>
    <div class="tab" id="ns2">
      <%= render partial: "server", collection: @ns2 %>
    </div>

    <div class="tab" id="ns1">
      <%= render partial: "server", collection: @servers %>
    </div>
  </div>
</div>

<script type="text/javascript">
  var tabber1 = new Yetii({
    id: 'servers'
  });
</script>

<%= link_to 'New server', new_server_path, class: 'button' %>