in support-frontend/assets/pages/supporter-plus-landing/components/PaymentIcons.tsx [15:114]
export function PaymentCards() {
return (
<div css={paymentMethods}>
{/* Visa */}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 30 20">
<rect
width="29.5"
height="19.5"
x=".25"
y=".25"
stroke="#000"
strokeWidth=".5"
rx="2.75"
fill="#fff"
/>
<path
fill="#1A1F70"
d="m11.547 5.779-3.55 8.473H5.682L3.931 7.489c-.106-.416-.193-.568-.52-.743a9 9 0 0 0-2.161-.72l.05-.247h3.73a1.026 1.026 0 0 1 1.012.863l.923 4.898L9.243 5.78zm9.076 5.7c.01-2.232-3.084-2.357-3.068-3.355 0-.302.294-.625.928-.708a4.14 4.14 0 0 1 2.161.385l.386-1.797a5.9 5.9 0 0 0-2.051-.379c-2.172 0-3.691 1.155-3.714 2.798-.014 1.219 1.089 1.896 1.927 2.31s1.143.669 1.137 1.054c0 .568-.68.82-1.31.828a4.6 4.6 0 0 1-2.25-.534l-.399 1.855a6.6 6.6 0 0 0 2.437.439c2.313 0 3.81-1.136 3.816-2.889zm5.72 2.763h2.028l-1.77-8.463h-1.87a1 1 0 0 0-.934.616l-3.288 7.847h2.302l.456-1.263h2.813zm-2.445-2.998 1.156-3.177.663 3.177zm-9.212-5.465-1.811 8.473h-2.2l1.812-8.473z"
/>
</svg>
{/* MasterCard */}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 30 20">
<rect
width="29.5"
height="19.5"
x=".25"
y=".25"
stroke="#000"
strokeWidth=".5"
rx="2.75"
fill="#fff"
/>
<path fill="#FF5F00" d="M17.854 4.454h-5.949v10.69h5.95z" />
<path
fill="#EB001B"
d="M12.283 9.799a6.79 6.79 0 0 1 2.597-5.345 6.799 6.799 0 1 0 0 10.69 6.79 6.79 0 0 1-2.597-5.345"
/>
<path
fill="#F79E1B"
d="M25.88 9.799a6.798 6.798 0 0 1-11 5.345 6.8 6.8 0 0 0 0-10.69 6.798 6.798 0 0 1 11 5.345M25.231 14.012v-.22h.088v-.044h-.224v.045h.088v.219zm.436 0v-.264h-.069l-.079.181-.08-.181h-.068v.264h.049v-.2l.074.172h.05l.075-.172v.2z"
/>
</svg>
{/* Amex */}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 30 20">
<g clipPath="url(#a)">
<rect width="30" height="20" fill="#fff" rx="3" />
<path
fill="#006FCF"
d="m25.875 4.114.76-2.006H30v-3.633H-3.75v22.989H30V17.83h-3.202l-1.194-1.355-1.194 1.355H15.4v-7.265h-2.984l3.745-8.404h3.636l.868 1.898V2.162h4.505zm-2.496.542.325.813 1.52 4.012h1.411l1.52-4.012.271-.813v4.771H30V3.301h-2.605L26.2 6.39l-.326.867-.325-.867-1.194-3.09H21.75v6.126h1.628zm-3.365 4.771h1.79l-2.713-6.126h-2.116L14.26 9.427h1.791l.489-1.193h2.985zm-2.28-4.012.326-.759.326.759.651 1.572h-1.9zm-1.085 5.15v6.127h5.102v-1.3h-3.582v-1.085h3.473v-1.301H18.17V11.92h3.582V10.62zm10.854 6.073h2.009l-2.877-3.036 2.877-3.036h-2.009l-1.845 2.006-1.845-2.006h-2.062l2.876 3.09-2.876 3.036h1.953l1.846-2.006zm.76-3.036L30 15.392v-3.525z"
/>
</g>
<rect
width="29.5"
height="19.5"
x=".25"
y=".25"
stroke="#000"
strokeWidth=".5"
rx="2.75"
/>
<defs>
<clipPath id="a">
<rect width="30" height="20" fill="#fff" rx="3" />
</clipPath>
</defs>
</svg>
{/* Paypal */}
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 30 20">
<rect width="29.5" height="19.5" x=".25" y=".25" rx="2.75" />
<rect
width="29.5"
height="19.5"
x=".25"
y=".25"
stroke="#000"
strokeWidth=".5"
rx="2.75"
fill="#fff"
/>
<path
fill="#253B80"
d="m12.301 16.992.256-1.652-.57-.013H9.27l1.889-12.185a.16.16 0 0 1 .053-.095.15.15 0 0 1 .1-.038h4.585c1.522 0 2.572.322 3.12.958.257.298.421.61.5.953.083.36.085.79.004 1.314l-.006.038v.336l.257.148q.324.174.52.404c.22.255.363.579.423.963.062.395.041.866-.06 1.398-.118.612-.307 1.146-.563 1.582a3.2 3.2 0 0 1-.892.994c-.34.246-.745.432-1.202.552a6 6 0 0 1-1.501.176h-.357c-.255 0-.503.094-.697.261a1.1 1.1 0 0 0-.364.66l-.027.149-.451 2.91-.02.107c-.006.034-.015.05-.03.062a.07.07 0 0 1-.046.017z"
/>
<path
fill="#179BD7"
d="M20.014 6.31q-.02.134-.047.274c-.604 3.157-2.672 4.248-5.314 4.248h-1.345a.66.66 0 0 0-.646.563l-.688 4.441-.195 1.26a.348.348 0 0 0 .34.404h2.385a.58.58 0 0 0 .567-.492l.023-.123.45-2.9.028-.158a.58.58 0 0 1 .567-.493h.357c2.311 0 4.12-.955 4.65-3.717.22-1.153.106-2.117-.479-2.794a2.3 2.3 0 0 0-.653-.512"
/>
<path
fill="#222D65"
d="M19.382 6.054a5 5 0 0 0-.588-.132 7.4 7.4 0 0 0-1.186-.088h-3.593a.582.582 0 0 0-.567.493l-.764 4.924-.022.144a.66.66 0 0 1 .646-.563h1.345c2.641 0 4.71-1.09 5.314-4.248q.027-.14.047-.273a3.2 3.2 0 0 0-.632-.257"
/>
<path
fill="#253B80"
d="M13.449 6.327a.58.58 0 0 1 .566-.493h3.593q.64-.001 1.186.088.155.025.302.058a5 5 0 0 1 .421.118q.267.09.497.213c.18-1.167 0-1.96-.62-2.68-.685-.792-1.919-1.131-3.498-1.131h-4.584a.66.66 0 0 0-.648.563l-1.91 12.31a.398.398 0 0 0 .39.463h2.83l.71-4.585z"
/>
</svg>
</div>
);
}