react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
256 lines (251 loc) • 7.26 kB
JavaScript
import React from "react";
import PropTypes from "prop-types";
const UndrawJobHunt = props => (
<svg
style={{height:props.height, width:'100%'}}
className={props.class}
id="d7f71427-0607-457b-a0aa-ebababd178b2"
data-name="Layer 1"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 895 767"
>
<defs>
<linearGradient
id="57e2f2ca-001c-4ef7-8bab-009a8b31d497"
x1={127.5}
y1={767}
x2={127.5}
y2={522}
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="0ddd3d69-b685-4f06-a899-3f61a943b7a1"
x1={280}
y1={694.5}
x2={280}
y2={623.5}
xlinkHref="#57e2f2ca-001c-4ef7-8bab-009a8b31d497"
/>
<linearGradient
id="d382657b-a62a-4621-ad28-05504ca41006"
x1={447}
x2={447}
y2={515}
xlinkHref="#57e2f2ca-001c-4ef7-8bab-009a8b31d497"
/>
<linearGradient
id="3ea3cc15-fbba-466d-ad08-cdb215922834"
x1={600}
y1={694.5}
x2={600}
y2={623.5}
xlinkHref="#57e2f2ca-001c-4ef7-8bab-009a8b31d497"
/>
<linearGradient
id="af2e7206-9e18-4e25-834e-9a20608b0291"
x1={767.5}
x2={767.5}
y2={524}
xlinkHref="#57e2f2ca-001c-4ef7-8bab-009a8b31d497"
/>
<linearGradient
id="fcb2f323-5044-42b0-9142-ccd93c9a6812"
x1={920}
y1={694.5}
x2={920}
y2={623.5}
xlinkHref="#57e2f2ca-001c-4ef7-8bab-009a8b31d497"
/>
<linearGradient
id="a1df6d83-942b-4ca0-8fd3-673791ff34e1"
x1={463}
y1={595}
x2={463}
y2={0}
xlinkHref="#57e2f2ca-001c-4ef7-8bab-009a8b31d497"
/>
<linearGradient
id="afb0f4e8-7f55-4367-a17b-b611621521ed"
x1={617.89}
y1={237.7}
x2={617.89}
y2={152.7}
xlinkHref="#57e2f2ca-001c-4ef7-8bab-009a8b31d497"
/>
<linearGradient
id="8a0b148b-d5f2-4b72-b316-6607a85c69d8"
x1={218}
y1={194}
x2={218}
y2={98}
xlinkHref="#57e2f2ca-001c-4ef7-8bab-009a8b31d497"
/>
</defs>
<title>job hunt</title>
<rect
y={522}
width={255}
height={245}
fill="url(#57e2f2ca-001c-4ef7-8bab-009a8b31d497)"
/>
<rect x={4} y={528} width={247} height={234} fill="#f5f5f5" />
<g opacity={0.5}>
<path
d="M301.85,635.52v-12H258.15v12H227.57v59H332.43v-59Zm-38.23-7.65h32.77v7.65H263.62Z"
transform="translate(-152.5 -66.5)"
fill="url(#0ddd3d69-b685-4f06-a899-3f61a943b7a1)"
/>
</g>
<rect
x={79.5}
y={571}
width={96}
height={54}
fill={props.primaryColor}
opacity={0.6}
/>
<polygon
points="107.5 560 107.5 574 112.5 574 112.5 564 142.5 564 142.5 574 147.5 574 147.5 560 107.5 560"
fill={props.primaryColor}
opacity={0.6}
/>
<g opacity={0.6}>
<rect x={85} y={667} width={89} height={12} fill={props.primaryColor} />
</g>
<rect x={51.5} y={689} width={152} height={12} fill="#bdbdbd" />
<rect
x={320}
y={515}
width={254}
height={252}
fill="url(#d382657b-a62a-4621-ad28-05504ca41006)"
/>
<rect x={324} y={528} width={247} height={234} fill="#f5f5f5" />
<g opacity={0.5}>
<path
d="M621.85,635.52v-12H578.15v12H547.57v59H652.43v-59Zm-38.23-7.65h32.77v7.65H583.62Z"
transform="translate(-152.5 -66.5)"
fill="url(#3ea3cc15-fbba-466d-ad08-cdb215922834)"
/>
</g>
<rect
x={399.5}
y={571}
width={96}
height={54}
fill={props.primaryColor}
opacity={0.6}
/>
<polygon
points="427.5 560 427.5 574 432.5 574 432.5 564 462.5 564 462.5 574 467.5 574 467.5 560 427.5 560"
fill={props.primaryColor}
/>
<g opacity={0.6}>
<rect x={405} y={667} width={89} height={12} fill={props.primaryColor} />
</g>
<rect x={371.5} y={689} width={152} height={12} fill="#bdbdbd" />
<rect
x={640}
y={524}
width={255}
height={243}
fill="url(#af2e7206-9e18-4e25-834e-9a20608b0291)"
/>
<rect x={644} y={528} width={247} height={234} fill="#f5f5f5" />
<g opacity={0.5}>
<path
d="M941.85,635.52v-12H898.15v12H867.57v59H972.43v-59Zm-38.23-7.65h32.77v7.65H903.62Z"
transform="translate(-152.5 -66.5)"
fill="url(#fcb2f323-5044-42b0-9142-ccd93c9a6812)"
/>
</g>
<rect
x={719.5}
y={571}
width={96}
height={54}
fill={props.primaryColor}
opacity={0.6}
/>
<polygon
points="747.5 560 747.5 574 752.5 574 752.5 564 782.5 564 782.5 574 787.5 574 787.5 560 747.5 560"
fill={props.primaryColor}
opacity={0.6}
/>
<g opacity={0.6}>
<rect x={725} y={667} width={89} height={12} fill={props.primaryColor} />
</g>
<rect x={691.5} y={689} width={152} height={12} fill="#bdbdbd" />
<g opacity={0.5}>
<rect
x={209.8}
width={506.41}
height={595}
fill="url(#a1df6d83-942b-4ca0-8fd3-673791ff34e1)"
/>
</g>
<rect x={225.36} y={9.58} width={480.07} height={572.25} fill="#fff" />
<g opacity={0.5}>
<path
d="M644,167.08V152.7H591.74v14.38H555.13V237.7H680.66V167.08Zm-45.77-9.15h39.23v9.15H598.28Z"
transform="translate(-152.5 -66.5)"
fill="url(#afb0f4e8-7f55-4367-a17b-b611621521ed)"
/>
</g>
<rect x={407.93} y={102.96} width={114.93} height={64.65} fill={props.primaryColor} />
<polygon
points="441.45 89.79 441.45 106.55 447.44 106.55 447.44 94.58 483.35 94.58 483.35 106.55 489.34 106.55 489.34 89.79 441.45 89.79"
fill={props.primaryColor}
/>
<rect x={297.19} y={260.65} width={337.61} height={14.37} fill="#e0e0e0" />
<rect x={297.19} y={355.23} width={337.61} height={14.37} fill="#e0e0e0" />
<rect x={297.19} y={380.37} width={337.61} height={14.37} fill="#e0e0e0" />
<rect x={297.19} y={330.08} width={142.46} height={14.37} fill="#e0e0e0" />
<rect
x={528.25}
y={330.08}
width={106.55}
height={14.37}
fill="#3ad29f"
opacity={0.6}
/>
<rect x={415.71} y={439.03} width={106.55} height={14.37} fill={props.primaryColor} />
<g opacity={0.5}>
<circle
cx={218}
cy={146}
r={48}
fill="url(#8a0b148b-d5f2-4b72-b316-6607a85c69d8)"
/>
</g>
<circle cx={218} cy={146} r={45.18} fill="#69f0ae" />
<polygon
points="199.06 139.18 216 154.71 240 119.41 248.47 126.47 216 168.82 192 142 199.06 139.18"
fill="#fff"
/>
</svg>
);
UndrawJobHunt.propTypes = {
/**
* Hex color
*/
primaryColor: PropTypes.string,
/**
* percentage
*/
height: PropTypes.string,
/**
* custom class for svg
*/
class: PropTypes.string
};
UndrawJobHunt.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
export default UndrawJobHunt;