Template:Paymentmethod/Creditcard: Difference between revisions

Content deleted Content added
use <button>
add logos
Line 2:
<div class="payment-method-div monthly-capable paymentmethod-cc">
<button class="payment-method-button" onclick="donationForm.redirectPayment('cc');">
<span></html>{{{label|{{int:donate_interface-ccdc-button}}}}}<html></span>
 
<svg class="cc-logo-visa" xmlns="http://www.w3.org/2000/svg" aria-labelledby="cc-logo-visa-title" viewBox="0 0 200 120"><title id="cc-logo-visa-title">Visa</title><path fill="#FFFFFF" d="M7.7 0h184.6c4.2 0 7.7 3.3 7.7 7.5v105c0 4.1-3.4 7.5-7.7 7.5H7.7c-4.2 0-7.7-3.3-7.7-7.5V7.5C0 3.3 3.4 0 7.7 0z"/><path fill="#F7B600" d="M0 98v14.3c0 4.2 3.4 7.7 7.7 7.7h184.6c4.2 0 7.7-3.4 7.7-7.7V98H0z"/><path fill="#1A1F71" d="M200 22V7.7c0-4.2-3.4-7.7-7.7-7.7H7.7C3.4 0 0 3.4 0 7.7V22h200zM81.9 36.9L62.3 83.4H49.4l-9.6-37.2c-.6-2.3-1.1-3.1-2.8-4.1-3.8-1.8-7.8-3.1-12-3.9l.2-1.4h20.6c2.8 0 5.1 2 5.6 4.8l5.1 26.9 12.6-31.7h12.8zm50.3 31.3c0-12.3-17-13-16.9-18.4 0-1.7 1.6-3.4 5.2-3.9 4.1-.4 8.2.3 12 2.1l2.1-9.8c-3.6-1.4-7.5-2.1-11.4-2.1-12 0-20.4 6.4-20.5 15.3-.1 6.8 6 10.4 10.6 12.6s6.3 3.8 6.3 5.8c0 3.1-3.8 4.5-7.3 4.5-4.3.1-8.6-.9-12.5-2.9l-2.2 10.2c4.3 1.7 8.9 2.5 13.5 2.5 12.7 0 20.9-6.2 21.1-15.9m31.6 15.2H175l-9.8-46.5h-10.4c-2.3 0-4.3 1.3-5.2 3.4l-18.3 43.1H144l2.5-7h15.6l1.7 7zm-13.6-16.5l6.4-17.4 3.7 17.4h-10.1zm-51-30l-10 46.5H77.1l10-46.5h12.1z"/></svg>
 
