react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
231 lines (226 loc) • 5.54 kB
JavaScript
import React from "react";
import PropTypes from "prop-types";
const UndrawDelivery = props => (
<svg
style={{height:props.height, width:'100%'}}
className={props.class}
id="a2be76dc-ded0-4276-979b-9321ffa4ea47"
data-name="Layer 1"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 896.26 886.06"
>
<defs>
<linearGradient
id="a2b2d1fc-0308-42ae-9fb3-5a28a5ecf355"
x1={654.31}
y1={787.12}
x2={654.31}
y2={483.17}
gradientUnits="userSpaceOnUse"
>
<stop offset={0} stopColor="gray" stopOpacity={0.25} />
<stop offset={0.54} stopColor="gray" stopOpacity={0.12} />
<stop offset={1} stopColor="gray" stopOpacity={0.1} />
</linearGradient>
<linearGradient
id="d3ada255-7071-4392-8697-9e7bf8640a14"
x1={310.24}
y1={813.28}
x2={310.24}
y2={53.35}
xlinkHref="#a2b2d1fc-0308-42ae-9fb3-5a28a5ecf355"
/>
<clipPath
id="ad42cf0d-12b9-4ed3-b81e-3fe00c5fae65"
transform="translate(-103.74 -16.68)"
>
<rect
id="a4571f71-7401-4714-9f7d-472da655db57"
data-name="<Rectangle>"
x={256.61}
y={133.55}
width={312.75}
height={588.49}
fill={props.primaryColor}
/>
</clipPath>
<linearGradient
id="ccece478-ff56-431e-aa3f-34a39bd33814"
x1={413.1}
y1={523.43}
x2={413.1}
y2={308.51}
gradientUnits="userSpaceOnUse"
>
<stop offset={0} stopOpacity={0.12} />
<stop offset={0.55} stopOpacity={0.09} />
<stop offset={1} stopOpacity={0.02} />
</linearGradient>
<linearGradient
id="3dafc59e-19bf-4cbd-8b3f-7488466527c3"
x1={309.36}
y1={376.83}
x2={309.36}
y2={335.13}
xlinkHref="#ccece478-ff56-431e-aa3f-34a39bd33814"
/>
</defs>
<title>mail1</title>
<rect
x={412.36}
y={483.17}
width={483.89}
height={303.95}
fill="url(#a2b2d1fc-0308-42ae-9fb3-5a28a5ecf355)"
/>
<rect x={412.36} y={490.73} width={477.81} height={283.67} fill="#fff" />
<g opacity={0.6}>
<rect x={808.72} y={512.34} width={60.79} height={44.98} fill={props.primaryColor} />
<rect
x={586.23}
y={630.28}
width={233.43}
height={14.59}
fill={props.primaryColor}
/>
<rect x={586.23} y={666.75} width={170.21} height={9.73} fill={props.primaryColor} />
</g>
<rect
x={96.26}
y={53.35}
width={427.96}
height={759.94}
rx={10}
ry={10}
fill="url(#d3ada255-7071-4392-8697-9e7bf8640a14)"
/>
<rect
x={107.25}
y={65.74}
width={403.97}
height={723.15}
rx={10}
ry={10}
fill="#fff"
/>
<rect
id="c7b02336-9701-4e2a-9a3b-1f471733f396"
data-name="<Rectangle>"
x={152.86}
y={116.86}
width={312.75}
height={588.49}
fill={props.primaryColor}
/>
<g clipPath="url(#ad42cf0d-12b9-4ed3-b81e-3fe00c5fae65)">
<line
x1={28.17}
y1={477.63}
x2={652.82}
y2={176.11}
fill="#2196f3"
stroke="#fff"
strokeMiterlimit={10}
strokeWidth={7}
/>
<line
x1={195.68}
y1={2.11}
x2={414.35}
y2={291.22}
fill="#2196f3"
stroke="#fff"
strokeMiterlimit={10}
strokeWidth={7}
/>
<line
x1={15.2}
y1={105.86}
x2={241.32}
y2={374.74}
fill="#2196f3"
stroke="#fff"
strokeMiterlimit={10}
strokeWidth={7}
/>
<line
x1={176.63}
y1={405.97}
x2={530.7}
y2={883.98}
fill="#2196f3"
stroke="#fff"
strokeMiterlimit={10}
strokeWidth={7}
/>
<line
x1={2.23}
y1={813.73}
x2={297.46}
y2={569.09}
fill="#2196f3"
stroke="#fff"
strokeMiterlimit={10}
strokeWidth={7}
/>
<line
x1={575.01}
y1={433.32}
x2={353.05}
y2={644.14}
fill="#2196f3"
stroke="#fff"
strokeMiterlimit={10}
strokeWidth={7}
/>
</g>
<circle cx={309.24} cy={747.75} r={24.94} fill="#dbdbdb" />
<circle cx={261.86} cy={89.43} r={4.99} fill="#dbdbdb" />
<rect
x={284.3}
y={85.69}
width={77.3}
height={7.48}
rx={1.5}
ry={1.5}
fill="#dbdbdb"
/>
<path
d="M482.07,377.47c0,38.09-69,146-69,146s-69-107.86-69-146a69,69,0,1,1,137.93,0Z"
transform="translate(-103.74 -16.68)"
fill="url(#ccece478-ff56-431e-aa3f-34a39bd33814)"
/>
<circle
cx={309.36}
cy={355.98}
r={20.85}
fill="url(#3dafc59e-19bf-4cbd-8b3f-7488466527c3)"
/>
<path
d="M466.85,386c0,29.68-53.75,113.74-53.75,113.74S359.35,415.65,359.35,386a53.75,53.75,0,1,1,107.49,0Z"
transform="translate(-103.74 -16.68)"
fill="#ff5252"
/>
<circle cx={309.36} cy={365.54} r={16.25} fill="#fff" />
</svg>
);
UndrawDelivery.propTypes = {
/**
* Hex color
*/
primaryColor: PropTypes.string,
/**
* percentage
*/
height: PropTypes.string,
/**
* custom class for svg
*/
class: PropTypes.string
};
UndrawDelivery.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
export default UndrawDelivery;