CRM-16415 ang: all jQuery UI icons gone from angular

---------------------------------------- * CRM-16415: Implement Font Awesome icon font https://issues.civicrm.org/jira/browse/CRM-16415
monishdeb · Oct 13, 2015 · 77ec5a8 · 77ec5a8
1 parent aee8461
commit 77ec5a8
Show file tree

Hide file tree

Showing 28 changed files with 81 additions and 85 deletions.
diff --git a/ang/crmAttachment/attachments.html b/ang/crmAttachment/attachments.html
@@ -11,7 +11,7 @@
       </td>
       <td>
         <a
-          crm-icon="trash"
+          crm-icon="fa-trash"
           crm-confirm="{message: ts('Deleting an attachment will completely remove it from server.')}" on-yes="att.deleteFile(file)"
           title="{{ts('Delete attachment')}}"
           class="crm-hover-button">
@@ -27,7 +27,7 @@
         <!-- item.isReady item.isUploading item.isUploaded item.isSuccess item.isCancel item.isError -->
       </td>
       <td>
-        <a crm-icon="close" ng-click="item.remove()" class="crm-hover-button" title="{{ts('Remove unsaved attachment')}}"></a>
+        <a crm-icon="fa-times" ng-click="item.remove()" class="crm-hover-button" title="{{ts('Remove unsaved attachment')}}"></a>
       </td>
     </tr>
     </tbody>

