Font-Awesomed Settings

NzbDrone.Web/Content/Grid.css

@@ -1,8 +1,6 @@
 .gridImage, .gridAction, .grid-icon
 {
     width: 17px;
-    /*height: 18px;
-    margin: 0px;*/
     padding: 3px 1px;
     vertical-align: middle;
     border: none;

NzbDrone.Web/Content/QualitySettings.css

@@ -14,6 +14,12 @@
     font-size:16px;
     color: black;
     font-weight:bold;
+    vertical-align: middle;
+}
+
+#addProfile > i {
+    color: green;
+    font-size: 20px;
 }
         
 #profileHeader
@@ -97,11 +103,17 @@
     padding-left: 5px;
 }
     
-.deleteProfile
-{
+.delete-profile {
     position: absolute;
     top: 0px;
     right: 0px;
+    font-size: 16px;
+    color: #000000;
+    text-decoration: none;
+}
+
+.delete-profile > i[class*="icon-"]:hover {
+    cursor: pointer !important;
 }
     
 .titleText

NzbDrone.Web/Controllers/SettingsController.cs

@@ -288,6 +288,7 @@ namespace NzbDrone.Web.Controllers
             return PartialView("QualityProfileItem", model);
         }
 
+        [HttpPost]
         [JsonErrorFilter]
         public JsonResult DeleteQualityProfile(int profileId)
         {
@@ -296,7 +297,7 @@ namespace NzbDrone.Web.Controllers
 
             _qualityProvider.Delete(profileId);
 
-            return new JsonResult();
+            return Json("ok");
         }
 
         public PartialViewResult AddNewznabProvider()

NzbDrone.Web/Scripts/NzbDrone/qualitySettings.js

@@ -12,11 +12,22 @@ $(document).on("click", "#addProfile", function (event) {
     event.preventDefault();
 });
 
-function deleteProfile(id) {
-    sendToServer(id);
-    var profileDiv = '#profile_' + id;
-    $(profileDiv).remove();
-}
+$(document).on('click', '.delete-profile', function (e) {
+    var container = $(this).closest('.profileSection');
+    var id = $(container).attr('data-profile-id');
+
+    $.ajax({
+        type: "POST",
+        url: deleteQualityProfileUrl,
+        data: jQuery.param({ profileId: id }),
+        success: function (data, textStatus, jqXHR) {
+            $(container).remove();
+            removeOption(id);
+        }
+    });
+    
+    e.preventDefault();
+});
 
 function renameOption(text, value) {
     $("#DefaultQualityProfileId option[value='" + value + "']").html(text);
@@ -35,23 +46,9 @@ function removeOption(value) {
     $("#DefaultQualityProfileId option[value='" + value + "']").remove();
 }
 
-function sendToServer(id) {
-    $.ajax({
-        type: "POST",
-        url: deleteQualityProfileUrl,
-        data: jQuery.param({ profileId: id }),
-        success: function (data, textStatus, jqXHR) {
-            if (data == "ok") {
-                $("#profile_" + id).remove();
-                removeOption(id);
-            }
-        }
-    });
-}
-
 function getProfileId(obj) {
-    var parentProfileSection = $(obj).parents('.profileSection');
-    return parentProfileSection.children('.qualityProfileId').val();
+    var parentProfileSection = $(obj).closest('.profileSection');
+    return parentProfileSection.attr('data-profile-id');
 }
 
 function getCleanId(obj) {
@@ -61,8 +58,10 @@ function getCleanId(obj) {
 
 $(document).on('keyup', '.profileName_textbox', function () {
     var value = $(this).val();
+
+    $(this).closest('.profileSection').find('.titleText').text(value);
     var profileId = getProfileId(this);
-    $("#title_" + profileId).text(value);
+    
     renameOption(value, profileId);
 }).keyup();
 

NzbDrone.Web/Views/Settings/Quality.cshtml

@@ -18,8 +18,9 @@
             <div id="profileContainer">
                 <div id="profileHeader">
                     <a id="addProfile" href="@Url.Action("AddProfile", "Settings")">
-                        <img src="../../Content/Images/Plus.png" alt="Add New Profile" width="20px" height="20px" />
-                        Add New Profile</a>
+                        <i class="icon-plus icon-large"></i>
+                        Add New Profile
+                    </a>
                 </div>
                 <div id="profiles">
                     @foreach (var item in (List<QualityProfile>)ViewData["Profiles"])

NzbDrone.Web/Views/Settings/QualityProfileItem.cshtml

@@ -7,12 +7,14 @@
 {
     var idClean = ViewData.TemplateInfo.HtmlFieldPrefix.Replace('[', '_').Replace(']', '_');
 
-    <div class="profileSection" id="profile_@(Model.QualityProfileId)">
+    <div class="profileSection" data-profile-id="@Model.QualityProfileId">
         <div class="qualityHeader">
-            <span class="titleText" id="title_@(Model.QualityProfileId)">
+            <span class="titleText">
                 @Model.Name
-            </span><a href="#" id="@Model.QualityProfileId" class="deleteProfile" onclick=" deleteProfile('@(Model.QualityProfileId)'); return false;">
-                <img src="../../Content/Images/close.png" alt="Delete" width="22px" height="22px" /></a>
+            </span>
+            <a href="@Url.Action("DeleteQualityProfile", "Settings", new { profileId = @Model.QualityProfileId })" class="delete-profile">
+                <i class="icon-remove"></i>
+            </a>
         </div>
         <div class="profileOptions">
             @Html.LabelFor(x => x.Name)