Normalize canvas of bitpopart icons
Before Width: | Height: | Size: 66 KiB After Width: | Height: | Size: 72 KiB |
|
@ -1,12 +1,34 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
version="1.1"
|
||||
viewBox="0 0 78.199997 75.250015"
|
||||
viewBox="0 0 115 115"
|
||||
id="svg108"
|
||||
width="78.199997"
|
||||
height="75.250015"
|
||||
width="115"
|
||||
height="115"
|
||||
sodipodi:docname="coin-stack.svg"
|
||||
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview
|
||||
id="namedview1"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#000000"
|
||||
borderopacity="0.25"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:zoom="2.8458425"
|
||||
inkscape:cx="12.650033"
|
||||
inkscape:cy="73.089077"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1011"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="32"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="g108" />
|
||||
<defs
|
||||
id="defs1">
|
||||
<style
|
||||
|
@ -82,7 +104,8 @@
|
|||
id="g108"
|
||||
transform="translate(-210.9,-211.9)">
|
||||
<g
|
||||
id="Layer_1">
|
||||
id="Layer_1"
|
||||
transform="translate(18.4,19.874994)">
|
||||
<g
|
||||
id="g107">
|
||||
<g
|
||||
|
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 23 KiB |
|
@ -1,10 +1,10 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
version="1.1"
|
||||
viewBox="0 0 67.300003 65.86734"
|
||||
viewBox="0 0 115 115"
|
||||
id="svg34"
|
||||
width="67.300003"
|
||||
height="65.86734"
|
||||
width="115"
|
||||
height="115"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
|
@ -71,7 +71,7 @@
|
|||
<!-- Generator: Adobe Illustrator 28.6.0, SVG Export Plug-In . SVG Version: 1.2.0 Build 709) -->
|
||||
<g
|
||||
id="g34"
|
||||
transform="translate(-216.29999,-215.4)">
|
||||
transform="translate(-192.45,-190.83367)">
|
||||
<g
|
||||
id="Layer_1">
|
||||
<ellipse
|
||||
|
@ -99,7 +99,7 @@
|
|||
</g>
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="228,268.7 232.1,266.1 232.9,267.4 228.8,270 "
|
||||
points="232.1,266.1 232.9,267.4 228.8,270 228,268.7 "
|
||||
id="polygon2" />
|
||||
<g
|
||||
id="g3">
|
||||
|
@ -125,7 +125,7 @@
|
|||
id="line3" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="229.9,271.6 233.8,269 234.7,270.2 230.8,272.8 "
|
||||
points="233.8,269 234.7,270.2 230.8,272.8 229.9,271.6 "
|
||||
id="polygon3" />
|
||||
<line
|
||||
class="cls-7"
|
||||
|
@ -136,35 +136,35 @@
|
|||
id="line4" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="232,274.3 236.1,271.8 237.1,272.9 233.2,275.3 "
|
||||
points="236.1,271.8 237.1,272.9 233.2,275.3 232,274.3 "
|
||||
id="polygon4" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="234.9,276.7 238.8,274.4 240.1,275.4 236.3,277.6 "
|
||||
points="238.8,274.4 240.1,275.4 236.3,277.6 234.9,276.7 "
|
||||
id="polygon5" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="238.4,278.9 241.9,276.5 243.4,277.3 240.3,279.5 "
|
||||
points="241.9,276.5 243.4,277.3 240.3,279.5 238.4,278.9 "
|
||||
id="polygon6" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="243.2,280.3 246.1,278.4 247.8,278.8 245.3,280.7 "
|
||||
points="246.1,278.4 247.8,278.8 245.3,280.7 243.2,280.3 "
|
||||
id="polygon7" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="226.8,265.4 230.8,263 231.3,264.4 227.3,266.9 "
|
||||
points="230.8,263 231.3,264.4 227.3,266.9 226.8,265.4 "
|
||||
id="polygon8" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="226.2,261.5 229.8,259.4 230.2,260.8 226.4,263 "
|
||||
points="229.8,259.4 230.2,260.8 226.4,263 226.2,261.5 "
|
||||
id="polygon9" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="226.1,257.6 229.4,255.8 229.5,257.1 226.1,259 "
|
||||
points="229.4,255.8 229.5,257.1 226.1,259 226.1,257.6 "
|
||||
id="polygon10" />
|
||||
<polygon
|
||||
class="cls-6"
|
||||
points="227.4,252.5 229.8,251.3 229.6,252.5 227,253.8 "
|
||||
points="229.8,251.3 229.6,252.5 227,253.8 227.4,252.5 "
|
||||
id="polygon11" />
|
||||
<line
|
||||
class="cls-7"
|
||||
|
|
Before Width: | Height: | Size: 7.9 KiB After Width: | Height: | Size: 7.8 KiB |
|
@ -1,10 +1,10 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
version="1.1"
|
||||
viewBox="0 0 89.384354 97"
|
||||
viewBox="0 0 115 115"
|
||||
id="svg35"
|
||||
width="89.384354"
|
||||
height="97"
|
||||
width="115"
|
||||
height="115"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
|
@ -79,7 +79,7 @@
|
|||
<!-- Generator: Adobe Illustrator 28.6.0, SVG Export Plug-In . SVG Version: 1.2.0 Build 709) -->
|
||||
<g
|
||||
id="g35"
|
||||
transform="translate(-205.36126,-201)">
|
||||
transform="translate(-192.55343,-190.95006)">
|
||||
<g
|
||||
id="Layer_1">
|
||||
<path
|
||||
|
@ -115,7 +115,7 @@
|
|||
</g>
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="233.1,277.7 236.5,275.5 237.1,276.6 233.7,278.8 "
|
||||
points="236.5,275.5 237.1,276.6 233.7,278.8 233.1,277.7 "
|
||||
id="polygon3" />
|
||||
<g
|
||||
id="g4">
|
||||
|
@ -141,7 +141,7 @@
|
|||
id="line4" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="234.6,280.1 237.9,278 238.6,278.9 235.4,281.1 "
|
||||
points="237.9,278 238.6,278.9 235.4,281.1 234.6,280.1 "
|
||||
id="polygon4" />
|
||||
<line
|
||||
class="cls-7"
|
||||
|
@ -152,35 +152,35 @@
|
|||
id="line5" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="236.4,282.3 239.7,280.3 240.6,281.2 237.4,283.2 "
|
||||
points="239.7,280.3 240.6,281.2 237.4,283.2 236.4,282.3 "
|
||||
id="polygon5" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="238.7,284.3 242,282.5 243.1,283.2 239.9,285 "
|
||||
points="242,282.5 243.1,283.2 239.9,285 238.7,284.3 "
|
||||
id="polygon6" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="241.6,286.1 244.6,284.2 245.8,284.8 243.2,286.6 "
|
||||
points="244.6,284.2 245.8,284.8 243.2,286.6 241.6,286.1 "
|
||||
id="polygon7" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="245.7,287.3 248.1,285.7 249.4,286.1 247.4,287.7 "
|
||||
points="248.1,285.7 249.4,286.1 247.4,287.7 245.7,287.3 "
|
||||
id="polygon8" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="232,275 235.4,273 235.8,274.1 232.5,276.2 "
|
||||
points="235.4,273 235.8,274.1 232.5,276.2 232,275 "
|
||||
id="polygon9" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="231.5,271.8 234.6,270 234.8,271.2 231.8,273 "
|
||||
points="234.6,270 234.8,271.2 231.8,273 231.5,271.8 "
|
||||
id="polygon10" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="231.5,268.5 234.2,267 234.3,268.1 231.5,269.6 "
|
||||
points="234.2,267 234.3,268.1 231.5,269.6 231.5,268.5 "
|
||||
id="polygon11" />
|
||||
<polygon
|
||||
class="cls-11"
|
||||
points="232.6,264.3 234.5,263.3 234.4,264.3 232.3,265.4 "
|
||||
points="234.5,263.3 234.4,264.3 232.3,265.4 232.6,264.3 "
|
||||
id="polygon12" />
|
||||
<line
|
||||
class="cls-7"
|
||||
|
|
Before Width: | Height: | Size: 9.4 KiB After Width: | Height: | Size: 9.4 KiB |
|
@ -48,21 +48,17 @@ const ZapButton = React.forwardRef<HTMLButtonElement, IButton>((props, ref): JSX
|
|||
onClick={onClick}
|
||||
ref={ref}
|
||||
type={type}
|
||||
data-testid='button'
|
||||
>
|
||||
<div className={clsx(className, '!box-border flex h-full w-14 appearance-none flex-col place-content-center items-center rounded-xl border p-2 font-medium transition-all focus:outline-none focus:ring-2 focus:ring-offset-2 sm:w-20 sm:p-4', {
|
||||
className={clsx(className, '!box-border flex flex-1 appearance-none flex-col place-content-center items-center rounded-xl border p-2 font-medium transition-all focus:outline-none focus:ring-2 focus:ring-offset-2 sm:w-20 sm:p-4', {
|
||||
'select-none disabled:opacity-75 disabled:cursor-default': disabled,
|
||||
'bg-primary-500 hover:bg-primary-400 dark:hover:bg-primary-600 border-transparent focus:bg-primary-500 text-gray-100 focus:ring-primary-300': selected,
|
||||
'border border-solid bg-transparent border-gray-400 dark:border-gray-800 hover:border-primary-300 dark:hover:border-primary-700 focus:border-primary-500 text-gray-900 dark:text-gray-100 focus:ring-primary-500': !selected })}
|
||||
>
|
||||
<img className='w-16' src={icon} alt='' />
|
||||
<span className='text-base sm:text-2xl'>
|
||||
<p>
|
||||
{shortNumberFormat(amount)}
|
||||
</p>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
>
|
||||
<img className='w-full' src={icon} alt='' />
|
||||
<span className='text-base sm:text-2xl'>
|
||||
<p>
|
||||
{shortNumberFormat(amount)}
|
||||
</p>
|
||||
</span>
|
||||
</button>
|
||||
);
|
||||
|
||||
|
|
|
@ -83,7 +83,15 @@ const ZapPayRequestForm = ({ account, status, onClose }: IZapPayRequestForm) =>
|
|||
</Stack>
|
||||
|
||||
<div className='flex justify-center'>
|
||||
{ZAP_AMOUNTS.map((amount, i) => <ZapButton onClick={() => setZapAmount(amount)} className='m-0.5 sm:m-1' selected={zapAmount === amount} icon={ZAP_ICONS[i]} amount={amount} />)}
|
||||
{ZAP_AMOUNTS.map((amount, i) => (
|
||||
<ZapButton
|
||||
onClick={() => setZapAmount(amount)}
|
||||
className='m-0.5 sm:m-1'
|
||||
selected={zapAmount === amount}
|
||||
icon={ZAP_ICONS[i]}
|
||||
amount={amount}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<Stack space={2}>
|
||||
|
|