fixing styling and class syntax (to new FA-based classes) for missing UI elements

cms/static/js/spec/views/xblock_validation_spec.js

@@ -17,8 +17,8 @@ define(['jquery', 'js/models/xblock_validation', 'js/views/xblock_validation', '
             it('has a getIcon method', function() {
                 var getIcon = view.getIcon.bind(view);
 
-                expect(getIcon(model.WARNING)).toBe('fa-warning-sign');
-                expect(getIcon(model.NOT_CONFIGURED)).toBe('fa-warning-sign');
+                expect(getIcon(model.WARNING)).toBe('fa-exclamation-triangle');
+                expect(getIcon(model.NOT_CONFIGURED)).toBe('fa-exclamation-triangle');
                 expect(getIcon(model.ERROR)).toBe('fa-exclamation-circle');
                 expect(getIcon("unknown")).toBeNull();
             });

cms/static/js/views/overview_assignment_grader.js

@@ -13,7 +13,7 @@ define(["js/views/baseview", "underscore", "gettext", "js/models/assignment_grad
                     // TODO move to a template file
                     '<h4 class="status-label"><%= assignmentType %></h4>' +
                     '<a data-tooltip="Mark/unmark this subsection as graded" class="menu-toggle" href="#">' +
-                        '<% if (!hideSymbol) {%><i class="icon fa fa-ok"></i><%};%>' +
+                        '<% if (!hideSymbol) {%><i class="icon fa fa-check"></i><%};%>' +
                     '</a>' +
                     '<ul class="menu">' +
                         '<% graders.each(function(option) { %>' +

cms/static/js/views/xblock_validation.js

@@ -32,7 +32,7 @@ define(["jquery", "underscore", "js/views/baseview", "gettext"],
                     return 'fa-exclamation-circle';
                 }
                 else if (messageType === this.model.WARNING || messageType === this.model.NOT_CONFIGURED) {
-                    return 'fa-warning-sign';
+                    return 'fa-exclamation-triangle';
                 }
                 return null;
             },

cms/static/sass/views/_checklists.scss

@@ -142,7 +142,7 @@
         @extend %t-regular;
         @include float(right);
 
-        .icon-delete {
+        .fa-trash-o {
           @extend %t-icon7;
           display: inline-block;
           vertical-align: middle;

cms/static/sass/views/_video-upload.scss

@@ -1,5 +1,5 @@
 .view-video-uploads {
-  
+
   .content-primary, .content-supplementary {
     @include box-sizing(border-box);
   }
@@ -14,7 +14,7 @@
 
   .nav-actions {
 
-    .icon-cloud-upload {
+    .fa-cloud-upload {
       @extend %t-copy;
       vertical-align: bottom;
       margin-right: ($baseline/5);

cms/templates/js/metadata-list-entry.underscore

@@ -10,7 +10,7 @@
     </a>
   </div>
   <button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
-    <i class="icon-undo"></i>
+    <i class="icon fa fa-undo"></i>
     <span class="sr">"<%= gettext("Clear Value") %>"</span>
   </button>
 </div>

cms/templates/js/mock/mock-index-page.underscore

@@ -106,7 +106,7 @@
                 <dl class="course-status">
                   <dt class="label sr">This re-run processing status:</dt>
                   <dd class="value">
-                    <i class="icon fa fa-refresh icon-spin"></i>
+                    <i class="icon fa fa-refresh fa-spin"></i>
                     <span class="copy">Configuring as re-run</span>
                   </dd>
                 </dl>

cms/templates/js/system-feedback.underscore

@@ -9,7 +9,7 @@
   >
   <div class="<%= type %> <%= intent %> <% if(obj.actions) { %>has-actions<% } %>">
     <% if(obj.icon) { %>
-      <% var iconClass = {"warning": "warning", "confirmation": "ok", "error": "warning", "announcement": "bullhorn", "step-required": "exclamation-circle", "help": "question", "mini": "cog"} %>
+      <% var iconClass = {"warning": "warning", "confirmation": "check", "error": "warning", "announcement": "bullhorn", "step-required": "exclamation-circle", "help": "question", "mini": "cog"} %>
       <i class="feedback-symbol fa fa-<%= iconClass[intent] %>"></i>
     <% } %>
 

cms/templates/js/xblock-validation-messages.underscore

@@ -4,7 +4,7 @@ var aggregateMessageType = summaryMessage.type;
 var aggregateValidationClass = aggregateMessageType === "error"? "has-errors" : "has-warnings";
 %>
     <div class="xblock-message validation <%= aggregateValidationClass %> <%= additionalClasses %>">
-        <p class="<%= aggregateMessageType %>"><i class="<%= getIcon(aggregateMessageType) %>"></i>
+        <p class="<%= aggregateMessageType %>"><i class="icon fa <%= getIcon(aggregateMessageType) %>"></i>
         <%- summaryMessage.text %>
         <% if (summaryMessage.action_class) { %>
             <a href="#" class="button action-button <%- summaryMessage.action_class %>">

cms/templates/videos_index.html

@@ -44,7 +44,7 @@
             <h3 class="sr">${_("Page Actions")}</h3>
             <ul>
                 <li class="nav-item">
-                    <a href="#" class="button upload-button new-button"><i class="icon-plus"></i> ${_("Upload New File")}</a>
+                    <a href="#" class="button upload-button new-button"><i class="icon fa fa-plus"></i> ${_("Upload New File")}</a>
                 </li>
             </ul>
         </nav>