<svg class="cc-logo-mastercard" xmlns="http://www.w3.org/2000/svg" aria-labelledby="cc-logo-mastercard-title" viewBox="0 0 200 120"><title id="cc-logo-mastercard-title">MasterCard</title><path d="M192.3 120H7.7c-4.2 0-7.7-3.4-7.7-7.5V7.5C0 3.4 3.5 0 7.7 0h184.6c4.2 0 7.7 3.4 7.7 7.5v105c0 4.1-3.5 7.5-7.7 7.5z"/><g id="Layer_1-2"><path id="_Compound_Path_" fill="#FFFFFF" d="M61.9 106.5v-6.2c.2-2-1.3-3.7-3.3-3.9h-.5c-1.4-.1-2.7.6-3.5 1.8-.7-1.1-1.9-1.8-3.3-1.8-1.2-.1-2.3.5-3 1.5v-1.2h-2v9.9h2v-5.7c-.1-1.3.8-2.5 2.1-2.6h.4c1.4 0 2.2.9 2.2 2.6v5.7h2v-5.7c-.1-1.3.8-2.5 2.1-2.6h.4c1.5 0 2.2.9 2.2 2.6v5.7l2.2-.1zm32.1-10h-3.6v-3h-2v3h-2.1v1.8h2.1v4.7c0 2.3.8 3.7 3.3 3.7.9 0 1.9-.3 2.7-.8l-.6-1.8c-.6.3-1.2.5-1.9.6-1 0-1.5-.7-1.5-1.7v-4.8H94v-1.7zm18.3-.2c-1.1 0-2.1.5-2.7 1.5v-1.2h-2v9.9h2v-5.6c0-1.6.8-2.7 2.2-2.7.5 0 .9.1 1.3.2l.7-1.9c-.5-.1-1-.2-1.5-.2zm-27.7 1c-1.2-.7-2.6-1.1-4-1-2.5 0-4 1.2-4 3.1 0 1.6 1.1 2.6 3.3 2.9l1 .1c1.2.2 1.8.6 1.8 1.1 0 .8-.9 1.3-2.3 1.3-1.2 0-2.3-.3-3.3-1l-1 1.6c1.3.9 2.7 1.3 4.3 1.3 2.8 0 4.4-1.3 4.4-3.2 0-1.9-1.2-2.6-3.3-2.9l-1-.1c-.9-.1-1.8-.4-1.8-1s.8-1.2 2-1.2c1.1 0 2.1.3 3.1.9l.8-1.9zm29.9 4.2c-.1 2.7 2 5.1 4.7 5.2h.5c1.3.1 2.6-.4 3.5-1.2l-1-1.6c-.7.6-1.6.9-2.6.9-1.8-.2-3.2-1.8-3-3.7.2-1.6 1.4-2.9 3-3 .9 0 1.8.3 2.6.9l1-1.6c-1-.8-2.3-1.2-3.5-1.2-2.7-.1-5 2-5.2 4.7v.6zm-13.9-5.2c-2.9 0-4.9 2.1-4.9 5.2-.2 2.7 1.9 5 4.5 5.2h.5c1.5.1 2.9-.4 4-1.4l-1-1.5c-.8.7-1.8 1-2.9 1-1.5.1-2.8-1-3-2.5h7.4v-.8c.1-3.1-1.8-5.2-4.6-5.2zm0 1.8c1.4 0 2.5 1 2.6 2.4v.1h-5.3c.1-1.4 1.3-2.5 2.7-2.5zm-26.7 3.4v-4.9h-2v1.2c-.8-1-2-1.5-3.2-1.5-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2 1.2.1 2.4-.5 3.2-1.5v1.2h2v-4.9zm-7.9 0c-.1-1.7 1.1-3.2 2.8-3.4h.3c1.8.2 3.2 1.8 3 3.7-.2 1.6-1.4 2.9-3 3-1.7 0-3.1-1.4-3.1-3.1-.1 0-.1-.1 0-.2zm76.1-5.2c-1.1 0-2.1.5-2.7 1.5v-1.2h-2v9.9h2v-5.6c0-1.6.8-2.7 2.2-2.7.5 0 .9.1 1.3.2l.7-1.9c-.5-.1-1-.2-1.5-.2zm15.8 8.7c.1 0 .3 0 .4.1.1 0 .2.1.3.2.1.1.2.2.2.3.1.2.1.5 0 .8-.1.1-.1.2-.2.3-.1.1-.2.2-.3.2-.1.1-.3.1-.4.1-.4 0-.8-.2-.9-.6-.1-.2-.1-.5 0-.8.1-.1.1-.2.2-.3.1-.1.2-.2.3-.2.2 0 .3-.1.4-.1zm0 1.8c.1 0 .2 0 .3-.1.1 0 .2-.1.2-.2.3-.3.3-.7 0-1l-.2-.2c-.1 0-.2-.1-.3-.1-.1 0-.2 0-.3.1-.1 0-.2.1-.2.2-.3.3-.3.7 0 1 .1.1.2.1.2.2.1.1.2.1.3.1zm.1-1.2c.1 0 .2 0 .3.1.1.1.1.1.1.2s0 .1-.1.2-.1.1-.2.1l.3.3h-.2l-.3-.3h-.1v.3h-.2v-.9h.4zm-.2.1v.2h.3v-.2h-.3zm-23.3-4.2v-5h-2v1.2c-.8-1-2-1.5-3.2-1.5-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2 1.2.1 2.4-.5 3.2-1.5v1.2h2v-4.8zm-8 0c-.1-1.7 1.1-3.2 2.8-3.4h.3c1.8.2 3.2 1.8 3 3.7-.2 1.6-1.4 2.9-3 3-1.7 0-3.1-1.4-3.1-3.1v-.2zm27.9 0v-9h-2v5.2c-.8-1-2-1.5-3.2-1.5-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2 1.2.1 2.4-.5 3.2-1.5v1.2h2v-4.8zm-8 0c-.1-1.7 1.1-3.2 2.8-3.4h.3c1.8.3 3.1 2 2.8 3.9-.2 1.5-1.4 2.6-2.8 2.8-1.7 0-3.1-1.4-3.1-3.1-.1 0-.1-.1 0-.2z"/><g id="_Group_"><path fill="#FF5F00" d="M83.9 21h32.4v58.7H83.9z"/><path id="_Path_2" fill="#EB001B" d="M86 50.3C86 38.8 91.2 28 100.2 21c-16.1-12.7-39.4-9.9-52.1 6.3S38.2 67 54.3 79.7c13.4 10.6 32.4 10.6 45.8 0C91.2 72.6 86 61.8 86 50.3z"/><path fill="#F79E1B" d="M156.6 73.5v-1.2h.5V72h-1.2v.2h.5v1.2h.2zm2.4 0V72h-.4l-.4 1-.4-1h-.4v1.5h.3v-1.1l.4.9h.3l.4-.9v1.1h.2zm1.2-23.2c0 20.6-16.6 37.3-37.1 37.3-8.3 0-16.4-2.8-22.9-8 16.1-12.7 18.9-36.2 6.2-52.4-1.8-2.3-3.9-4.4-6.2-6.3 16.1-12.7 39.4-9.9 52.1 6.3 5.1 6.6 7.9 14.8 7.9 23.1z"/></g></g></svg>
 
