Don't hide spans within ui-btn-non class.

TNL-4799

cms/templates/js/certificate-details.underscore

@@ -64,7 +64,7 @@
             <button class="edit"><span class="icon fa fa-pencil" aria-hidden="true"></span> <%- gettext("Edit") %></button>
         </li>
         <li class="action action-delete wrapper-delete-button" data-tooltip="<%- gettext('Delete') %>">
-            <button class="delete action-icon"><span class="icon fa fa-trash-o" aria-hidden="true"></span><span><%- gettext("Delete") %></span></button>
+            <button class="delete action-icon" title="<%- gettext('Delete') %>"><span class="icon fa fa-trash-o" aria-hidden="true"></span></button>
         </li>
         <% } %>
     </ul>

cms/templates/js/content-group-details.underscore

@@ -28,11 +28,11 @@
         </li>
         <% if (_.isEmpty(usage)) { %>
             <li class="action action-delete wrapper-delete-button" data-tooltip="<%- gettext('Delete') %>">
-                <button class="delete action-icon"><span class="icon fa fa-trash-o" aria-hidden="true"></span><span><%- gettext("Delete") %></span></button>
+                <button class="delete action-icon" title="<%- gettext('Delete') %>"><span class="icon fa fa-trash-o" aria-hidden="true"></span></button>
             </li>
         <% } else { %>
             <li class="action action-delete wrapper-delete-button" data-tooltip="<%- gettext('Cannot delete when in use by a unit') %>">
-                <button class="delete action-icon is-disabled" aria-disabled="true" disabled="disabled"><span class="icon fa fa-trash-o" aria-hidden="true"></span><span><%- gettext("Delete") %></span></button>
+                <button class="delete action-icon is-disabled" aria-disabled="true" disabled="disabled" title="<%- gettext('Delete') %>"><span class="icon fa fa-trash-o" aria-hidden="true"></span></button>
             </li>
         <% } %>
     </ul>

cms/templates/js/group-configuration-details.underscore

@@ -46,11 +46,11 @@
         </li>
         <% if (_.isEmpty(usage)) { %>
             <li class="action action-delete wrapper-delete-button">
-                <button class="delete action-icon"><span class="icon fa fa-trash-o" aria-hidden="true"></span><span><%- gettext("Delete") %></span></button>
+                <button class="delete action-icon" title="<%- gettext('Delete') %>"><span class="icon fa fa-trash-o" aria-hidden="true"></span></button>
             </li>
         <% } else { %>
             <li class="action action-delete wrapper-delete-button" data-tooltip="<%- gettext('Cannot delete when in use by an experiment') %>">
-                <button class="delete action-icon is-disabled" aria-disabled="true" aria-hidden="true"><span class="icon fa fa-trash-o"></span><span><%- gettext("Delete") %></span></button>
+                <button class="delete action-icon is-disabled" aria-disabled="true" aria-hidden="true" title="<%- gettext('Delete') %>"><span class="icon fa fa-trash-o"></span></button>
             </li>
         <% } %>
     </ul>

cms/templates/js/show-textbook.underscore

@@ -40,7 +40,7 @@
         <button class="edit"><%- gettext("Edit") %></button>
     </li>
     <li class="action action-delete">
-        <button class="delete action-icon"><span class="icon fa fa-trash-o" aria-hidden="true"></span><span><%- gettext("Delete") %></span></button>
+        <button class="delete action-icon" title="<%- gettext('Delete') %>"><span class="icon fa fa-trash-o" aria-hidden="true" ></span></button>
     </li>
 </ul>
 

common/static/sass/_mixins.scss

@@ -313,10 +313,6 @@
     background-color: $gray-l1;
     color: $white;
   }
-
-  span {
-    @extend %cont-text-sr;
-  }
 }
 
 // button with no button shell until hover for understated actions