Use button group instead of dropdown for sorting

app/views/asciicasts/index.html.erb

@@ -0,0 +1,36 @@
+<% content_for(:title, page.category_name) %>
+
+<div class="asciicasts-list-page">
+  <div class="container">
+    <div class="row">
+      <div class="col-md-3">
+        <%= render 'shared/browse_categories', current_category: page.category %>
+      </div>
+
+      <div class="col-md-9">
+        <div class="row">
+          <div class="col-md-6">
+            <h2><%= page.category_name %></h2>
+          </div>
+
+          <div class="col-md-6 text-right">
+            <div class="sorting">
+              <span>Sort by </span>
+              <div class="btn-group btn-group-sm">
+                <%= link_to 'recency', "?order=recency", class: "btn btn-default #{'active' if page.order == :recency}" %>
+                <%= link_to 'popularity', "?order=popularity", class: "btn btn-default #{'active' if page.order == :popularity}" %>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="row asciicast-list">
+          <div class="col-md-12">
+            <%= render 'asciicasts/previews', asciicasts: page.items, per_row: 2 %>
+            <%= paginate page.items %>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

app/views/asciicasts/index.html.slim

@@ -1,32 +0,0 @@
-- content_for(:title, page.category_name)
-
-.asciicasts-list-page
-  .container
-    .row
-      .col-md-3
-        = render 'shared/browse_categories', current_category: page.category
-
-      .col-md-9
-        .row
-          .col-md-6
-            h2 = page.category_name
-
-          .col-md-6.text-right
-            .sorting
-              span Sort by 
-              .btn-group.text-left
-                button.btn.btn-default.dropdown-toggle[type="button" data-toggle="dropdown"]
-                  | #{page.order} 
-                  span.caret
-                ul.dropdown-menu[role="menu"]
-                  li
-                    a href="?order=recency"
-                      | recency
-                  li
-                    a href="?order=popularity"
-                      | popularity
-
-        .row.asciicast-list
-          .col-md-12
-            = render 'asciicasts/previews', asciicasts: page.items, per_row: 2
-            = paginate page.items