Merge pull request #3184 from edx/frances/fix/lms-wiki-icons

Remove double icons on LMS wiki page

lms/static/sass/course/wiki/_wiki.scss

@@ -325,6 +325,10 @@ section.wiki {
         background: url(../images/wiki-icons.png) no-repeat;
       }
 
+      [class^="icon-"] {
+        padding-right: ($baseline/4);
+      }
+
       .icon-view,
       .icon-home {
         background-position: 0 0;

lms/templates/wiki/create.html

@@ -33,12 +33,12 @@
       {% wiki_form create_form %}
       <div class="form-actions">
           <button type="submit" name="save_changes" class="btn btn-primary btn-large">
-            <span class="icon-plus"></span>
+            <i class="icon-plus"></i>
             {% trans "Create article" %}
           </button>
 
           <a href="{% url 'wiki:get' path=parent_urlpath.path %}" class="btn btn-large back">
-            <span class="icon-circle-arrow-left"></span>
+            <i class="icon-circle-arrow-left"></i>
             {% trans "Go back" %}
           </a>
       </div>

lms/templates/wiki/delete.html

@@ -46,11 +46,11 @@
       </script>
       <div class="form-actions">
           <button type="submit" name="save_changes" class="btn btn-danger btn-large">
-            <span class="icon-plus"></span>
+            <i class="icon-remove"></i>
             {% trans "Delete article" %}
           </button>
           <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="btn btn-large back">
-            <span class="icon-circle-arrow-left"></span>
+            <i class="icon-circle-arrow-left"></i>
             {% trans "Go back" %}
           </a>
       </div>

lms/templates/wiki/edit.html

@@ -25,7 +25,7 @@
   {% include "wiki/includes/editor.html" %}
   <div class="form-actions">
       <button type="submit" name="save" value="1" class="btn btn-large btn-primary" onclick="this.form.target=''; this.form.action='{% url 'wiki:edit' path=urlpath.path article_id=article.id %}'">
-        <span class="icon-ok"></span>
+        <i class="icon-ok"></i>
         {% trans "Save changes" %}
       </button>
       <a class="btn btn-large" id="previewButton" href="#previewModal" rel="leanModal"
@@ -33,12 +33,12 @@
           document.article_edit_form.target='previewWindow';
           document.article_edit_form.action='{% url 'wiki:preview' path=urlpath.path article_id=article.id %}';
           document.article_edit_form.submit();">
-        <span class="icon-eye-open"></span>
+        <i class="icon-eye-open"></i>
         {% trans "Preview" %}
       </a>
 
       <a href="{% url 'wiki:delete' path=urlpath.path article_id=article.id %}" class="pull-right btn btn-danger">
-        <span class="icon-trash"></span>
+        <i class="icon-remove"></i>
         {% trans "Delete article" %}
       </a>
 
@@ -57,12 +57,12 @@
     </div>
     <div class="modal-footer">
       <button type="submit" name="save" value="1" class="btn btn-large btn-primary" onclick="this.form.target=''; this.form.action='{% url 'wiki:edit' path=urlpath.path article_id=article.id %}'">
-        <span class="icon-ok"></span>
+        <i class="icon-ok"></i>
         {% trans "Save changes" %}
       </button>
 
       <a id="previewModalBackToEditor" href="#" class="btn btn-large">
-        <span class="icon-circle-arrow-left"></span>
+        <i class="icon-circle-arrow-left"></i>
         {% trans "Back to editor" %}
       </a>
     </div>

lms/templates/wiki/history.html

@@ -102,7 +102,7 @@
         <div class="accordion-group">
           <div class="accordion-heading">
             <a class="accordion-toggle" style="float: left;" href="{% url 'wiki:diff' revision.id %}">
-              <span class="icon-plus"></span>
+              <i class="icon-plus"></i>
               {% include "wiki/includes/revision_info.html" with current_revision=article.current_revision %}
               <div style="color: #CCC;">
                 <small>
@@ -130,7 +130,7 @@
                       document.revisions_form.action='{% url 'wiki:preview_revision' article.id %}';
                       $('#previewRevisionModal .switch-to-revision').attr('href', '{% url 'wiki:change_revision' path=urlpath.path article_id=article.id revision_id=revision.id %}');
                       document.revisions_form.submit();">
-                  <span class="icon-eye-open"></span>
+                  <i class="icon-eye-open"></i>
                   {% trans "Preview this revision" %}
                 </a>
 
@@ -180,17 +180,17 @@
               document.revisions_form.action=$('input[type=radio]:checked').attr('merge-button-href');
               $('.merge-revision-commit').attr('href', $('input[type=radio]:checked').attr('merge-button-commit-href'));
               document.revisions_form.submit();">
-            <span class="icon-random"></span>
+            <i class="icon-random"></i>
             {% trans "Merge selected with current..." %}
           </a>
         {% else %}
           <button type="submit" disabled="true" name="preview" value="1" class="btn btn-large">
-            <span class="icon-lock"></span>
+            <i class="icon-lock"></i>
             {% trans "Merge selected with current..." %}
           </button>
         {% endif %}
         <button type="submit" name="save" value="1" class="btn btn-large btn-primary" onclick="this.form.action=$('input[type=radio]:checked').attr('switch-button-href')">
-          <span class="icon-flag"></span>
+          <i class="icon-flag"></i>
           {% trans "Switch to selected version" %}
         </button>
       </div>
@@ -212,17 +212,17 @@
       </div>
       <div class="modal-footer">
       <a id="previewRevisionModalBackToHistory" href="#" class="btn btn-large" data-dismiss="modal">
-        <span class="icon-circle-arrow-left"></span>
+        <i class="icon-circle-arrow-left"></i>
         {% trans "Back to history view" %}
       </a>
       {% if article|can_write:user %}
         <a href="#" class="btn btn-large btn-primary switch-to-revision">
-          <span class="icon-flag"></span>
+          <i class="icon-flag"></i>
           {% trans "Switch to this version" %}
         </a>
       {% else %}
         <a href="#" class="btn btn-large btn-primary disabled">
-          <span class="icon-lock"></span>
+          <i class="icon-lock"></i>
           {% trans "Switch to this version" %}
         </a>
       {% endif %}
@@ -240,24 +240,24 @@
       </header>
       <div class="modal-header">
         <h1>{% trans "Merge with current" %}</h1>
-        <p class="lead"><span class="icon-info-sign"></span> {% trans "When you merge a revision with the current, all data will be retained from both versions and merged at its approximate location from each revision." %} <strong>{% trans "After this, it's important to do a manual review." %}</strong></p>
+        <p class="lead"><i class="icon-info-sign"></i> {% trans "When you merge a revision with the current, all data will be retained from both versions and merged at its approximate location from each revision." %} <strong>{% trans "After this, it's important to do a manual review." %}</strong></p>
       </div>
       <div class="modal-body">
         <iframe name="mergeWindow"></iframe>
       </div>
       <div class="modal-footer">
         <a id="mergeModalBackToHistory" href="#" class="btn btn-large" data-dismiss="modal">
-          <span class="icon-circle-arrow-left"></span>
+          <i class="icon-circle-arrow-left"></i>
           {% trans "Back to history view" %}
         </a>
         {% if article|can_write:user %}
         <a href="#" class="btn btn-large btn-primary merge-revision-commit">
-          <span class="icon-file"></span>
+          <i class="icon-file"></i>
           {% trans "Create new merged version" %}
         </a>
         {% else %}
           <a href="#" class="btn btn-large btn-primary disabled">
-            <span class="icon-lock"></span>
+            <i class="icon-lock"></i>
             {% trans "Create new merged version" %}
           </a>
         {% endif %}

lms/templates/wiki/includes/article_menu.html

@@ -7,7 +7,7 @@
 
 <li class="${"active" if selected_tab == "view" else ""}">
   <a href="${reverse('wiki:get', kwargs={'article_id' : article.id, 'path' : urlpath.path})}">
-    <span class="icon-home icon"></span>
+    <i class="icon-eye-open"></i>
     ${_("View")}
     ${_("{span_start}(active){span_end}").format(span_start="<span class='sr'>", span_end="</span>") if selected_tab == "view" else ""}
   </a>
@@ -16,7 +16,7 @@
 %if article.can_write(user):
   <li class="${"active" if selected_tab == "edit" else ""}">
     <a href="${reverse('wiki:edit', kwargs={'article_id' : article.id, 'path' : urlpath.path})}">
-      <span class="icon-edit icon"></span>
+      <i class="icon-pencil"></i>
       ${_("Edit")}
       ${_("{span_start}(active){span_end}").format(span_start="<span class='sr'>", span_end="</span>") if selected_tab == "edit" else ""}
     </a>
@@ -25,7 +25,7 @@
 
 <li class="${"active" if selected_tab == "history" else ""}">
   <a href="${reverse('wiki:history', kwargs={'article_id' : article.id, 'path' : urlpath.path})}">
-    <span class="icon-changes icon"></span>
+    <i class="icon-time"></i>
     ${_("Changes")}
     ${_("{span_start}(active){span_end}").format(span_start="<span class='sr'>", span_end="</span>") if selected_tab == "history" else ""}
   </a>
@@ -35,7 +35,7 @@
   %if hasattr(plugin, "article_tab"):
     <li class="${"active" if selected_tab == plugin.slug else ""}">
       <a href="${reverse('wiki:plugin', kwargs={'slug' : plugin.slug, 'article_id' : article.id, 'path' : urlpath.path}) }">
-        <span class="${plugin.article_tab[1]} icon"></span>
+        <i class="icon-file ${plugin.article_tab[1]}"></i>
         ${plugin.article_tab[0]}
         ${_("{span_start}(active){span_end}").format(span_start="<span class='sr'>", span_end="</span>") if selected_tab == plugin.slug else ""}
       </a>
@@ -51,7 +51,7 @@ ${_("This should be enabled for all non-anonymous users once the notifications a
 %if can_change_permissions(article,user):
 <li class="${"active" if selected_tab == "settings" else ""}">
   <a href="${reverse('wiki:settings', kwargs={'article_id' : article.id, 'path' : urlpath.path})}">
-    <span class="icon-settings icon"></span>
+    <i class="icon-cog"></i>
     ${_("Settings")}
     ${_("{span_start}active{span_end}").format(span_start="<span class='sr'>(", span_end=")</span>") if selected_tab == "settings" else ""}
   </a>

lms/templates/wiki/includes/breadcrumbs.html

@@ -31,7 +31,7 @@
     </form> -->
     %if create_article_root:
     <a class="add-article-btn btn pull-left" href="${reverse('wiki:create', kwargs={'path' : create_article_root.path})}" style="padding: 7px;">
-      <span class="icon-plus"></span>
+      <i class="icon-plus"></i>
       ${_("Add article")}
     </a>
     %endif