<svg class="cc-logo-amex" xmlns="http://www.w3.org/2000/svg" aria-labelledby="cc-logo-amex-title" viewBox="0 0 200 120"><title id="cc-logo-amex-title">Amex</title><linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="187.342" y1="3564.816" x2="13.247" y2="3503.596" gradientTransform="translate(0 -3474.102)"><stop offset="0" stop-color="#51BCEA"/><stop offset="1" stop-color="#3078BC"/></linearGradient><path fill="url(#SVGID_1_)" d="M192.3 120H7.7c-4.2 0-7.7-3.5-7.7-7.7V7.7C0 3.5 3.5 0 7.7 0h184.6c4.2 0 7.7 3.5 7.7 7.7v104.7c0 4.1-3.5 7.6-7.7 7.6z"/><path fill="#FFFFFF" d="M162.8 60.1L179 42.5h-11L157.4 54l-10.2-11.5h-33.4v35h32.9l10.6-11.6 10.2 11.6h10.8l-15.5-17.4zm-20.3 10.1H122v-7h18.2V56H122v-6.4h20.8l9.1 10.2-9.4 10.4zm-95-7.7l-5.6-13.9-5.6 13.9m74.4 15h-8.5V50.1L90.1 77.5h-7.3L70.7 50.1v27.4h-17l-3.2-7.8H33.2L30 77.5h-9l14.9-35h12.3l14.1 33.1V42.5H76l10.9 23.7 10-23.7h13.8v35z"/></svg>
 
