Merge pull request #8488 from piwik/icons

Fixes #7618, add new icons to Piwik & use where appropriate. Also includes slight re-designs to entity management tables & a new CSS API using the icons easily.

2 files changed, 22 insertions, 21 deletions

diff --git a/plugins/Goals/javascripts/goalsForm.js b/plugins/Goals/javascripts/goalsForm.js
index 5d8c4a93cc..2ab5944af8 100644
--- a/plugins/Goals/javascripts/goalsForm.js
+++ b/plugins/Goals/javascripts/goalsForm.js
@@ -37,11 +37,11 @@ function showCancel() {
 }
 
 function showCreateGoal() {
-    $("div[name=linkAddNewGoal]").show();
+    $("#add-goal").show();
 }
 
 function hideCreateGoal() {
-    $("div[name=linkAddNewGoal]").hide();
+    $("#add-goal").hide();
 }
 
 function onMatchAttributeChange(matchAttribute)
@@ -134,7 +134,7 @@ function bindGoalForm() {
         return false;
     });
 
-    $('div[name=linkAddNewGoal]').click(function () {
+    $('#add-goal').click(function () {
         initAndShowAddGoalForm();
         piwikHelper.lazyScrollTo('#goal_name');
     });
@@ -203,13 +203,13 @@ function editGoal(goalId)
 }
 
 function bindListGoalEdit() {
-    $('a[name=linkEditGoal]').click(function () {
+    $('.edit-goal').click(function () {
         var goalId = $(this).attr('id');
         editGoal(goalId);
         return false;
     });
 
-    $('a[name=linkDeleteGoal]').click(function () {
+    $('.delete-goal').click(function () {
         var goalId = $(this).attr('id');
         var goal = piwik.goals[goalId];
 
diff --git a/plugins/Goals/templates/_listGoalEdit.twig b/plugins/Goals/templates/_listGoalEdit.twig
index 74a7c31a76..2d8a87ca41 100644
--- a/plugins/Goals/templates/_listGoalEdit.twig
+++ b/plugins/Goals/templates/_listGoalEdit.twig
@@ -29,18 +29,18 @@
                             {{ 'Goals_Pattern'|translate }} {{ goal.pattern_type }}: {{ goal.pattern }}
                         {% endif %}
                     </td>
-                    <td>{% if goal.revenue==0 %}-{% else %}{{ goal.revenue|money(idSite)|raw }}{% endif %}</td>
-                    <td>
-                        <a href='#' name="linkEditGoal" id="{{ goal.idgoal }}" class="link_but withIcon">
-                            <img src='plugins/Morpheus/images/ico_edit.png' border="0"/>
-                            {{ 'General_Edit'|translate }}
-                        </a>
+                    <td class="text-center">
+                        {% if goal.revenue==0 %}-{% else %}{{ goal.revenue|money(idSite)|raw }}{% endif %}
                     </td>
-                    <td>
-                        <a href='#' name="linkDeleteGoal" id="{{ goal.idgoal }}" class="link_but withIcon">
-                            <img src='plugins/Morpheus/images/ico_delete.png' border="0"/>
-                            {{ 'General_Delete'|translate }}
-                        </a>
+                    <td class="text-center">
+                        <button id="{{ goal.idgoal }}" class="edit-goal btn btn-flat btn-lg" title="{{ 'General_Edit'|translate }}">
+                            <span class="icon-edit"></span>
+                        </button>
+                    </td>
+                    <td class="text-center">
+                        <button id="{{ goal.idgoal }}" class="delete-goal btn btn-flat btn-lg" title="{{ 'General_Delete'|translate }}">
+                            <span class="icon-delete"></span>
+                        </button>
                     </td>
                 </tr>
             {% endfor %}
@@ -48,11 +48,12 @@
     </table>
 
     {% if onlyShowAddNewGoal is not defined %}
-        <br/>
-        <div name="linkAddNewGoal" class="addrow"><img src='plugins/Morpheus/images/add.png'/> {{ 'Goals_AddNewGoal'|translate }}</div>
-        <br/>
-        <br/>
-
+        <p>
+            <button id="add-goal" class="btn btn-lg btn-flat">
+                <span class="icon-add"></span>
+                {{ 'Goals_AddNewGoal'|translate }}
+            </button>
+        </p>
     {% endif %}
 </div>