Split checkout widget into separate components
This commit is contained in:
@@ -1,11 +1,143 @@
|
||||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2250_408)">
|
||||
<path d="M50 0H14C6.26801 0 0 6.26801 0 14V50C0 57.732 6.26801 64 14 64H50C57.732 64 64 57.732 64 50V14C64 6.26801 57.732 0 50 0Z" fill="#DE378C" style="fill:#DE378C;fill:color(display-p3 0.8706 0.2157 0.5490);fill-opacity:1;"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M27.5429 35.2222C28.3153 33.6375 29.8697 32.4074 31.6571 32.4074C33.4446 32.4074 34.999 33.6375 35.7715 35.2222H27.5429ZM31.6553 12C35.8221 12 39.2 15.4966 39.2 19.81V21.9973C39.2 22.278 38.9669 22.5556 38.6957 22.5556H35.9199C35.6487 22.5556 35.4287 22.278 35.4287 21.9973V19.81C35.4287 17.6561 33.7383 15.9037 31.6574 15.9037C29.5766 15.9037 27.8861 17.6561 27.8861 19.81V21.9973C27.8861 22.278 27.6484 22.5556 27.3772 22.5556H24.6014C24.3303 22.5556 24.1149 22.278 24.1149 21.9973V19.6502C24.1149 19.6446 24.1147 19.639 24.1146 19.6335C24.1143 19.6212 24.114 19.6091 24.1152 19.5968C24.2247 15.3823 27.5575 12 31.6553 12ZM23.1959 39.849C24.1665 43.9247 27.7532 47.0445 32.0195 47.0445H43.9467C43.6667 48.7193 42.2168 50 40.4786 50H23.5214C21.5847 50 20 48.3246 20 46.337V28.9349C20 26.9473 21.5847 25.3704 23.5214 25.3704H40.4786C42.4154 25.3704 44 26.9965 44 28.9841L43.9836 42.3156H32.0195C30.1865 42.3156 28.597 41.4289 27.811 39.8526H41.12V37.5918C41.12 32.4511 37.0094 28.2721 32.0001 28.2721C27.7409 28.2721 24.1585 31.2996 23.181 35.3653C23.181 35.3653 22.9154 36.7267 22.9154 37.6141C22.9154 38.5013 23.1959 39.849 23.1959 39.849Z" fill="white" style="fill:white;fill-opacity:1;"/>
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
|
||||
<svg
|
||||
version="1.1"
|
||||
id="Layer_1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
width="768.80499"
|
||||
height="472.84698"
|
||||
viewBox="0 0 768.80499 472.84698"
|
||||
enable-background="new 0 0 889 577"
|
||||
xml:space="preserve"
|
||||
sodipodi:docname="eps.svg"
|
||||
inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"><defs
|
||||
id="defs16" /><sodipodi:namedview
|
||||
id="namedview16"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#000000"
|
||||
borderopacity="0.25"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:zoom="1.9792028"
|
||||
inkscape:cx="384.49825"
|
||||
inkscape:cy="229.89054"
|
||||
inkscape:window-width="3440"
|
||||
inkscape:window-height="1353"
|
||||
inkscape:window-x="1920"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="Layer_1" />
|
||||
<g
|
||||
id="g16"
|
||||
transform="translate(-60,-58.5)">
|
||||
<defs
|
||||
id="defs1">
|
||||
<rect
|
||||
id="SVGID_1_"
|
||||
width="889"
|
||||
height="577"
|
||||
x="0"
|
||||
y="0" />
|
||||
</defs>
|
||||
<clipPath
|
||||
id="SVGID_2_">
|
||||
<use
|
||||
xlink:href="#SVGID_1_"
|
||||
overflow="visible"
|
||||
id="use1" />
|
||||
</clipPath>
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 663,295 v 0 h -61.252 c -6.813,0 -12.355,-5.428 -12.355,-12.223 0,-6.795 5.543,-12.777 12.355,-12.777 H 695 v -46 h -93.252 c -32.547,0 -59.028,26.534 -59.028,59 0,32.466 26.481,59 59.028,59 h 60.42 c 6.813,0 12.356,5.406 12.356,12.201 0,6.795 -5.544,11.799 -12.356,11.799 H 532.605 c -11,21 -21.695,39 -43.408,48 H 663 c 32,-0.461 58.176,-27.542 58.176,-59.721 C 721.176,322.102 695,295.461 663,295"
|
||||
id="path1" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="M 428.197,224 C 376.283,224 334,266.535 334,318.8 v 2 195.2 h 47 V 414 h 47.099 c 51.915,0 94.049,-43.101 94.049,-95.366 C 522.147,266.369 480.113,224 428.197,224 m 0,142 H 381 v -47.366 c 0,-26.468 21.073,-48.002 47.197,-48.002 26.125,0 47.377,21.534 47.377,48.002 0,26.469 -21.252,47.366 -47.377,47.366"
|
||||
id="path2" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#c8036f"
|
||||
d="m 185.203,414 c -44.44,0 -81.802,-31.667 -91.912,-73.037 0,0 -2.921,-13.678 -2.921,-22.685 0,-9.007 2.765,-22.826 2.765,-22.826 10.183,-41.268 47.499,-71.998 91.866,-71.998 52.181,0 94.999,42.418 94.999,94.598 V 341 H 141.365 c 8.187,16 24.744,25 43.838,25 H 309.829 L 310,230.681 C 310,210.506 293.495,194 273.32,194 H 96.682 C 76.507,194 60,210.006 60,230.181 V 406.819 C 60,426.994 76.507,444 96.682,444 H 273.32 c 18.105,0 33.208,-13 36.126,-30 z"
|
||||
id="path3" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#c8036f"
|
||||
d="m 185,268.356 c -19.02,0 -35.561,11.644 -43.781,26.644 h 87.564 C 220.563,280 204.023,268.356 185,268.356"
|
||||
id="path4" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#c8036f"
|
||||
d="M 265,136.559 C 265,93.448 229.172,58.5 184.977,58.5 c -43.463,0 -78.812,33.805 -79.973,75.928 -0.019,0.178 -0.004,0.351 -0.004,0.534 v 23.458 c 0,2.806 2.285,5.58 5.161,5.58 h 29.441 c 2.876,0 5.398,-2.774 5.398,-5.58 v -21.861 c 0,-21.528 17.93,-39.043 40,-39.043 22.07,0 40,17.515 40,39.043 v 21.861 c 0,2.806 2.333,5.58 5.209,5.58 h 29.442 c 2.876,0 5.349,-2.774 5.349,-5.58 z"
|
||||
id="path5" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 480.928,475.001 -4.256,24.098 c -2.128,12.18 -10.109,17.758 -20.927,17.758 -9.162,0 -16.256,-5.972 -14.187,-17.738 l 4.255,-24.117 h 6.563 l -4.258,24.098 c -1.301,7.511 2.069,11.787 8.454,11.787 6.562,0 12.178,-3.903 13.536,-11.768 l 4.257,-24.117 h 6.563 z m -25.775,-7.546 c 0,2.01 1.538,2.954 3.193,2.954 2.069,0 4.316,-1.477 4.316,-4.255 0,-1.95 -1.303,-2.954 -3.017,-2.954 -2.125,0 -4.492,1.359 -4.492,4.255 m 14.189,-0.059 c 0,2.068 1.596,3.013 3.311,3.013 1.832,0 4.257,-1.477 4.257,-4.195 0,-1.949 -1.421,-3.014 -3.016,-3.014 -2.128,0 -4.552,1.359 -4.552,4.196"
|
||||
id="path6" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 496.787,475 -2.956,16.651 c 2.541,-3.427 7.625,-5.238 11.172,-5.238 7.33,0 12.414,4.295 12.414,12.273 0,11.291 -7.862,18.081 -17.91,18.081 -3.902,0 -7.214,-1.45 -9.223,-5.114 L 489.161,516 h -5.734 l 7.271,-41 z m -4.61,28.102 c -0.236,4.847 2.896,7.98 7.447,7.98 5.734,0 11.29,-4.436 11.646,-11.172 0.236,-4.907 -2.955,-7.805 -7.391,-7.805 -5.675,0 -11.35,4.553 -11.702,10.997"
|
||||
id="path7" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 529.371,504 c -0.237,4 2.896,7.266 8.217,7.266 2.956,0 6.856,-1.155 8.984,-3.165 l 3.311,3.826 c -3.604,3.309 -8.926,4.955 -13.418,4.955 -8.393,0 -13.301,-5.026 -13.301,-12.712 0,-10.227 8.039,-17.848 18.324,-17.848 9.4,0 14.721,5.678 11.528,17.678 z m 18.68,-5 c 0.473,-5 -2.482,-7.035 -7.39,-7.035 -4.433,0 -8.511,2.035 -10.286,7.035 z"
|
||||
id="path8" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 569.283,487 -0.297,3.855 c 2.84,-3.729 6.268,-4.488 9.399,-4.488 2.837,0 5.378,1.007 6.739,2.483 l -3.664,5.321 c -1.301,-1.179 -2.602,-1.77 -4.849,-1.77 -4.197,0 -8.334,2.517 -9.28,7.896 L 564.555,516 h -6.09 l 5.143,-29 z"
|
||||
id="path9" />
|
||||
<polygon
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
points="628.642,487 635.439,487 620.188,516 613.036,516 610.14,496.869 605.469,506.373 600.386,516 593.292,516 588.148,487 595.006,487 598.021,509.934 609.193,487 614.455,487 617.528,509.934 "
|
||||
id="polygon9" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 643.259,504 c -0.237,4 2.896,7.266 8.217,7.266 2.956,0 6.856,-1.155 8.983,-3.165 l 3.312,3.826 c -3.604,3.309 -8.926,4.955 -13.418,4.955 -8.394,0 -13.301,-5.026 -13.301,-12.712 0,-10.227 8.039,-17.848 18.325,-17.848 9.399,0 14.72,5.678 11.527,17.678 z m 18.679,-5 c 0.473,-5 -2.482,-7.035 -7.39,-7.035 -4.432,0 -8.511,2.035 -10.286,7.035 z"
|
||||
id="path10" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 683.585,487 -5.142,29 h -6.09 l 5.144,-29 z m -5.379,-7.9 c 0,2.068 1.538,3.137 3.193,3.137 2.364,0 4.552,-1.54 4.552,-4.435 0,-1.953 -1.479,-3.077 -3.074,-3.077 -2.189,0 -4.671,1.421 -4.671,4.375"
|
||||
id="path11" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 710.605,494.174 c -1.893,-2.128 -4.314,-2.719 -7.211,-2.719 -4.022,0 -6.858,1.36 -6.858,3.901 0,2.128 2.305,3.018 5.734,3.312 5.32,0.472 12.118,2.247 10.699,9.754 -1.004,5.438 -6.443,8.63 -14.011,8.63 -4.728,0 -9.28,-1.065 -12.354,-5.379 l 3.96,-4.315 c 2.187,3.013 6.03,4.256 9.458,4.315 2.896,0 6.326,-1.064 6.857,-3.783 0.532,-2.601 -1.773,-3.605 -6.029,-4.021 -4.966,-0.473 -10.403,-2.303 -10.403,-7.802 0,-7.271 7.86,-9.813 13.773,-9.813 4.491,0 7.803,1.004 10.522,3.901 z"
|
||||
id="path12" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 729.824,487 -2.776,15.617 c -0.887,4.967 1.36,8.398 6.442,8.398 4.788,0 8.867,-3.967 9.693,-8.813 L 745.843,487 h 6.089 l -5.141,29 h -5.498 l 0.413,-4.202 c -3.429,3.251 -6.799,4.784 -10.876,4.784 -7.153,0 -11.409,-5.128 -9.873,-13.933 L 723.736,487 Z"
|
||||
id="path13" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 778.665,516 2.778,-15.522 c 0.886,-5.025 -0.826,-8.354 -6.384,-8.354 -4.847,0 -8.928,3.899 -9.754,8.687 L 762.645,516 h -6.088 l 5.145,-29 h 5.555 l -0.413,4.238 c 3.37,-3.133 6.856,-4.679 10.638,-4.679 7.096,0 11.707,4.936 10.112,13.863 L 784.813,516 Z"
|
||||
id="path14" />
|
||||
<path
|
||||
clip-path="url(#SVGID_2_)"
|
||||
fill="#71706f"
|
||||
d="m 799.303,520 c -0.413,4 2.66,5.618 7.806,5.618 4.493,0 9.341,-2.509 10.464,-8.892 l 0.885,-4.98 c -2.659,3.724 -7.507,5.194 -11.111,5.194 -7.45,0 -12.651,-4.436 -12.651,-12.478 0,-11.466 8.511,-18.089 18.146,-18.089 4.081,0 7.746,1.938 9.047,5.248 l 1.006,-4.622 h 5.91 l -5.085,29.862 c -1.89,11.056 -10.107,14.486 -17.614,14.486 -8.987,0 -13.95,-4.349 -12.711,-11.349 h 5.908 z m 1.715,-16.72 c 0,4.963 3.252,7.979 7.925,7.979 12.588,0 15.959,-19.33 3.366,-19.33 -5.971,0.001 -11.291,4.432 -11.291,11.351"
|
||||
id="path15" />
|
||||
<g
|
||||
clip-path="url(#SVGID_2_)"
|
||||
id="g15">
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2250_408">
|
||||
<rect width="64" height="64" rx="14" fill="white" style="fill:white;fill-opacity:1;"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 8.0 KiB |
Reference in New Issue
Block a user