<svg class="cc-logo-jcb" xmlns="http://www.w3.org/2000/svg" aria-labelledby="cc-logo-jcb-title" viewBox="0 0 200 120"><title id="cc-logo-jcb-title">JCB</title><path fill="#FFFFFF" d="M193.1 0H7.7C3.4 0 0 3.3 0 7.5v105c0 3.9 3.1 7.1 6.9 7.5h185.4c4.3 0 7.7-3.4 7.7-7.5V7.5c0-3.9-3.1-7.1-6.9-7.5z"/><linearGradient id="path6338_1_" gradientUnits="userSpaceOnUse" x1="-227.894" y1="959.936" x2="-209.808" y2="959.936" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#007940"/><stop offset=".229" stop-color="#00873F"/><stop offset=".743" stop-color="#40A737"/><stop offset="1" stop-color="#5CB531"/></linearGradient><path id="path6338" fill="url(#path6338_1_)" d="M130.4 69.6h8.7c.2 0 .8-.1 1.1-.1 1.6-.3 3.1-1.8 3.1-3.9 0-2-1.4-3.5-3.1-3.9-.2-.1-.7-.1-1.1-.1h-8.7v8z"/><linearGradient id="path6349_1_" gradientUnits="userSpaceOnUse" x1="-227.894" y1="962.732" x2="-209.823" y2="962.732" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#007940"/><stop offset=".229" stop-color="#00873F"/><stop offset=".743" stop-color="#40A737"/><stop offset="1" stop-color="#5CB531"/></linearGradient><path id="path6349" fill="url(#path6349_1_)" d="M138.1 15c-8.2 0-15 6.7-15 15v15.6h21.2c.5 0 1.1 0 1.5.1 4.8.2 8.3 2.7 8.3 7 0 3.4-2.4 6.3-6.8 6.8v.2c4.9.3 8.6 3 8.6 7.3 0 4.5-4.1 7.5-9.6 7.5H123V105h22c8.2 0 15-6.7 15-15V15h-21.9z"/><linearGradient id="path6360_1_" gradientUnits="userSpaceOnUse" x1="-227.894" y1="965.808" x2="-209.807" y2="965.808" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#007940"/><stop offset=".229" stop-color="#00873F"/><stop offset=".743" stop-color="#40A737"/><stop offset="1" stop-color="#5CB531"/></linearGradient><path id="path6360" fill="url(#path6360_1_)" d="M142.1 53.7c0-2-1.4-3.3-3.1-3.5-.2 0-.6-.1-.8-.1h-7.8v7.3h7.8c.2 0 .7 0 .8-.1 1.7-.3 3.1-1.7 3.1-3.6z"/><linearGradient id="path6371_1_" gradientUnits="userSpaceOnUse" x1="-268.384" y1="962.752" x2="-250.018" y2="962.752" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#1F286F"/><stop offset=".475" stop-color="#004E94"/><stop offset=".826" stop-color="#0066B1"/><stop offset="1" stop-color="#006FBC"/></linearGradient><path id="path6371" fill="url(#path6371_1_)" d="M55.1 15c-8.2 0-15 6.7-15 15v37c4.2 2.1 8.6 3.4 12.9 3.4 5.2 0 8-3.1 8-7.4V45.5h12.9v17.4c0 6.8-4.2 12.3-18.5 12.3-8.7 0-15.4-1.9-15.4-1.9v31.6h22c8.2 0 15-6.7 15-15V15H55.1z"/><linearGradient id="path6384_1_" gradientUnits="userSpaceOnUse" x1="-248.235" y1="962.712" x2="-230.398" y2="962.712" gradientTransform="matrix(2.0492 0 0 -2.0492 590.04 2032.794)"><stop offset="0" stop-color="#6C2C2F"/><stop offset=".173" stop-color="#882730"/><stop offset=".573" stop-color="#BE1833"/><stop offset=".859" stop-color="#DC0436"/><stop offset="1" stop-color="#E60039"/></linearGradient><path id="path6384" fill="url(#path6384_1_)" d="M96.6 15c-8.2 0-15 6.7-15 15v19.6c3.8-3.2 10.4-5.3 21-4.8 5.7.2 11.8 1.8 11.8 1.8V53c-3.1-1.6-6.7-3-11.4-3.3-8.1-.6-12.9 3.4-12.9 10.3 0 7 4.9 11 12.9 10.3 4.7-.3 8.3-1.8 11.4-3.3v6.3s-6 1.6-11.8 1.8c-10.6.5-17.2-1.6-21-4.8V105h22c8.2 0 15-6.7 15-15V15h-22z"/></svg>
 