diff --git a/ang/crmCaseType.css b/ang/crmCaseType.css
@@ -1,13 +1,13 @@
-.crmCaseType .ui-icon-grip-dotted-vertical {
+.crmCaseType .grip-n-drag {
     vertical-align: middle;
     cursor: move;
 }
-.crmCaseType .ui-icon {
+.crmCaseType .crm-i {
     margin: 0.4em 0.2em 0 0;
     cursor: pointer;
 }
 
-.crmCaseType .ui-tabs-nav li .ui-icon {
+.crmCaseType .ui-tabs-nav li .crm-i {
     float: left;
 }
 
@@ -34,4 +34,4 @@
 
 tr.forked {
     font-weight: bold;
-}
+}
diff --git a/ang/crmCaseType/activityTypesTable.html b/ang/crmCaseType/activityTypesTable.html
@@ -14,14 +14,14 @@
   <tbody ui-sortable ng-model="caseType.definition.activityTypes">
   <tr ng-repeat="activityType in caseType.definition.activityTypes">
     <td>
-      <span class="icon ui-icon-grip-dotted-vertical"></span>
+      <i class="crm-i fa-arrows grip-n-drag"></i>
       {{ activityType.name }}
     </td>
     <td>
       <input class="number" type="text" ng-pattern="/^[0-9]*$/" ng-model="activityType.max_instances" />
     </td>
     <td>
-      <a crm-icon="trash" class="crm-hover-button" ng-click="removeItem(caseType.definition.activityTypes, activityType)" title="{{ts('Remove')}}"></a>
+      <a crm-icon="fa-trash" class="crm-hover-button" ng-click="removeItem(caseType.definition.activityTypes, activityType)" title="{{ts('Remove')}}"></a>
     </td>
   </tr>
   </tbody>

diff --git a/ang/crmCaseType/edit.html b/ang/crmCaseType/edit.html
@@ -8,10 +8,10 @@
     {{ts('Use this screen to define or update the Case Roles, Activity Types, and Timelines for a case type.')}} <a href="http://book.civicrm.org/user/current/case-management/setup/" target="_blank">{{ts('Learn more...')}}</a>
   </div>
   <div class="crm-submit-buttons">
-    <button crm-icon="check" ng-click="editCaseTypeForm.$setPristine(); save()" ng-disabled="editCaseTypeForm.$invalid">
+    <button crm-icon="fa-check" ng-click="editCaseTypeForm.$setPristine(); save()" ng-disabled="editCaseTypeForm.$invalid">
       {{ts('Save')}}
     </button>
-    <button crm-icon="close" ng-click="editCaseTypeForm.$setPristine(); goto('caseType')">
+    <button crm-icon="fa-times" ng-click="editCaseTypeForm.$setPristine(); goto('caseType')">
       {{ts('Cancel')}}
     </button>
   </div>
@@ -29,12 +29,12 @@ <h2 ng-show="isForkable()">{{ts('Activities')}}</h2>
       <li><a href="#acttab-actType">{{ts('Activity Types')}}</a></li>
       <li ng-repeat="activitySet in caseType.definition.activitySets">
         <a href="#acttab-{{$index}}">{{ activitySet.label }}</a>
-        <span class="ui-icon ui-icon-trash" title="{{ts('Remove')}}"
+        <span class="crm-i fa-trash" title="{{ts('Remove')}}"
           ng-hide="activitySet.name == 'standard_timeline'"
           ng-click="removeItem(caseType.definition.activitySets, activitySet)">{{ts('Remove')}}</span>
         <!-- Weird spacing:
         <a class="crm-hover-button" ng-click="removeItem(caseType.definition.activitySets, activitySet)">
-          <span class="ui-icon delete-icon" title="Remove">Remove</span>
+          <span class="crm-i fa-trash" title="Remove">Remove</span>
         </a>
         -->
       </li>
@@ -60,10 +60,10 @@ <h2 ng-show="isForkable()">{{ts('Activities')}}</h2>
   </div>
 
   <div class="crm-submit-buttons">
-    <button crm-icon="check" ng-click="editCaseTypeForm.$setPristine(); save()" ng-disabled="editCaseTypeForm.$invalid">
+    <button crm-icon="fa-check" ng-click="editCaseTypeForm.$setPristine(); save()" ng-disabled="editCaseTypeForm.$invalid">
       {{ts('Save')}}
     </button>
-    <button crm-icon="close" ng-click="editCaseTypeForm.$setPristine(); goto('caseType')">
+    <button crm-icon="fa-times" ng-click="editCaseTypeForm.$setPristine(); goto('caseType')">
       {{ts('Cancel')}}
     </button>
   </div>

diff --git a/ang/crmCaseType/list.html b/ang/crmCaseType/list.html
@@ -69,5 +69,5 @@
 </table>
 
 <div class="crm-submit-buttons">
-  <a ng-href="#/caseType/new" class="button"><span><div class="icon ui-icon-circle-plus"></div>{{ts('New Case Type')}}</span></a>
-</div>
+  <a ng-href="#/caseType/new" class="button"><span><i class="crm-i fa-plus-circle"></i> {{ts('New Case Type')}}</span></a>
+</div>
diff --git a/ang/crmCaseType/rolesTable.html b/ang/crmCaseType/rolesTable.html
@@ -17,7 +17,7 @@
 	    <td><input type="checkbox" ng-model="relType.creator" ng-true-value="'1'" ng-false-value="'0'"/></td>
 	    <td><input type="radio" ng-model="relType.manager" value="1" ng-change="onManagerChange(relType)"/></td>
 	    <td>
-	      <a crm-icon="trash" class="crm-hover-button" ng-click="removeItem(caseType.definition.caseRoles,relType)" title="{{ts('Remove')}}"></a>
+	      <a crm-icon="fa-trash" class="crm-hover-button" ng-click="removeItem(caseType.definition.caseRoles,relType)" title="{{ts('Remove')}}"></a>
 	    </td>
 	  </tr>
   </tbody>

diff --git a/ang/crmCaseType/sequenceTable.html b/ang/crmCaseType/sequenceTable.html
@@ -13,11 +13,11 @@
   <tbody ui-sortable ng-model="activitySet.activityTypes">
   <tr ng-repeat="activity in activitySet.activityTypes">
     <td>
-      <span class="icon ui-icon-grip-dotted-vertical"></span>
+      <i class="crm-i fa-arrows grip-n-drag"></i>
       {{ activity.name }}
     </td>
     <td>
-      <a crm-icon="trash" class="crm-hover-button" ng-click="removeItem(activitySet.activityTypes, activity)" title="{{ts('Remove')}}"></a>
+      <a crm-icon="fa-trash" class="crm-hover-button" ng-click="removeItem(activitySet.activityTypes, activity)" title="{{ts('Remove')}}"></a>
     </td>
   </tr>
   </tbody>

diff --git a/ang/crmCaseType/timelineTable.html b/ang/crmCaseType/timelineTable.html
@@ -17,7 +17,7 @@
   <tbody ui-sortable ng-model="activitySet.activityTypes">
   <tr ng-repeat="activity in activitySet.activityTypes">
     <td>
-      <span class="icon ui-icon-grip-dotted-vertical"></span>
+      <i class="crm-i fa-arrows grip-n-drag"></i>
       {{ activity.name }}
     </td>
     <td>
@@ -64,7 +64,7 @@
     </td>
     <td>
       <a class="crm-hover-button"
-         crm-icon="trash"
+         crm-icon="fa-trash"
          ng-show="isActivityRemovable(activitySet, activity)"
          ng-click="removeItem(activitySet.activityTypes, activity)"
          title="{{ts('Remove')}}">

diff --git a/ang/crmMailing/BlockMailing.html b/ang/crmMailing/BlockMailing.html
@@ -18,7 +18,7 @@
           <option value=""></option>
           <option ng-repeat="frm in crmMsgTemplates.getAll() | orderBy:'msg_title'" ng-value="frm.id">{{frm.msg_title}}</option>
         </select>
-        <a crm-icon="disk" ng-if="checkPerm('edit message templates')" ng-click="saveTemplate(mailing)" class="crm-hover-button" title="{{ts('Save As')}}"></a>
+        <a crm-icon="fa-floppy-o" ng-if="checkPerm('edit message templates')" ng-click="saveTemplate(mailing)" class="crm-hover-button" title="{{ts('Save As')}}"></a>
       </div>
     </div>
     <div crm-ui-field="{name: 'subform.fromAddress', title: ts('From'), help: hs('from_email')}">

diff --git a/ang/crmMailing/BlockPreview.html b/ang/crmMailing/BlockPreview.html
@@ -11,10 +11,10 @@
       <em>({{ts('No content to preview')}})</em>
     </div>
     <div ng-hide="!mailing.body_html">
-      <a class="crm-hover-button action-item" crm-icon="newwin" ng-disabled="crmMailing.$invalid" ng-click="doPreview('html')">{{ts('Preview as HTML')}}</a>
+      <a class="crm-hover-button action-item" crm-icon="fa-television" ng-disabled="crmMailing.$invalid" ng-click="doPreview('html')">{{ts('Preview as HTML')}}</a>
     </div>
     <div ng-hide="!mailing.body_html && !mailing.body_text">
-      <a class="crm-hover-button action-item" crm-icon="newwin" ng-disabled="crmMailing.$invalid" ng-click="doPreview('text')">{{ts('Preview as Plain Text')}}</a>
+      <a class="crm-hover-button action-item" crm-icon="fa-file-text-o" ng-disabled="crmMailing.$invalid" ng-click="doPreview('text')">{{ts('Preview as Plain Text')}}</a>
     </div>
     <!--
     <div ng-hide="!mailing.body_html && !mailing.body_text">
@@ -36,7 +36,7 @@
         placeholder="[email protected]"
         />
     </div>
-    <button crm-icon="mail-closed" title="{{crmMailing.$invalid || !testContact.email ? ts('Complete all required fields first') : ts('Send test message to %1', {1: testContact.email})}}" ng-disabled="crmMailing.$invalid || !testContact.email" ng-click="doSend({email: testContact.email})">{{ts('Send test')}}</button>
+    <button crm-icon="fa-paper-plane" title="{{crmMailing.$invalid || !testContact.email ? ts('Complete all required fields first') : ts('Send test message to %1', {1: testContact.email})}}" ng-disabled="crmMailing.$invalid || !testContact.email" ng-click="doSend({email: testContact.email})">{{ts('Send test')}}</button>
   </div>
   <div class="preview-group" ng-form>
     <div>
@@ -55,7 +55,7 @@
         <option value=""></option>
       </select>
     </div>
-    <button crm-icon="mail-closed" title="{{crmMailing.$invalid || !testGroup.gid ? ts('Complete all required fields first') : ts('Send test message to group')}}"ng-disabled="crmMailing.$invalid || !testGroup.gid" crm-confirm="{resizable: true, width: '40%', height: '40%', open: previewTestGroup}" on-yes="doSend({gid: testGroup.gid})">{{ts('Send test')}}</button>
+    <button crm-icon="fa-paper-plane" title="{{crmMailing.$invalid || !testGroup.gid ? ts('Complete all required fields first') : ts('Send test message to group')}}"ng-disabled="crmMailing.$invalid || !testGroup.gid" crm-confirm="{resizable: true, width: '40%', height: '40%', open: previewTestGroup}" on-yes="doSend({gid: testGroup.gid})">{{ts('Send test')}}</button>
   </div>
   <div class="clear"></div>
 </div>
diff --git a/ang/crmMailing/BlockPreview.js b/ang/crmMailing/BlockPreview.js
@@ -48,7 +48,7 @@
             markup += '</ol>';
             markup = '<h4>' + ts('A test message will be sent to %1 people:', {1: count}) + '</h4>' + markup;
             if (!count) {
-              markup = '<div class="messages status"><div class="icon ui-icon-alert"></div> ' +
+              markup = '<div class="messages status"><i class="crm-i fa-exclamation-triangle"></i> ' +
               (data.count ? ts('None of the contacts in this group have an email address.') : ts('Group is empty.')) +
               '</div>';
             }

diff --git a/ang/crmMailing/BlockRecipients.html b/ang/crmMailing/BlockRecipients.html
@@ -15,5 +15,5 @@
     ng-required="true"
     multiple>
   </select>
-  <a crm-icon="wrench" ng-click="editOptions(mailing)" class="crm-hover-button" title="{{ts('Edit Recipient Options')}}"></a>
+  <a crm-icon="fa-wrench" ng-click="editOptions(mailing)" class="crm-hover-button" title="{{ts('Edit Recipient Options')}}"></a>
 </div>
diff --git a/ang/crmMailing/BlockReview.html b/ang/crmMailing/BlockReview.html
@@ -11,7 +11,7 @@
       <div crm-ui-field="{title: ts('Recipients')}">
         <div ng-controller="ViewRecipCtrl">
           <div ng-controller="EditRecipCtrl">
-            <div><a crm-icon="newwin" class="crm-hover-button action-item" ng-click="previewRecipients()">{{getRecipientsEstimate()}}</a></div>
+            <div><a crm-icon="fa-users" class="crm-hover-button action-item" ng-click="previewRecipients()">{{getRecipientsEstimate()}}</a></div>
             <div ng-show="getIncludesAsString(mailing)">
               (<strong>{{ts('Include:')}}</strong> {{getIncludesAsString(mailing)}})
             </div>
@@ -22,8 +22,8 @@
         </div>
       </div>
       <div crm-ui-field="{title: ts('Content')}">
-        <span ng-show="mailing.body_html"><a crm-icon="newwin" class="crm-hover-button action-item" ng-click="previewMailing(mailing, 'html')">{{ts('HTML')}}</a></span>
-        <span ng-show="mailing.body_html || mailing.body_text"><a crm-icon="newwin" class="crm-hover-button action-item" ng-click="previewMailing(mailing, 'text')">{{ts('Plain Text')}}</a></span>
+        <span ng-show="mailing.body_html"><a crm-icon="fa-television" class="crm-hover-button action-item" ng-click="previewMailing(mailing, 'html')">{{ts('HTML')}}</a></span>
+        <span ng-show="mailing.body_html || mailing.body_text"><a crm-icon="fa-file-text-o" class="crm-hover-button action-item" ng-click="previewMailing(mailing, 'text')">{{ts('Plain Text')}}</a></span>
         <!-- TODO: attachments -->
       </div>
       <div crm-ui-field="{title: ts('Attachments')}" ng-show="attachments.files.length > 0 || attachments.uploader.queue.length > 0">
@@ -44,10 +44,10 @@
           <span crm-mailing-review-bool crm-on="mailing.override_verp=='0' && mailing.forward_replies=='1'" crm-title="ts('Forward Replies')"></span>
         </div>
         <div ng-controller="PreviewComponentCtrl">
-          <span ng-show="mailing.override_verp == '0' && mailing.auto_responder"><a crm-icon="newwin" class="crm-hover-button action-item" ng-click="previewComponent(ts('Auto-Respond'), mailing.reply_id)">{{ts('Auto-Respond')}}</a></span>
-          <span><a crm-icon="newwin" class="crm-hover-button action-item" ng-click="previewComponent(ts('Opt-out'), mailing.optout_id)">{{ts('Opt-out')}}</a></span>
-          <span><a crm-icon="newwin" class="crm-hover-button action-item" ng-click="previewComponent(ts('Resubscribe'), mailing.resubscribe_id)">{{ts('Resubscribe')}}</a></span>
-          <span><a crm-icon="newwin" class="crm-hover-button action-item" ng-click="previewComponent(ts('Unsubscribe'), mailing.unsubscribe_id)">{{ts('Unsubscribe')}}</a></span>
+          <span ng-show="mailing.override_verp == '0' && mailing.auto_responder"><a crm-icon="fa-envelope" class="crm-hover-button action-item" ng-click="previewComponent(ts('Auto-Respond'), mailing.reply_id)">{{ts('Auto-Respond')}}</a></span>
+          <span><a crm-icon="fa-envelope" class="crm-hover-button action-item" ng-click="previewComponent(ts('Opt-out'), mailing.optout_id)">{{ts('Opt-out')}}</a></span>
+          <span><a crm-icon="fa-envelope" class="crm-hover-button action-item" ng-click="previewComponent(ts('Resubscribe'), mailing.resubscribe_id)">{{ts('Resubscribe')}}</a></span>
+          <span><a crm-icon="fa-envelope" class="crm-hover-button action-item" ng-click="previewComponent(ts('Unsubscribe'), mailing.unsubscribe_id)">{{ts('Unsubscribe')}}</a></span>
         </div>
       </div>
       <div crm-ui-field="{title: ts('Publication')}">

diff --git a/ang/crmMailing/EditMailingCtrl/2step.html b/ang/crmMailing/EditMailingCtrl/2step.html
@@ -57,12 +57,12 @@
 
       <span crm-ui-wizard-buttons style="float:right;">
         <button
-          crm-icon="trash"
+          crm-icon="fa-trash"
           ng-show="checkPerm('delete in CiviMail')"
           ng-disabled="block.check()"
           crm-confirm="{title:ts('Delete Draft'), message:ts('Are you sure you want to permanently delete this mailing?')}"
           on-yes="delete()">{{ts('Delete Draft')}}</button>
-        <button crm-icon="disk" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
+        <button crm-icon="fa-floppy-o" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
       </span>
     </div>
   </div>

diff --git a/ang/crmMailing/EditMailingCtrl/unified.html b/ang/crmMailing/EditMailingCtrl/unified.html
@@ -43,10 +43,10 @@
       <div crm-mailing-block-schedule crm-mailing="mailing"/>
     </div>
 
-    <button crm-icon="check" ng-disabled="block.check() || crmMailing.$invalid" ng-click="submit()">{{ts('Submit Mailing')}}</button>
-    <button crm-icon="disk" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
+    <button crm-icon="fa-paper-plane" ng-disabled="block.check() || crmMailing.$invalid" ng-click="submit()">{{ts('Submit Mailing')}}</button>
+    <button crm-icon="fa-floppy-o" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
     <button
-      crm-icon="trash"
+      crm-icon="fa-trash"
       ng-show="checkPerm('delete in CiviMail')"
       ng-disabled="block.check()"
       crm-confirm="{title:ts('Delete Draft'), message:ts('Are you sure you want to permanently delete this mailing?')}"

diff --git a/ang/crmMailing/EditMailingCtrl/unified2.html b/ang/crmMailing/EditMailingCtrl/unified2.html
@@ -39,10 +39,10 @@
       <div crm-mailing-block-schedule crm-mailing="mailing"/>
     </div>
 
-    <button crm-icon="check" ng-disabled="block.check() || crmMailing.$invalid" ng-click="submit()">{{ts('Submit Mailing')}}</button>
-    <button crm-icon="disk" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
+    <button crm-icon="fa-paper-plane" ng-disabled="block.check() || crmMailing.$invalid" ng-click="submit()">{{ts('Submit Mailing')}}</button>
+    <button crm-icon="fa-floppy-o" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
     <button
-      crm-icon="trash"
+      crm-icon="fa-trash"
       ng-show="checkPerm('delete in CiviMail')"
       ng-disabled="block.check()"
       crm-confirm="{title:ts('Delete Draft'), message:ts('Are you sure you want to permanently delete this mailing?')}"

diff --git a/ang/crmMailing/EditMailingCtrl/wizard.html b/ang/crmMailing/EditMailingCtrl/wizard.html
@@ -59,12 +59,12 @@
 
       <span crm-ui-wizard-buttons style="float:right;">
         <button
-          crm-icon="trash"
+          crm-icon="fa-trash"
           ng-show="checkPerm('delete in CiviMail')"
           ng-disabled="block.check()"
           crm-confirm="{title:ts('Delete Draft'), message:ts('Are you sure you want to permanently delete this mailing?')}"
           on-yes="delete()">{{ts('Delete Draft')}}</button>
-        <button crm-icon="disk" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
+        <button crm-icon="fa-floppy-o" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
       </span>
     </div>
   </div>

diff --git a/ang/crmMailing/EditMailingCtrl/workflow.html b/ang/crmMailing/EditMailingCtrl/workflow.html
@@ -66,12 +66,12 @@
 
       <span crm-ui-wizard-buttons style="float:right;">
         <button
-          crm-icon="trash"
+          crm-icon="fa-trash"
           ng-show="checkPerm('delete in CiviMail')"
           ng-disabled="block.check()"
           crm-confirm="{title:ts('Delete Draft'), message:ts('Are you sure you want to permanently delete this mailing?')}"
           on-yes="delete()">{{ts('Delete Draft')}}</button>
-        <button crm-icon="disk" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
+        <button crm-icon="fa-floppy-o" ng-disabled="block.check()" ng-click="save().then(leave)">{{ts('Save Draft')}}</button>
       </span>
     </div>
   </div>

diff --git a/ang/crmMailing/EmailBodyCtrl/tokenAlert.html b/ang/crmMailing/EmailBodyCtrl/tokenAlert.html
@@ -4,8 +4,7 @@
 </p>
 
 <div ng-show="missing['domain.address'] && insertable">
-  <a ng-click="insertToken('domain.address')" class="button"><span><span
-    class='icon ui-icon-circle-plus'></span> {{ts('Address')}}</span></a>
+  <a ng-click="insertToken('domain.address')" class="button"><span><i class="crm-i fa-plus-circle"></i> {{ts('Address')}}</span></a>
 
   <div class="clear"/>
 </div>
@@ -26,22 +25,18 @@
     <tbody>
     <tr>
       <td>
-        <a ng-click="insertToken('action.unsubscribeUrl')" class="button"><span><span
-          class='icon ui-icon-circle-plus'></span> {{ts('Unsubscribe')}}</span></a>
+        <a ng-click="insertToken('action.unsubscribeUrl')" class="button"><span><i class="crm-i fa-plus-circle"></i> {{ts('Unsubscribe')}}</span></a>
       </td>
       <td>
-        <a ng-click="insertToken('action.unsubscribe')" class="button"><span><span
-          class='icon ui-icon-circle-plus'></span> {{ts('Unsubscribe')}}</span></a>
+        <a ng-click="insertToken('action.unsubscribe')" class="button"><span><i class="crm-i fa-plus-circle"></i> {{ts('Unsubscribe')}}</span></a>
       </td>
     </tr>
     <tr>
       <td>
-        <a ng-click="insertToken('action.optOutUrl')" class="button"><span><span
-          class='icon ui-icon-circle-plus'></span> {{ts('Opt-out')}}</span></a>
+        <a ng-click="insertToken('action.optOutUrl')" class="button"><span><i class="crm-i fa-plus-circle"></i> {{ts('Opt-out')}}</span></a>
       </td>
       <td>
-        <a ng-click="insertToken('action.optOut')" class="button"><span><span
-          class='icon ui-icon-circle-plus'></span> {{ts('Opt-out')}}</span></a>
+        <a ng-click="insertToken('action.optOut')" class="button"><span><i class="crm-i fa-plus-circle"></i> {{ts('Opt-out')}}</span></a>
       </td>
     </tr>
     </tbody>