Merge credit card icons into one sprint file, and use the term 'icon' instead of...

diff --git a/css/civicrm.css b/css/civicrm.css
index 314ce761aa87c78bca921f950de2245fea250b19..286a2a205d969eb31b675aa3e80b77d2cef72914 100644 (file)
--- a/css/civicrm.css
+++ b/css/civicrm.css
@@ -3961,44 +3961,46 @@ span.crm-status-icon {
 }
 
 /* Styles for credit card payment logos (FIXME: replace with sprite?) */
-#crm-container .credit_card_type-section .crm-credit_card_type-logos .crm-credit_card_type-logo-visa {
-  background: url(../i/cc-visa.png) no-repeat 0 0 transparent;
+#crm-container .credit_card_type-section .crm-credit_card_type-icons a {
+  display: block;
+  float: left;
+  width: 50px;
+  height: 30px;
+  background: url(../i/creditcard-icons.png) no-repeat 0 0 transparent;
+  text-indent: -20000px;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-logos .crm-credit_card_type-logo-mastercard {
-  background: url(../i/cc-mastercard.png) no-repeat 0 0 transparent;
+#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-visa {
+  background-position: 0 0;
+  width: 75px;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-logos .crm-credit_card_type-logo-amex {
-  background: url(../i/cc-amex.png) no-repeat 0 0 transparent;
+#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-mastercard {
+  background-position: -75px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-logos .crm-credit_card_type-logo-discover {
-  background: url(../i/cc-discover.png) no-repeat 0 0 transparent;
+#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-amex {
+  background-position: -125px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-logos .crm-credit_card_type-logo-jcb {
-  background: url(../i/cc-jcb.png) no-repeat 0 0 transparent;
+#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-discover {
+  background-position: -175px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-logos a {
-  display: block;
-  float: left;
-  width: 50px;
-  height: 30px;
-  text-indent: -20000px;
+#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-jcb {
+  background-position: -225px 0;
 }
 
-#crm-container .credit_card_type-section .crm-credit_card_type-logos a.crm-credit_card_type-logo-visa {
-  width: 90px;
+#crm-container .credit_card_type-section .crm-credit_card_type-icons .crm-credit_card_type-icon-unionpay {
+  background-position: -275px 0;
 }
 
-/* Avoid weird border around the images */
-#crm-container .credit_card_type-section .crm-credit_card_type-logos a,
-#crm-container .credit_card_type-section .crm-credit_card_type-logos a:link,
-#crm-container .credit_card_type-section .crm-credit_card_type-logos a:hover,
-#crm-container .credit_card_type-section .crm-credit_card_type-logos a:focus,
-#crm-container .credit_card_type-section .crm-credit_card_type-logos a:active {
+/* Avoid weird border around the images (some themes will add a border around images) */
+#crm-container .credit_card_type-section .crm-credit_card_type-icons a,
+#crm-container .credit_card_type-section .crm-credit_card_type-icons a:link,
+#crm-container .credit_card_type-section .crm-credit_card_type-icons a:hover,
+#crm-container .credit_card_type-section .crm-credit_card_type-icons a:focus,
+#crm-container .credit_card_type-section .crm-credit_card_type-icons a:active {
   color: #fff;
 }
 

diff --git a/i/cc-amex.png b/i/cc-amex.png
deleted file mode 100644 (file)
index a5ad975..0000000
Binary files a/i/cc-amex.png and /dev/null differ

diff --git a/i/cc-discover.png b/i/cc-discover.png
deleted file mode 100644 (file)
index 05311a8..0000000
Binary files a/i/cc-discover.png and /dev/null differ

diff --git a/i/cc-jcb.png b/i/cc-jcb.png
deleted file mode 100644 (file)
index cf43ae8..0000000
Binary files a/i/cc-jcb.png and /dev/null differ

diff --git a/i/cc-mastercard.png b/i/cc-mastercard.png
deleted file mode 100644 (file)
index 6254fb3..0000000
Binary files a/i/cc-mastercard.png and /dev/null differ

diff --git a/i/cc-unionpay.png b/i/cc-unionpay.png
deleted file mode 100644 (file)
index 80a84f3..0000000
Binary files a/i/cc-unionpay.png and /dev/null differ

diff --git a/i/cc-visa.png b/i/cc-visa.png
deleted file mode 100644 (file)
index 31635eb..0000000
Binary files a/i/cc-visa.png and /dev/null differ

diff --git a/i/creditcard-icons.png b/i/creditcard-icons.png
new file mode 100644 (file)
index 0000000..0007636
Binary files /dev/null and b/i/creditcard-icons.png differ

diff --git a/templates/CRM/Core/BillingBlock.js b/templates/CRM/Core/BillingBlock.js
index c67dd9f11c2051ecb3f304f7cd58685e51a0dcec..6b8c23ca6a48d85a4a7852ed590004be30619db0 100644 (file)
--- a/templates/CRM/Core/BillingBlock.js
+++ b/templates/CRM/Core/BillingBlock.js
@@ -2,25 +2,25 @@
 (function($) {
   civicrm_billingblock_creditcard_helper();
 
-  $('#crm-container').on('crmFormLoad', '*', function() {
+  $('#crm-container .credit_card_type-section').on('crmFormLoad', '*', function() {
     civicrm_billingblock_creditcard_helper();
   });
 
   /**
-   * Adds the logos of enabled credit cards
-   * Handles clicking on a logo.
-   * Changes the logo depending on the credit card number.
+   * Adds the icons of enabled credit cards
+   * Handles clicking on a icon.
+   * Changes the icon depending on the credit card number.
    * Removes spaces and dashes from credit card numbers.
    */
   function civicrm_billingblock_creditcard_helper() {
     $.each(CRM.config.creditCardTypes, function(key, val) {
-      var html = '<a href="#" title="' + val + '" class="crm-credit_card_type-logo-' + key + '"><span>' + val + '</span></a>';
-      $('.crm-credit_card_type-logos').append(html);
+      var html = '<a href="#" title="' + val + '" class="crm-credit_card_type-icon-' + key + '"><span>' + val + '</span></a>';
+      $('.crm-credit_card_type-icons').append(html);
 
-      $('.crm-credit_card_type-logo-' + key).click(function() {
+      $('.crm-credit_card_type-icon-' + key).click(function() {
         $('#crm-container .credit_card_type-section #credit_card_type').val(val);
         $('#crm-container .credit_card_type-section a').css('opacity', 0.25);
-        $('#crm-container .credit_card_type-section .crm-credit_card_type-logo-' + key).css('opacity', 1);
+        $('#crm-container .credit_card_type-section .crm-credit_card_type-icon-' + key).css('opacity', 1);
         return false;
       });
     });
@@ -73,7 +73,7 @@
     $.each(card_types, function(key, pattern) {
       if (ccnumber.match('^' + pattern + '$')) {
         var value = card_values[key];
-        $('#crm-container .credit_card_type-section .crm-credit_card_type-logo-' + key).css('opacity', 1);
+        $('#crm-container .credit_card_type-section .crm-credit_card_type-icon-' + key).css('opacity', 1);
         $('select#credit_card_type').val(value);
         return false;
       }

diff --git a/templates/CRM/Core/BillingBlock.tpl b/templates/CRM/Core/BillingBlock.tpl
index ec1fb2f26c71c6850893e36d68f6859e462f00b8..50d96dcfafbda742104d457925afa6efa891c0b4 100644 (file)
--- a/templates/CRM/Core/BillingBlock.tpl
+++ b/templates/CRM/Core/BillingBlock.tpl
@@ -83,7 +83,7 @@
                              <div class="label">{$form.credit_card_type.label} {$reqMark}</div>
                              <div class="content">
                                  {$form.credit_card_type.html}
-                                 <div class="crm-credit_card_type-logos"></div>
+                                 <div class="crm-credit_card_type-icons"></div>
                              </div>
                              <div class="clear"></div>
                         </div>