<svg class="cc-logo-discover" xmlns="http://www.w3.org/2000/svg" aria-labelledby="cc-logo-discover-title" viewBox="0 0 200 120"><title id="cc-logo-discover-title">Discover</title><path fill="#FFFFFF" d="M192.3 120H7.7c-4.2 0-7.7-3.5-7.7-7.7V7.7C0 3.5 3.5 0 7.7 0h184.6c4.2 0 7.7 3.5 7.7 7.7v104.7c0 4.1-3.5 7.6-7.7 7.6z"/><path fill="#E77730" d="M47.5 120h144.8c4.2 0 7.7-3.5 7.7-7.7V64.6s-21.5 15.4-61.9 31C104 108.9 57 118.2 47.5 120z"/><path fill="#211E1E" d="M26.6 54.2c-1.8 1.6-4 2.3-7.6 2.3h-1.5V37.8H19c3.6 0 5.8.6 7.6 2.3 1.9 1.7 3.1 4.4 3.1 7 0 2.7-1.2 5.4-3.1 7.1m-6.5-21.3h-8.2v28.2H20c4.3 0 7.4-1 10.2-3.3 3.3-2.7 5.2-6.7 5.2-10.8 0-8.2-6.3-14.1-15.3-14.1M38 61.3h5.6V32.9H38v28.4zm19.1-17.5c-3.3-1.2-4.3-2-4.3-3.6 0-1.8 1.8-3.2 4.1-3.2 1.7 0 3 .7 4.5 2.3l2.9-3.8c-2.4-2.1-5.3-3.2-8.4-3.2-5.1 0-8.9 3.5-8.9 8.1 0 3.9 1.8 5.9 7 7.7 2.2.8 3.3 1.3 3.8 1.6 1.1.7 1.7 1.8 1.7 2.9 0 2.3-1.9 4-4.3 4-2.7 0-4.8-1.3-6.1-3.8l-3.6 3.5c2.6 3.8 5.6 5.3 9.9 5.3 5.8 0 9.8-3.8 9.8-9.2.2-4.3-1.7-6.3-8.1-8.6m10 3.3c0 8.3 6.6 14.8 15.1 14.8 2.4 0 4.5-.5 7-1.7v-6.5c-2.2 2.2-4.2 3.1-6.7 3.1-5.6 0-9.6-4.1-9.6-9.7 0-5.4 4.1-9.7 9.3-9.7 2.7 0 4.7 1 7 3.2V34c-2.4-1.2-4.5-1.8-6.9-1.8-8.4.1-15.2 6.7-15.2 14.9m66.2 4.9l-7.6-19h-6.1l12.1 29h3l12.4-29h-6l-7.8 19m16.3 9.3h15.8v-4.8h-10.2v-7.7h9.8V44h-9.8v-6.2h10.2v-4.9h-15.8M176.3 46h-1.6v-8.5h1.7c3.5 0 5.4 1.4 5.4 4.2-.1 2.7-2 4.3-5.5 4.3m11.1-4.6c0-5.2-3.7-8.3-10.1-8.3H169v28.2h5.6V49.9h.7l7.7 11.4h6.9l-9-11.9c4.2-.9 6.5-3.8 6.5-8"/><path fill="#E77731" d="M121.2 47.1c0 8.2-6.8 15-15.1 15S91 55.3 91 47.1s6.8-15 15.1-15c8.4 0 15.1 6.8 15.1 15"/><path fill="none" d="M106.3 32c-.6 0-1.2 0-1.8.1.2 0 .4 0 .6-.1.5.1.9.1 1.2 0h.8-.8M91.4 43.6c-.1.5-.2 1.1-.3 1.6 0 .2 0 .4-.1.5.1-.5.1-1 .2-1.5.1-.1.1-.3.2-.6"/></svg>
</button>
</div>