Font-Awesomed Missing and History

NzbDrone.Web/Content/Grid.css

@@ -1,15 +1,16 @@
 .gridImage, .gridAction, .grid-icon
 {
-    width: 18px;
+    width: 17px;
-    height: 18px;
+    /*height: 18px;
+    margin: 0px;*/
     padding: 3px 1px;
-    margin: 0px;
     vertical-align: middle;
     border: none;
-    display: inline !important;
+    display: inline-block !important;
     text-decoration: none !important;
     color: #000000;
-    font-size: 20px;
+    font-size: 19px;
+    line-height: 19px;
 }
 
 .gridAction:hover
@@ -120,4 +121,8 @@ table.dataTable thead th.sorting_desc, table.dataTable thead th.sorting_asc, tab
 /* Icon color when ignored */
 .ignored {
     color: gray !important;
+}
+
+[data-status="Missing"] {
+    color: #B40404 !important;
 }

NzbDrone.Web/Views/History/Index.cshtml

@@ -94,8 +94,8 @@
                                     }
                                 }, //Date
                                 { sName: 'Actions', sWidth: '40px', "mDataProp": "HistoryId", "bSortable": false, "bSearchable": false, "fnRender": function (row) {
-                                    var deleteImage = "<img src=\"../../Content/Images/close.png\" alt=\"Delete\" title=\"Delete from History\" class=\"gridAction\" onclick=\"deleteHistory(this.parentNode.parentNode, " + row.aData["HistoryId"] + ")\">";
+                                    var deleteImage = '<i class="icon-remove gridAction" title="Delete from History" onclick="deleteHistory(this.parentNode.parentNode, ' + row.aData["HistoryId"] + ')"></i>';
-                                    var redownloadImage = "<img src=\"../../Content/Images/redownload.png\" alt=\"Redownload\" title=\Redownload Episode\" class=\"gridAction\" onclick=\"redownloadHistory(this.parentNode.parentNode, " + row.aData["HistoryId"] + ", " + row.aData["EpisodeId"] + ")\">";
+                                    var redownloadImage = '<i class="icon-share-alt gridAction" title="Redownload Episode" onclick="redownloadHistory(this.parentNode.parentNode, ' + row.aData["HistoryId"] + ', ' + row.aData["EpisodeId"] + ')"></i>';
 
                                     return deleteImage + redownloadImage;
                                 }

NzbDrone.Web/Views/Missing/Index.cshtml

@@ -55,8 +55,8 @@
             return source["AirDate"];
         }
         
-        function actions (row) {
+        function actions(row) {
-            var link = '@Ajax.ImageActionLink("../../Content/Images/Search.png", new {  title = "Search for Episode", alt = "Search", @class = "gridAction" }, "Search", "Episode", new { episodeId = "REPLACE" }, null, null)';
+            var link = '@Ajax.IconActionLink("icon-search gridAction", "", "Search", "Episode", new { EpisodeId = "REPLACE" }, null, new { title = "Search for episode" })';
             link = link.replace("REPLACE", row.aData["EpisodeId"]);
             return link;
         }

NzbDrone.Web/Views/Series/Episode.cshtml

@@ -24,7 +24,7 @@
     @*Commands Column*@
     <td class="@cellColourClass">
         <i class="icon-eye-open ignoreEpisode @(Model.Ignored ? " ignored" : " ") gridAction" title="Click to toggle episode ignore status" data-season="@Model.SeasonNumber" data-episode-id="@Model.EpisodeId" ></i>
-        @Ajax.IconActionLink("icon-search gridAction", "", "Search", "Episode", new { SeriesId = Model.EpisodeId }, null, new { title = "Search for episode" })
+        @Ajax.IconActionLink("icon-search gridAction", "", "Search", "Episode", new { EpisodeId = Model.EpisodeId }, null, new { title = "Search for episode" })
         <i class="icon-tag changeQuality gridAction" title="Click to change the quality of the episode file" data-changetype="episode"></i>
         <i class="gridImage statusImage" title="@Model.Status" data-status="@Model.Status" ></i>
     </td>

NzbDrone.Web/Views/Upcoming/UpcomingEpisode.cshtml

@@ -49,8 +49,8 @@
 
     @*Commands Column*@
     <td class="@cellColourClass">
-        <img src='../../Content/Images/@(Model.Status).png' alt='@Model.Status' title='@statusTitle' class='gridImage statusImage' />
+        <i class="gridImage statusImage" title="@Model.Status" data-status="@Model.Status" ></i>
-        @Ajax.ImageActionLink("../../Content/Images/Search.png", new { Alt = "Search", Title = "Search for episode", @class = "gridAction" }, "Search", "Episode", new { episodeId = Model.EpisodeId }, null, null)
+        @Ajax.IconActionLink("icon-search gridAction", "", "Search", "Episode", new { EpisodeId = Model.EpisodeId }, null, new { title = "Search for episode" })
     </td>
 </tr>