final styling of table sorting

app/assets/stylesheets/favorites.scss

@@ -39,6 +39,15 @@
 .table_wrapper {
   overflow-x: auto;
 
+  th a {
+    display: flex;
+    align-items: center;
+
+    img {
+      height: 100%;
+    }
+  }
+
   table {
     border-collapse: collapse;
     width: 100%;
@@ -53,4 +62,9 @@
     }
 
   }
+
+  th a {
+    color: black;
+    text-decoration: none;
+  }
 }

app/helpers/favorites_helper.rb

@@ -1,7 +1,9 @@
 module FavoritesHelper
   def sortable(title, column)
     direction = column == sort_column && sort_direction == 'asc' ? 'desc' : 'asc'
-    link_to title, :sort => column, :direction => direction
+    link_to :sort => column, :direction => direction do
+      content_tag(:div, title) + sorting_arrow(column)
+    end
   end
 
   def sorting_arrow(column)

app/views/favorites/_th.html.erb

@@ -1,4 +1,3 @@
 <th>
   <%= sortable display, column %>
-  <%= sorting_arrow column %>
 </th>

app/views/favorites/people.html.erb

@@ -6,7 +6,7 @@
   <div class="table_wrapper">
     <table>
       <tr>
-        <th></th>
+        <th>Thumb</th>
         <%= render :partial => "favorites/th", :locals => {:display => "First Name", :column => "first_name"} %>
         <%= render :partial => "favorites/th", :locals => {:display => "Last Name", :column => "last_name"} %>
         <%= render :partial => "favorites/th", :locals => {:display => "Registration Date", :column => "created_at"} %>