react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
191 lines (186 loc) • 6.46 kB
JavaScript
import React from "react";
import PropTypes from "prop-types";
const UndrawResume = props => (
<svg
style={{height:props.height, width:'100%'}}
className={props.class}
id="1c549851-e1f5-47c2-9f19-cda9fc007f23"
data-name="Layer 1"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 742 751"
>
<defs>
<linearGradient
id="293c43c5-f5dc-4f36-9ea4-ed10593f05c6"
x1={294.5}
y1={751}
x2={294.5}
y2={73}
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="41fd0ec7-182b-4282-83b7-ab7a020e918b"
x1={295.5}
y1={394}
x2={295.5}
y2={175}
xlinkHref="#293c43c5-f5dc-4f36-9ea4-ed10593f05c6"
/>
<linearGradient
id="f8c73f52-cb57-4dfb-aa28-3dc50b136682"
x1={472}
y1={709}
x2={472}
y2={0.67}
xlinkHref="#293c43c5-f5dc-4f36-9ea4-ed10593f05c6"
/>
<linearGradient
id="f7f8622f-4980-4731-9af3-3a9e922a0253"
x1={472}
y1={269.98}
x2={472}
gradientUnits="userSpaceOnUse"
>
<stop offset={0} stopColor="#b3b3b3" stopOpacity={0.25} />
<stop offset={0.54} stopColor="#b3b3b3" stopOpacity={0.1} />
<stop offset={1} stopColor="#b3b3b3" stopOpacity={0.05} />
</linearGradient>
<linearGradient
id="b4700321-3280-4bc3-a158-9252876dd1e5"
x1={713.21}
y1={420.46}
x2={718.93}
y2={557.24}
gradientTransform="matrix(-1, 0.01, -0.01, -1, 1253.94, 688.13)"
gradientUnits="userSpaceOnUse"
>
<stop offset={0} stopOpacity={0.12} />
<stop offset={0.55} stopOpacity={0.09} />
<stop offset={1} stopOpacity={0.02} />
</linearGradient>
</defs>
<title>resume</title>
<rect
x={19}
y={73}
width={551}
height={678}
fill="url(#293c43c5-f5dc-4f36-9ea4-ed10593f05c6)"
/>
<rect x={26.6} y={80.56} width={535.57} height={658.44} fill="#f5f5f5" />
<rect x={26.6} y={80} width={535.57} height={81.73} fill={props.primaryColor} />
<rect x={40.79} y={89.21} width={43.19} height={10.36} fill="#fff" />
<rect x={40.79} y={108.78} width={43.19} height={10.36} fill="#fff" />
<rect x={40.79} y={128.35} width={43.19} height={10.36} fill="#fff" />
<rect
y={175}
width={591}
height={219}
fill="url(#41fd0ec7-182b-4282-83b7-ab7a020e918b)"
/>
<rect x={5} y={182.46} width={578.76} height={204.34} fill="#fff" />
<rect x={129.02} y={258.72} width={145.61} height={10.36} fill="#bdbdbd" />
<rect x={129.02} y={300.17} width={145.61} height={10.36} fill="#69f0ae" />
<rect x={129.02} y={279.44} width={420.8} height={10.36} fill="#e0e0e0" />
<ellipse cx={66.7} cy={284.62} rx={25.91} ry={24.18} fill="#69f0ae" />
<rect
x={202.62}
y={0.67}
width={538.76}
height={708.33}
fill="url(#f8c73f52-cb57-4dfb-aa28-3dc50b136682)"
/>
<rect
x={202}
width={540}
height={269.98}
fill="url(#f7f8622f-4980-4731-9af3-3a9e922a0253)"
/>
<rect x={209.52} y={6.15} width={524.97} height={691.85} fill="#fff" />
<rect x={208.91} y={5.5} width={526.18} height={263.69} fill={props.primaryColor} />
<rect x={319.59} y={343.59} width={142.73} height={10.89} fill="#bdbdbd" />
<rect x={319.59} y={387.13} width={142.73} height={10.89} fill="#f5f5f5" />
<rect x={319.59} y={365.36} width={372.56} height={10.89} fill="#69f0ae" />
<rect x={415.15} y={104.08} width={142.73} height={10.89} fill="#fff" />
<rect x={415.15} y={128.28} width={229.83} height={10.89} fill="#fff" />
<rect
x={458.69}
y={159.72}
width={142.73}
height={12.1}
rx={5}
ry={5}
opacity={0.2}
/>
<circle cx={258.5} cy={356.29} r={25.4} fill="#69f0ae" />
<rect x={319.59} y={448.82} width={142.73} height={10.89} fill="#bdbdbd" />
<rect x={319.59} y={492.37} width={142.73} height={10.89} fill="#f5f5f5" />
<rect x={319.59} y={470.59} width={372.56} height={10.89} fill="#e0e0e0" />
<circle cx={258.5} cy={461.52} r={25.4} fill="#e0e0e0" />
<rect x={319.59} y={554.06} width={142.73} height={10.89} fill="#bdbdbd" />
<rect x={319.59} y={597.6} width={142.73} height={10.89} fill="#f5f5f5" />
<rect x={319.59} y={575.83} width={372.56} height={10.89} fill="#e0e0e0" />
<circle cx={258.5} cy={566.76} r={25.4} fill="#e0e0e0" />
<path
d="M461.9,207.23a70,70,0,1,0,93-67l.22,18a23.79,23.79,0,0,1-23.43,24h0a23.79,23.79,0,0,1-24-23.43l-.22-18A70.07,70.07,0,0,0,461.9,207.23Z"
transform="translate(-229 -74.5)"
fill="url(#b4700321-3280-4bc3-a158-9252876dd1e5)"
/>
<path
d="M602,199.86a70,70,0,1,0-93.76,65.92v-18A23.79,23.79,0,0,1,532,224h0a23.79,23.79,0,0,1,23.72,23.72v18A70.07,70.07,0,0,0,602,199.86Z"
transform="translate(-229 -74.5)"
fill={props.primaryColor}
/>
<circle
cx={303}
cy={115.73}
r={26.92}
fill="#fff"
stroke="#fff"
strokeMiterlimit={10}
/>
<path
d="M532,224h0a23.79,23.79,0,0,0-23.72,23.72v18a70.3,70.3,0,0,0,47.43,0v-18A23.79,23.79,0,0,0,532,224Z"
transform="translate(-229 -74.5)"
fill="#fff"
stroke="#fff"
strokeMiterlimit={10}
/>
<path
d="M504.85,188.74A26.12,26.12,0,0,1,502,175.19a18.11,18.11,0,0,1,6-12.28c3.92-3.34,9.24-4.53,14.38-4.94s10.34-.16,15.4-1.16a32.19,32.19,0,0,0,20.56-13.94c.32,4,.65,8-.11,11.85s-2.76,7.71-6.14,9.79c4.09-1.89,3.64,2.54,2.76,5.2,2,2.45,7,2.85,7.2,6a19.92,19.92,0,0,1-1,9.36c-1.24,2.92.09,8.07-3.07,8.29"
transform="translate(-229 -74.5)"
fill="#fff"
stroke="#fff"
strokeMiterlimit={10}
/>
<path
d="M553.51,163.87s18.79,1.64,5.41,29.52"
transform="translate(-229 -74.5)"
fill="#fff"
/>
</svg>
);
UndrawResume.propTypes = {
/**
* Hex color
*/
primaryColor: PropTypes.string,
/**
* percentage
*/
height: PropTypes.string,
/**
* custom class for svg
*/
class: PropTypes.string
};
UndrawResume.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
export default UndrawResume;