react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
277 lines (272 loc) • 9.07 kB
JavaScript
import React from "react";
import PropTypes from "prop-types";
const UndrawTransferFiles = props => (
<svg
style={{height:props.height, width:'100%'}}
className={props.class}
id="3805a6c0-1c3f-44ce-9879-1a685de3f73b"
data-name="Layer 1"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 873.05 765.75"
>
<defs>
<linearGradient
id="d0d4e702-b6bf-4a58-a95e-67b450ab79dc"
x1={710.94}
y1={765.75}
x2={710.94}
y2={317.76}
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="9f0abdc5-3bd0-4aab-9d4b-6d230677ecbd"
x1={681}
y1={749.66}
x2={681}
y2={301.67}
xlinkHref="#d0d4e702-b6bf-4a58-a95e-67b450ab79dc"
/>
<linearGradient
id="84bc49d4-4cd7-4adf-8920-e999a76c3e59"
x1={652.84}
y1={734.91}
x2={652.84}
y2={286.93}
xlinkHref="#d0d4e702-b6bf-4a58-a95e-67b450ab79dc"
/>
<linearGradient
id="858ac885-2217-411c-97f3-2dab1ad32aaa"
x1={162.11}
y1={447.98}
x2={162.11}
y2={0}
xlinkHref="#d0d4e702-b6bf-4a58-a95e-67b450ab79dc"
/>
</defs>
<title>transfer files</title>
<g opacity={0.5}>
<rect
x={548.82}
y={317.76}
width={324.23}
height={447.98}
fill="url(#d0d4e702-b6bf-4a58-a95e-67b450ab79dc)"
/>
</g>
<rect x={552.95} y={321.06} width={315.98} height={438.08} fill="#fff" />
<g opacity={0.5}>
<rect
x={518.88}
y={301.67}
width={324.23}
height={447.98}
fill="url(#9f0abdc5-3bd0-4aab-9d4b-6d230677ecbd)"
/>
</g>
<rect x={523.01} y={304.97} width={315.98} height={438.08} fill="#f5f5f5" />
<g opacity={0.5}>
<rect
x={490.72}
y={286.93}
width={324.23}
height={447.98}
fill="url(#84bc49d4-4cd7-4adf-8920-e999a76c3e59)"
/>
</g>
<rect x={494.85} y={290.23} width={315.98} height={438.08} fill="#fff" />
<rect x={523.91} y={363.35} width={87.6} height={8.04} fill={props.primaryColor} />
<rect x={523.91} y={391.51} width={257.43} height={8.04} fill="#e0e0e0" />
<rect x={523.91} y={419.66} width={200.22} height={8.04} fill="#e0e0e0" />
<rect x={523.91} y={447.82} width={236.42} height={8.04} fill="#e0e0e0" />
<rect x={551.18} y={475.98} width={209.16} height={8.04} fill="#e0e0e0" />
<rect
x={571.29}
y={504.13}
width={164.92}
height={8.04}
fill="#3ad29f"
opacity={0.3}
/>
<rect x={551.18} y={532.29} width={205.14} height={8.04} fill="#e0e0e0" />
<rect x={523.91} y={560.44} width={257.43} height={8.04} fill="#e0e0e0" />
<rect x={523.91} y={588.6} width={257.43} height={8.04} fill="#e0e0e0" />
<rect x={523.91} y={616.76} width={257.43} height={8.04} fill="#e0e0e0" />
<rect x={523.91} y={644.91} width={257.43} height={8.04} fill="#e0e0e0" />
<g opacity={0.5}>
<rect
width={324.23}
height={447.98}
fill="url(#858ac885-2217-411c-97f3-2dab1ad32aaa)"
/>
</g>
<rect x={4.13} y={3.3} width={315.98} height={438.08} fill="#fff" />
<rect x={58.66} y={160.89} width={210.95} height={8.04} fill="#e0e0e0" />
<rect x={60.45} y={189.05} width={209.16} height={8.04} fill="#e0e0e0" />
<rect x={80.56} y={217.21} width={164.92} height={8.04} fill="#e0e0e0" />
<rect x={60.45} y={245.36} width={205.14} height={8.04} fill="#e0e0e0" />
<rect x={58.66} y={273.52} width={209.16} height={8.04} fill="#e0e0e0" />
<rect x={58.66} y={301.67} width={209.16} height={8.04} fill="#e0e0e0" />
<rect x={58.66} y={329.83} width={209.16} height={8.04} fill="#e0e0e0" />
<rect x={58.66} y={357.99} width={209.16} height={8.04} fill="#e0e0e0" />
<rect x={61.56} y={65.7} width={56.31} height={48.27} fill={props.primaryColor} />
<rect x={158.09} y={73.74} width={104.58} height={8.04} fill="#e0e0e0" />
<rect
x={158.09}
y={101.9}
width={104.58}
height={8.04}
fill="#3ad29f"
opacity={0.3}
/>
<g opacity={0.3}>
<line
x1={366.15}
y1={101.9}
x2={372.15}
y2={101.9}
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
/>
<line
x1={383.84}
y1={101.9}
x2={611.73}
y2={101.9}
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
strokeDasharray="11.69 11.69"
/>
<polyline
points="617.58 101.9 623.58 101.9 623.58 107.9"
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
/>
<line
x1={623.58}
y1={120.7}
x2={623.58}
y2={242.35}
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
strokeDasharray="12.8 12.8"
/>
<line
x1={623.58}
y1={248.75}
x2={623.58}
y2={254.75}
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
/>
</g>
<g opacity={0.3}>
<line
x1={458.66}
y1={636.87}
x2={452.66}
y2={636.87}
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
/>
<line
x1={440.97}
y1={636.87}
x2={213.08}
y2={636.87}
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
strokeDasharray="11.69 11.69"
/>
<polyline
points="207.23 636.87 201.23 636.87 201.23 630.87"
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
/>
<line
x1={201.23}
y1={618.06}
x2={201.23}
y2={496.42}
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
strokeDasharray="12.8 12.8"
/>
<line
x1={201.23}
y1={490.02}
x2={201.23}
y2={484.02}
fill="none"
stroke="#3ad29f"
strokeMiterlimit={10}
strokeWidth={3}
/>
</g>
<path
d="M677.42,233.27a3.67,3.67,0,0,1-2-4.44,1.77,1.77,0,0,0,.08-.41h0a1.84,1.84,0,0,0-3.31-1.22h0a1.77,1.77,0,0,0-.2.36,3.67,3.67,0,0,1-4.44,2,1.77,1.77,0,0,0-.41-.08h0a1.84,1.84,0,0,0-1.22,3.31h0a1.77,1.77,0,0,0,.36.2,3.67,3.67,0,0,1,2,4.44,1.77,1.77,0,0,0-.08.41h0a1.84,1.84,0,0,0,3.31,1.22h0a1.77,1.77,0,0,0,.2-.36,3.67,3.67,0,0,1,4.44-2,1.77,1.77,0,0,0,.41.08h0a1.84,1.84,0,0,0,1.22-3.31h0A1.77,1.77,0,0,0,677.42,233.27Z"
transform="translate(-163.47 -67.13)"
fill={props.primaryColor}
opacity={0.3}
/>
<path
d="M548.61,324.4A7.74,7.74,0,0,1,544.3,315a3.72,3.72,0,0,0,.17-.86h0a3.88,3.88,0,0,0-7-2.57h0a3.72,3.72,0,0,0-.43.76,7.74,7.74,0,0,1-9.36,4.31,3.72,3.72,0,0,0-.86-.17h0a3.88,3.88,0,0,0-2.57,7h0a3.72,3.72,0,0,0,.76.43,7.74,7.74,0,0,1,4.31,9.36,3.72,3.72,0,0,0-.17.86h0a3.88,3.88,0,0,0,7,2.57h0a3.72,3.72,0,0,0,.43-.76,7.74,7.74,0,0,1,9.36-4.31,3.72,3.72,0,0,0,.86.17h0a3.88,3.88,0,0,0,2.57-7h0A3.72,3.72,0,0,0,548.61,324.4Z"
transform="translate(-163.47 -67.13)"
fill={props.primaryColor}
opacity={0.3}
/>
<path
d="M627.62,586.6a7.74,7.74,0,0,1-8.9-5.19,3.72,3.72,0,0,0-.35-.8h0a3.88,3.88,0,0,0-7.19,1.89h0a3.72,3.72,0,0,0,.08.87,7.74,7.74,0,0,1-5.19,8.9,3.72,3.72,0,0,0-.8.35h0a3.88,3.88,0,0,0,1.89,7.19h0a3.72,3.72,0,0,0,.87-.08,7.74,7.74,0,0,1,8.9,5.19,3.72,3.72,0,0,0,.35.8h0a3.88,3.88,0,0,0,7.19-1.89h0a3.72,3.72,0,0,0-.08-.87,7.74,7.74,0,0,1,5.19-8.9,3.72,3.72,0,0,0,.8-.35h0a3.88,3.88,0,0,0-1.89-7.19h0A3.72,3.72,0,0,0,627.62,586.6Z"
transform="translate(-163.47 -67.13)"
fill={props.primaryColor}
opacity={0.3}
/>
<path
d="M469.42,638.27a3.67,3.67,0,0,1-2-4.44,1.77,1.77,0,0,0,.08-.41h0a1.84,1.84,0,0,0-3.31-1.22h0a1.77,1.77,0,0,0-.2.36,3.67,3.67,0,0,1-4.44,2,1.77,1.77,0,0,0-.41-.08h0a1.84,1.84,0,0,0-1.22,3.31h0a1.77,1.77,0,0,0,.36.2,3.67,3.67,0,0,1,2,4.44,1.77,1.77,0,0,0-.08.41h0a1.84,1.84,0,0,0,3.31,1.22h0a1.77,1.77,0,0,0,.2-.36,3.67,3.67,0,0,1,4.44-2,1.77,1.77,0,0,0,.41.08h0a1.84,1.84,0,0,0,1.22-3.31h0A1.77,1.77,0,0,0,469.42,638.27Z"
transform="translate(-163.47 -67.13)"
fill={props.primaryColor}
opacity={0.3}
/>
</svg>
);
UndrawTransferFiles.propTypes = {
/**
* Hex color
*/
primaryColor: PropTypes.string,
/**
* percentage
*/
height: PropTypes.string,
/**
* custom class for svg
*/
class: PropTypes.string
};
UndrawTransferFiles.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
export default UndrawTransferFiles;