| 1 |
export const LayoutOne = ({ value }) => { |
| 2 |
return ( |
| 3 |
<svg xmlns="http://www.w3.org/2000/svg" width={120} height={55} fill="none"> |
| 4 |
<path |
| 5 |
stroke={"layoutOne" === value ? "#1A74E4" : "#58707F"} |
| 6 |
strokeWidth={1.5} |
| 7 |
d="M6 1h108c1.442 0 2.423.002 3.158.1.706.096 1.033.263 1.256.486.223.223.39.55.485 1.256.099.735.101 1.716.101 3.158v43c0 1.442-.002 2.423-.101 3.158-.095.706-.262 1.033-.485 1.256-.223.223-.55.39-1.256.485-.735.1-1.716.101-3.158.101H6c-1.442 0-2.423-.002-3.158-.1-.706-.096-1.033-.263-1.256-.486-.223-.223-.39-.55-.485-1.256C1 51.423 1 50.442 1 49V6c0-1.442.002-2.423.1-3.158.096-.706.263-1.033.486-1.256.223-.223.55-.39 1.256-.485C3.577 1 4.558 1 6 1Z" |
| 8 |
/> |
| 9 |
<rect width={32} height={9} x={8.5} y={25.5} fill="#fff" stroke="#58707F" rx={1.5} /> |
| 10 |
<path stroke="#58707F" strokeLinecap="round" strokeLinejoin="round" d="m37.5 29-2 2-2-2" /> |
| 11 |
<rect width={12} height={2} x={11} y={29} fill="#58707F" rx={1} /> |
| 12 |
<rect width={16} height={3} x={8} y={20} fill="#58707F" rx={1.5} /> |
| 13 |
<rect width={32} height={9} x={44} y={25.5} fill="#fff" stroke="#58707F" rx={1.5} /> |
| 14 |
<path stroke="#58707F" strokeLinecap="round" strokeLinejoin="round" d="m73 29-2 2-2-2" /> |
| 15 |
<rect width={12} height={2} x={46.5} y={29} fill="#58707F" rx={1} /> |
| 16 |
<rect width={16} height={3} x={43.5} y={20} fill="#58707F" rx={1.5} /> |
| 17 |
<rect width={32} height={9} x={79.5} y={25.5} fill="#fff" stroke="#58707F" rx={1.5} /> |
| 18 |
<path |
| 19 |
stroke="#58707F" |
| 20 |
strokeLinecap="round" |
| 21 |
strokeLinejoin="round" |
| 22 |
strokeWidth={0.75} |
| 23 |
d="m85.5 31.75-.846-.846m.457-1.098a1.555 1.555 0 1 1-3.11 0 1.555 1.555 0 0 1 3.11 0Z" |
| 24 |
/> |
| 25 |
<rect width={12} height={2} x={88} y={29} fill="#58707F" rx={1} /> |
| 26 |
<rect width={16} height={3} x={79} y={20} fill="#58707F" rx={1.5} /> |
| 27 |
<g clipPath="url(#a)"> |
| 28 |
<path |
| 29 |
fill="#fff" |
| 30 |
d="M109.028 5H109a6.032 6.032 0 0 0-4.817 2.422A5.951 5.951 0 0 0 103 11c0 1.146.324 2.26.938 3.221a6.015 6.015 0 0 0 2.434 2.174A5.944 5.944 0 0 0 109 17H109.027c3.294-.016 5.973-2.707 5.973-6s-2.679-5.984-5.972-6Zm3.551 4.727-3.765 3.765a.858.858 0 0 1-1.219 0l-2.175-2.174a.864.864 0 0 1 .611-1.473c.23 0 .447.09.61.253l1.564 1.564 3.154-3.155a.858.858 0 0 1 .61-.252c.231 0 .447.09.61.253.163.163.253.38.253.61 0 .23-.09.446-.253.61Z" |
| 31 |
/> |
| 32 |
<path |
| 33 |
fill="#fff" |
| 34 |
d="m112.579 9.727-3.765 3.765a.858.858 0 0 1-1.219 0l-2.175-2.174a.864.864 0 0 1 .611-1.473c.23 0 .447.09.61.253l1.564 1.564 3.154-3.155a.858.858 0 0 1 .61-.252c.231 0 .447.09.61.253.163.163.253.38.253.61 0 .23-.09.446-.253.61Z" |
| 35 |
/> |
| 36 |
<path |
| 37 |
fill="#1A74E4" |
| 38 |
d="M109.028 5H109a6.032 6.032 0 0 0-4.817 2.422A5.951 5.951 0 0 0 103 11c0 1.146.324 2.26.938 3.221a6.015 6.015 0 0 0 2.434 2.174A5.944 5.944 0 0 0 109 17H109.027c3.294-.016 5.973-2.707 5.973-6s-2.679-5.984-5.972-6Zm3.551 4.727-3.765 3.765a.858.858 0 0 1-1.219 0l-2.175-2.174a.864.864 0 0 1 .611-1.473c.23 0 .447.09.61.253l1.564 1.564 3.154-3.155a.858.858 0 0 1 .61-.252c.231 0 .447.09.61.253.163.163.253.38.253.61 0 .23-.09.447-.253.61Z" |
| 39 |
/> |
| 40 |
</g> |
| 41 |
</svg> |
| 42 |
); |
| 43 |
}; |
| 44 |
export const LayoutTwo = ({ value, coming }) => { |
| 45 |
return ( |
| 46 |
<svg |
| 47 |
xmlns="http://www.w3.org/2000/svg" |
| 48 |
width={120} |
| 49 |
height={55} |
| 50 |
fill="none" |
| 51 |
// className={coming ? 'sp-coming-layout' : ''} |
| 52 |
> |
| 53 |
<path |
| 54 |
fill="#fff" |
| 55 |
d="M6 .75h108c1.435 0 2.436.002 3.191.104.734.098 1.123.278 1.4.555.277.277.457.666.555 1.4.102.755.104 1.756.104 3.191v43c0 1.435-.002 2.436-.104 3.191-.098.734-.278 1.123-.555 1.4-.277.277-.666.457-1.4.556-.755.101-1.756.103-3.191.103H6c-1.435 0-2.436-.002-3.191-.103-.734-.1-1.123-.28-1.4-.556-.277-.277-.457-.666-.555-1.4C.752 51.436.75 50.435.75 49V6c0-1.435.002-2.436.104-3.191.098-.734.278-1.123.555-1.4.277-.277.666-.457 1.4-.555C3.564.752 4.565.75 6 .75Z" |
| 56 |
/> |
| 57 |
<path |
| 58 |
stroke={"layoutTwo" === value ? "#1A74E4" : "#58707F"} |
| 59 |
strokeWidth={1.5} |
| 60 |
d="M6 .75h108c1.435 0 2.436.002 3.191.104.734.098 1.123.278 1.4.555.277.277.457.666.555 1.4.102.755.104 1.756.104 3.191v43c0 1.435-.002 2.436-.104 3.191-.098.734-.278 1.123-.555 1.4-.277.277-.666.457-1.4.556-.755.101-1.756.103-3.191.103H6c-1.435 0-2.436-.002-3.191-.103-.734-.1-1.123-.28-1.4-.556-.277-.277-.457-.666-.555-1.4C.752 51.436.75 50.435.75 49V6c0-1.435.002-2.436.104-3.191.098-.734.278-1.123.555-1.4.277-.277.666-.457 1.4-.555C3.564.752 4.565.75 6 .75Z" |
| 61 |
/> |
| 62 |
<rect width={103} height={1} x={9} y={30.5} fill="#9EA9B2" rx={0.5} /> |
| 63 |
<path |
| 64 |
fill="#58707F" |
| 65 |
stroke="#58707F" |
| 66 |
d="M9 24h19a.5.5 0 0 1 .5.5V31H9a.5.5 0 0 1-.5-.5v-6A.5.5 0 0 1 9 24Z" |
| 67 |
/> |
| 68 |
<rect width={12} height={2} x={12} y={26.5} fill="#fff" rx={1} /> |
| 69 |
<path fill="#58707F" d="M51 30.5h12v1H51z" /> |
| 70 |
<rect width={8} height={2} x={53} y={26.5} fill="#58707F" rx={1} /> |
| 71 |
<rect width={10} height={2} x={67} y={26.5} fill="#58707F" rx={1} /> |
| 72 |
<rect width={10} height={2} x={82} y={26.5} fill="#58707F" rx={1} /> |
| 73 |
<rect width={8} height={2} x={97} y={26.5} fill="#58707F" rx={1} /> |
| 74 |
<path stroke="#58707F" strokeLinecap="round" strokeLinejoin="round" d="m112 26.5-2 2-2-2" /> |
| 75 |
</svg> |
| 76 |
); |
| 77 |
}; |
| 78 |
|
| 79 |
export const LiveFilterIcon = () => ( |
| 80 |
<svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" viewBox="0 0 800 800" width={80} height={80}> |
| 81 |
<defs> |
| 82 |
<style>{".sp-st0{fill:var(--sp-smart-primary-2-600)}"}</style> |
| 83 |
</defs> |
| 84 |
<rect width={128.9} height={41.9} x={79.3} y={431.5} className="sp-st0" rx={21} ry={21} /> |
| 85 |
<path |
| 86 |
d="M291.2 428.3c5.9-3.9 13.8-3.2 19 2 5.2 5.2 5.8 13.1 2 19l-2 2.4-21.6 21.6c-6.9 6.9-17.5 7.7-25.3 2.6l-3.2-2.6-21.6-21.6-2-2.4c-3.9-5.9-3.2-13.8 2-19 5.2-5.2 13.1-5.8 19-2l2.4 2 14.5 14.5 14.5-14.5 2.4-2Z" |
| 87 |
className="sp-st0" |
| 88 |
/> |
| 89 |
<path |
| 90 |
d="M327.5 570H63.2C33.9 570 10 546.1 10 516.8V387.9c0-29.3 23.9-53.2 53.2-53.2h264.3c29.3 0 53.2 23.9 53.2 53.2v128.9c0 29.3-23.9 53.2-53.2 53.2ZM63.2 376.6c-6.2 0-11.3 5-11.3 11.3v128.9c0 6.2 5.1 11.3 11.3 11.3h264.3c6.2 0 11.3-5 11.3-11.3V387.9c0-6.2-5.1-11.3-11.3-11.3H63.2ZM256.6 288H47.1c-16 0-29-13-29-29s13-29 29-29h209.5c16 0 29 13 29 29s-13 29-29 29ZM736.8 570H472.5c-29.3 0-53.2-23.9-53.2-53.2V387.9c0-29.3 23.9-53.2 53.2-53.2h264.3c29.3 0 53.2 23.9 53.2 53.2v128.9c0 29.3-23.9 53.2-53.2 53.2ZM472.5 376.6c-6.2 0-11.3 5-11.3 11.3v128.9c0 6.2 5.1 11.3 11.3 11.3h264.3c6.2 0 11.3-5 11.3-11.3V387.9c0-6.2-5.1-11.3-11.3-11.3H472.5Z" |
| 91 |
className="sp-st0" |
| 92 |
/> |
| 93 |
<circle cx={527.3} cy={452.4} r={32.2} className="sp-st0" /> |
| 94 |
<path |
| 95 |
d="M553.1 486.2c-2.1 0-4.1-.8-5.7-2.4l-32.2-32.2c-3.1-3.1-3.1-8.2 0-11.4s8.2-3.1 11.4 0l32.2 32.2c3.1 3.1 3.1 8.2 0 11.4s-3.6 2.4-5.7 2.4Z" |
| 96 |
className="sp-st0" |
| 97 |
/> |
| 98 |
<rect width={128.9} height={41.9} x={591.8} y={431.4} className="sp-st0" rx={21} ry={21} /> |
| 99 |
<path |
| 100 |
d="M654.6 288H456.4c-16 0-29-13-29-29s13-29 29-29h198.2c16 0 29 13 29 29s-13 29-29 29Z" |
| 101 |
className="sp-st0" |
| 102 |
/> |
| 103 |
</svg> |
| 104 |
); |
| 105 |
|
