CRM-16415 Icons for standard save/cancel buttons

----------------------------------------
* CRM-16415: Implement Font Awesome icon font
  https://issues.civicrm.org/jira/browse/CRM-16415

diff --git a/CRM/Core/Form.php b/CRM/Core/Form.php
index e22c212549e1cc66939622021d8077ff856cb5bf..29d0dea97d27b64de1ef33c682fa68bd56b3056d 100644 (file)
--- a/CRM/Core/Form.php
+++ b/CRM/Core/Form.php
@@ -546,11 +546,11 @@ class CRM_Core_Form extends HTML_QuickForm_Page {
 
       if (in_array($button['type'], array('upload', 'next', 'submit', 'done', 'process', 'refresh'))) {
         $attrs['class'] .= ' validate';
-        $defaultIcon = 'check';
+        $defaultIcon = 'fa-check';
       }
       else {
         $attrs['class'] .= ' cancel';
-        $defaultIcon = $button['type'] == 'back' ? 'triangle-1-w' : 'close';
+        $defaultIcon = $button['type'] == 'back' ? 'fa-chevron-left' : 'fa-times';
       }
 
       if ($button['type'] === 'reset') {
@@ -559,13 +559,13 @@ class CRM_Core_Form extends HTML_QuickForm_Page {
       else {
         if (!empty($button['subName'])) {
           if ($button['subName'] == 'new') {
-            $defaultIcon = 'plus';
+            $defaultIcon = 'fa-plus-circle';
           }
           if ($button['subName'] == 'done') {
-            $defaultIcon = 'circle-check';
+            $defaultIcon = 'fa-check-circle';
           }
           if ($button['subName'] == 'next') {
-            $defaultIcon = 'circle-triangle-e';
+            $defaultIcon = 'fa-chevron-right';
           }
         }
 

diff --git a/css/civicrm.css b/css/civicrm.css
index ca3d1f7d1e2007748fdbd63744599c0cde48a87b..975f43797523cbebd3a5a195028cbd8c73c9bfef 100644 (file)
--- a/css/civicrm.css
+++ b/css/civicrm.css
@@ -2247,6 +2247,7 @@ a.crm-i:hover {
 
 .crm-i-button>.crm-i {
   padding-left: 2px;
+  line-height: inherit;
 }
 
 .crm-container .ui-dialog-titlebar .ui-button .ui-icon[class*=" fa-"] {

diff --git a/templates/CRM/Contact/Form/Merge.tpl b/templates/CRM/Contact/Form/Merge.tpl
index cc6f57697f307527f7af231259957bc2ad7997fd..1d6d3a45dd868c16943ec45ea82fc51407da49cc 100644 (file)
--- a/templates/CRM/Contact/Form/Merge.tpl
+++ b/templates/CRM/Contact/Form/Merge.tpl
@@ -30,20 +30,20 @@
 
 <div class="crm-submit-buttons">
   {include file="CRM/common/formButtons.tpl" location="top"}
-  {if $prev}<a href="{$prev}" class="crm-hover-button action-item"><span class="icon ui-icon-triangle-1-w"></span> {ts}Previous{/ts}</a>{/if}
-  {if $next}<a href="{$next}" class="crm-hover-button action-item">{ts}Next{/ts} <span class="icon ui-icon-triangle-1-e"></span></a>{/if}
+  {if $prev}<a href="{$prev}" class="crm-hover-button action-item"><i class="crm-i fa-chevron-left"></i> {ts}Previous{/ts}</a>{/if}
+  {if $next}<a href="{$next}" class="crm-hover-button action-item">{ts}Next{/ts} <i class="crm-i fa-chevron-right"></i></a>{/if}
 </div>
 
 <div class="action-link">
   <a href="{$flip}" class="action-item crm-hover-button">
-    <span class="icon ui-icon-shuffle"></span>
+    <i class="crm-i fa-random"></i>
     {ts}Flip between original and duplicate contacts.{/ts}
   </a>
 </div>
 
 <div class="action-link">
   <a href="#" class="action-item crm-hover-button crm-notDuplicate" title={ts}Mark this pair as not a duplicate.{/ts} onClick="processDupes( {$main_cid}, {$other_cid}, 'dupe-nondupe', 'merge-contact', '{if $rgid}{crmURL p="civicrm/contact/dedupefind" q="reset=1&action=update&rgid=$rgid"}{/if}' );return false;">
-    <span class="icon ui-icon-circle-close"></span>
+    <i class="crm-i fa-times-circle"></i>
     {ts}Mark this pair as not a duplicate.{/ts}
   </a>
 </div>

diff --git a/templates/CRM/Event/Form/ManageEvent/ConfirmRepeatMode.tpl b/templates/CRM/Event/Form/ManageEvent/ConfirmRepeatMode.tpl
index e587c888860e0bc9f808416b4f2089c839ec279a..55fba8258422d108ebd3f4c31e3e3ce6e2c03a12 100644 (file)
--- a/templates/CRM/Event/Form/ManageEvent/ConfirmRepeatMode.tpl
+++ b/templates/CRM/Event/Form/ManageEvent/ConfirmRepeatMode.tpl
@@ -41,7 +41,7 @@
         <label for="recur-all-entity">{ts 1=$entity_type}Every %1{/ts}</label>\r
         <div class="description">{ts 1=$entity_type}Change applies to every %1 in the series.{/ts}</div>\r
       </div>\r
-      <div class="status help"><div class="icon ui-icon-lightbulb"></div>{ts}Changes to date or time will <em>not</em> be applied to others in the series.{/ts}</div>\r
+      <div class="status help"><i class="crm-i fa-info-circle"></i> {ts}Changes to date or time will <em>not</em> be applied to others in the series.{/ts}</div>\r
     </div>\r
   </script>\r
 {literal}\r

diff --git a/templates/CRM/PCP/Page/PCPInfo.tpl b/templates/CRM/PCP/Page/PCPInfo.tpl
index eb162956f99e7508d85234cfefc3b2b5e1f6301f..1bf0d7cf2a809e8156acb2a6a61ec29821a138ba 100644 (file)
--- a/templates/CRM/PCP/Page/PCPInfo.tpl
+++ b/templates/CRM/PCP/Page/PCPInfo.tpl
@@ -47,7 +47,7 @@
       </tr>
         {/foreach}
        </table>
-     <div class="icon ui-icon-lightbulb"></div>
+     <i class="crm-i fa-lightbulb-o"></i>
      <strong>{ts}Tip{/ts}</strong> - <span class="description">{ts}You must be logged in to your account to access the editing options above. (If you visit this page without logging in, you will be viewing the page in "live" mode - as your visitors and friends see it.){/ts}</span>
 </div>
 {/if}

diff --git a/templates/CRM/UF/Page/Field.tpl b/templates/CRM/UF/Page/Field.tpl
index 0a0c4cb841f9c6b2db8d3a8e4e0a14999f8d1ec3..20c5e51093db8dcf40fa0e2691a886afc2045b56 100644 (file)
--- a/templates/CRM/UF/Page/Field.tpl
+++ b/templates/CRM/UF/Page/Field.tpl
@@ -37,7 +37,7 @@
         <div id="field_page">
         {if not ($action eq 2 or $action eq 1)}
             <div class="action-link">
-                {crmButton p="civicrm/admin/uf/group/field/add" q="reset=1&action=add&gid=$gid" icon="plus-circle"}{ts}Add Field{/ts}{/crmButton}{if !$isGroupReserved}{crmButton p="civicrm/admin/uf/group/update" q="action=update&id=`$gid`&reset=1&context=field" icon="pencil"}{ts}Edit Settings{/ts}{/crmButton}{/if}{crmButton p="civicrm/admin/uf/group" q="action=preview&id=`$gid`&reset=1&field=0&context=field" icon="television"}{ts}Preview (all fields){/ts}{/crmButton}{if !$skipCreate }{crmButton p="civicrm/profile/create" q="gid=$gid&reset=1" icon="play-circle"}{ts}Use (create mode){/ts}{/crmButton}{/if}
+                {crmButton p="civicrm/admin/uf/group/field/add" q="reset=1&action=add&gid=$gid" icon="plus-circle"}{ts}Add Field{/ts}{/crmButton}{if !$isGroupReserved}{crmButton p="civicrm/admin/uf/group/update" q="action=update&id=`$gid`&reset=1&context=field" icon="wrench"}{ts}Edit Settings{/ts}{/crmButton}{/if}{crmButton p="civicrm/admin/uf/group" q="action=preview&id=`$gid`&reset=1&field=0&context=field" icon="television"}{ts}Preview (all fields){/ts}{/crmButton}{if !$skipCreate }{crmButton p="civicrm/profile/create" q="gid=$gid&reset=1" icon="play-circle"}{ts}Use (create mode){/ts}{/crmButton}{/if}
                 <div class="clear"></div>
             </div>
         {/if}
@@ -79,7 +79,7 @@
         {/strip}
         {if not ($action eq 2 or $action eq 1)}
             <div class="action-link">
-                {crmButton p="civicrm/admin/uf/group/field/add" q="reset=1&action=add&gid=$gid" icon="plus-circle"}{ts}Add Field{/ts}{/crmButton}{if !$isGroupReserved}{crmButton p="civicrm/admin/uf/group" q="action=update&id=`$gid`&reset=1&context=field" icon="pencil"}{ts}Edit Settings{/ts}{/crmButton}{/if}{crmButton p="civicrm/admin/uf/group" q="action=preview&id=`$gid`&reset=1&field=0&context=field" icon="television"}{ts}Preview (all fields){/ts}{/crmButton}{if !$skipCreate }{crmButton p="civicrm/profile/create" q="gid=$gid&reset=1" icon="play-circle"}{ts}Use (create mode){/ts}{/crmButton}{/if}
+                {crmButton p="civicrm/admin/uf/group/field/add" q="reset=1&action=add&gid=$gid" icon="plus-circle"}{ts}Add Field{/ts}{/crmButton}{if !$isGroupReserved}{crmButton p="civicrm/admin/uf/group" q="action=update&id=`$gid`&reset=1&context=field" icon="wrench"}{ts}Edit Settings{/ts}{/crmButton}{/if}{crmButton p="civicrm/admin/uf/group" q="action=preview&id=`$gid`&reset=1&field=0&context=field" icon="television"}{ts}Preview (all fields){/ts}{/crmButton}{if !$skipCreate }{crmButton p="civicrm/profile/create" q="gid=$gid&reset=1" icon="play-circle"}{ts}Use (create mode){/ts}{/crmButton}{/if}
                 <div class="clear"></div>
             </div>
         {/if}

diff --git a/templates/CRM/common/enableDisableApi.tpl b/templates/CRM/common/enableDisableApi.tpl
index b5d033ecd450c1f73600914f052b587c313fad86..83836f45bb37672d11ce1ab47cd0edc617ebbd59 100644 (file)
--- a/templates/CRM/common/enableDisableApi.tpl
+++ b/templates/CRM/common/enableDisableApi.tpl
@@ -55,7 +55,7 @@
     function checkResponse(e, response) {
       if (response.illegal) {
         $(this).dialog('option', 'buttons', [
-          {text: {/literal}'{ts escape="js"}Close{/ts}'{literal}, click: function() {$(this).dialog('close');}, icons: {primary: 'ui-icon-close'}}
+          {text: {/literal}'{ts escape="js"}Close{/ts}'{literal}, click: function() {$(this).dialog('close');}, icons: {primary: 'fa-times'}}
         ]);
       }
     }

diff --git a/templates/CRM/common/formButtons.tpl b/templates/CRM/common/formButtons.tpl
index d8aa278ce57bd2ca31c8bd402869f585f0ba8f59..b5e4692a1334a25dbb66f5487c54204e2aab1955 100644 (file)
--- a/templates/CRM/common/formButtons.tpl
+++ b/templates/CRM/common/formButtons.tpl
@@ -36,9 +36,17 @@
           {assign var='html' value=$form.buttons.$key.html}
         {/if}
         {crmGetAttribute html=$html attr='crm-icon' assign='icon'}
+        {capture assign=iconPrefix}{$icon|truncate:3:"":true}{/capture}
+        {if $icon && $iconPrefix eq 'fa-'}
+          {assign var='buttonClass' value=' crm-i-button'}
+          {capture assign=iconDisp}<i class="crm-i {$icon}"></i>{/capture}
+        {elseif $icon}
+          {assign var='buttonClass' value=' crm-icon-button'}
+          {capture assign=iconDisp}<span class="crm-button-icon ui-icon-{$icon}"> </span>{/capture}
+        {/if}
         {crmGetAttribute html=$html attr='disabled' assign='disabled'}
-        <span class="crm-button crm-button-type-{$key|crmBtnType} crm-button{$key}{if $icon} crm-icon-button{/if}{if $disabled} crm-button-disabled{/if}"{if $buttonStyle} style="{$buttonStyle}"{/if}>
-          {if $icon}<span class="crm-button-icon ui-icon-{$icon}"> </span>{/if}
+        <span class="crm-button crm-button-type-{$key|crmBtnType} crm-button{$key}{$buttonClass}{if $disabled} crm-button-disabled{/if}"{if $buttonStyle} style="{$buttonStyle}"{/if}>
+          {$iconDisp}
           {$html}
         </span>
     {/if}