replace hammer with correct icon on unpublished courses/enrollments

Fixes: CNVS-33866

test plan:
- as an admin ensure you have a course that is "unpublished" in
  your account
- select the account (not siteadmin) choose the "courses" link
  from the left-hand sub-nav
- you should now see the unpublished icon next to the course
  that is not published (used to be an uggo hammer)
  example of new view: http://www.screencast.com/t/oehy3aNd
- now select the "users" link from the left-hand sub-nav
- choose one of the students that is enrolled in the course
  that is not published
- within the student "enrollments" section there should be
  the appropriate "unpublished" icon alongside the course
  name. example: http://www.screencast.com/t/JECmCtdv

Change-Id: I1cd539fd0a358fc69080f4add8d6bb919523d908
Reviewed-on: https://gerrit.instructure.com/97628
Tested-by: Jenkins
Reviewed-by: Stephen Jensen <sejensen@instructure.com>
QA-Review: Dan Sasaki
Product-Review: Kyle Follett <kfollett@instructure.com>

app/stylesheets/bundles/context_list.scss

@@ -26,7 +26,7 @@ ul.context_list {
       font-weight: bold;
       display: block;
       .subtitle {
-        color: #888;
+        color: $ic-font-color--subdued;
       }
     }
     .reminder {
@@ -34,8 +34,8 @@ ul.context_list {
     }
   }
   .unpublished {
-    a {
-      color: #888;
+    a, i {
+      color: $ic-font-color--subdued;
       font-weight: normal;
     }
   }

app/stylesheets/components/_g_instructure.scss

@@ -354,8 +354,13 @@ table.formtable td {
     font-size: 1.1em;
     font-weight: bold;
   }
-  .unpublished .name a {
-    color: $ic-font-color--subdued;
+  .unpublished {
+    .name a {
+      color: $ic-font-color--subdued;
+    }
+    i {
+      color: $ic-font-color--subdued;
+    }
   }
   .details {
     font-size: 0.8em;

app/views/accounts/_course.html.erb

@@ -6,7 +6,7 @@
   <div class="course <%= 'unpublished' if course && course.read_attribute(:workflow_state) && (course.created? || course.claimed?) %>">
     <div class="name">
       <a href="<%= course_path(course ? course.id : "{{ id }}") %>" class="name"><%= (course && course.name) || nbsp %></a>
-      <%= image_tag "hammer.png", :title => t(:course_unpublished_title, "This course hasn't been published yet"), :alt => t(:course_unpublished_tooltip, "Unpublished"), :class => "unpublished_icon", :style => (course && course.read_attribute(:workflow_state) && (course.created? || course.claimed?) ? "" : "display: none;") %>
+      <i class="icon-unpublish" title="<%= t(:course_unpublished_title, "This course hasn't been published yet") %>" style="<%= (course && course.read_attribute(:workflow_state) && (course.created? || course.claimed?) ? "" : "display: none;") %>"></i>
     </div>
     <% if course %>
     <div class="details ellipsis">

app/views/users/_enrollment.html.erb

@@ -4,7 +4,7 @@
     <span class="name" title="<%= enrollment.long_name(@current_user) %>">
       <%= enrollment.long_name(@current_user) %>
       <% if enrollment.course.created? || enrollment.course.claimed? %>
-        <%= image_tag "hammer.png", :title => t('course_not_published', "This course hasn't been published yet"), :alt => t('unpublished', "Unpublished"), :class => "unpublished_icon" %>
+        <i class="icon-unpublish" title="<%= t('course_not_published', "This course hasn't been published yet") %>"></i>
       <% end %>
     </span>