react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
278 lines (268 loc) • 8.25 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _propTypes = require("prop-types");
var _propTypes2 = _interopRequireDefault(_propTypes);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var UndrawDevices = function UndrawDevices(props) {
return _react2.default.createElement(
"svg",
{
style: { height: props.height, width: '100%' },
className: props.class,
id: "d2ec24bc-8034-4145-bbaa-ac0081ffc938",
"data-name": "Layer 1",
xmlnsXlink: "http://www.w3.org/1999/xlink",
viewBox: "0 0 814.27 615.44"
},
_react2.default.createElement(
"defs",
null,
_react2.default.createElement(
"linearGradient",
{
id: "5868a8ae-9641-4bfb-a3e0-87c9707ff455",
x1: 684.96,
y1: 708.77,
x2: 684.96,
y2: 685.5,
gradientTransform: "translate(0.36 -0.19)",
gradientUnits: "userSpaceOnUse"
},
_react2.default.createElement("stop", { offset: 0, stopColor: "gray", stopOpacity: 0.25 }),
_react2.default.createElement("stop", { offset: 0.54, stopColor: "gray", stopOpacity: 0.12 }),
_react2.default.createElement("stop", { offset: 1, stopColor: "gray", stopOpacity: 0.1 })
),
_react2.default.createElement("linearGradient", {
id: "2dc439d3-206c-40ba-88b3-0b09748d0dcc",
x1: 685.09,
y1: 578.57,
x2: 685.09,
y2: 157.81,
gradientTransform: "matrix(1, 0, 0, 1.04, -0.63, -19.87)",
xlinkHref: "#5868a8ae-9641-4bfb-a3e0-87c9707ff455"
}),
_react2.default.createElement("linearGradient", {
id: "33b509d6-5684-4d10-a2d7-992d23792513",
x1: 439.04,
y1: 749.29,
x2: 439.04,
y2: 297.39,
gradientTransform: "matrix(1, 0, 0, 1.02, 0.11, -11.28)",
xlinkHref: "#5868a8ae-9641-4bfb-a3e0-87c9707ff455"
}),
_react2.default.createElement(
"linearGradient",
{
id: "c7762558-8ab5-4e43-8750-831a04cd0054",
x1: 439.56,
y1: 710.94,
x2: 439.56,
y2: 331.91,
gradientTransform: "matrix(1, 0, 0, 1.02, 0.11, -11.28)",
gradientUnits: "userSpaceOnUse"
},
_react2.default.createElement("stop", { offset: 0, stopOpacity: 0.09 }),
_react2.default.createElement("stop", { offset: 0.55, stopOpacity: 0.07 }),
_react2.default.createElement("stop", { offset: 1, stopOpacity: 0.02 })
),
_react2.default.createElement("linearGradient", {
id: "fd9cbc55-269a-4233-8dd0-3aded2a6d9e7",
x1: 290.89,
y1: 757.14,
x2: 290.89,
y2: 406.12,
gradientTransform: "matrix(1, 0, 0, 1.02, 0.19, -12.23)",
xlinkHref: "#5868a8ae-9641-4bfb-a3e0-87c9707ff455"
})
),
_react2.default.createElement(
"title",
null,
"Devices"
),
_react2.default.createElement("path", {
d: "M765.64,538.41S781.71,648.5,875.73,685.08l-190.34.26-190.34.26c93.92-36.83,109.71-147,109.71-147Z",
transform: "translate(-192.86 -142.28)",
fill: "#e0e0e0"
}),
_react2.default.createElement("rect", {
x: 493.16,
y: 685.34,
width: 384.26,
height: 23.26,
transform: "translate(-193.82 -141.33) rotate(-0.08)",
fill: "url(#5868a8ae-9641-4bfb-a3e0-87c9707ff455)"
}),
_react2.default.createElement("rect", {
x: 495.07,
y: 685.34,
width: 380.67,
height: 17.94,
transform: "translate(-193.82 -141.33) rotate(-0.08)",
fill: "#f5f5f5"
}),
_react2.default.createElement("path", {
d: "M994.22,142.28l-619.08.85c-6.85,0-12.4,5.83-12.39,13l.48,361.19,0,12c0,27.44,21.33,49.66,47.55,49.62l548.93-.76c26.23,0,47.46-22.31,47.42-49.75l0-12-.48-361.19C1006.64,148.07,1001.07,142.27,994.22,142.28Z",
transform: "translate(-192.86 -142.28)",
fill: "url(#2dc439d3-206c-40ba-88b3-0b09748d0dcc)"
}),
_react2.default.createElement("path", {
d: "M381.51,153.13H988.35a10.75,10.75,0,0,1,10.75,10.75V509.16a0,0,0,0,1,0,0H370.75a0,0,0,0,1,0,0V163.88a10.75,10.75,0,0,1,10.75-10.75Z",
transform: "matrix(1, 0, 0, 1, -193.32, -141.33)",
fill: "#fff"
}),
_react2.default.createElement("path", {
d: "M958.26,567.51l-546,.75A41.15,41.15,0,0,1,371,527.17l0-17.57,628.35-.87,0,17.58A41.15,41.15,0,0,1,958.26,567.51Z",
transform: "translate(-192.86 -142.28)",
fill: "#f5f5f5"
}),
_react2.default.createElement("rect", {
x: 401.81,
y: 181.96,
width: 568.62,
height: 287.41,
transform: "translate(-193.31 -141.33) rotate(-0.08)",
fill: props.primaryColor
}),
_react2.default.createElement("rect", {
x: 291.13,
y: 290.71,
width: 296,
height: 458.84,
rx: 17.17,
ry: 17.17,
transform: "translate(-193.58 -141.67) rotate(-0.08)",
fill: "url(#33b509d6-5684-4d10-a2d7-992d23792513)"
}),
_react2.default.createElement("rect", {
x: 311.85,
y: 325.76,
width: 255.62,
height: 384.84,
transform: "translate(-193.58 -141.67) rotate(-0.08)",
fill: "url(#c7762558-8ab5-4e43-8750-831a04cd0054)"
}),
_react2.default.createElement("rect", {
x: 300.13,
y: 297.65,
width: 277.99,
height: 437.71,
rx: 17.17,
ry: 17.17,
transform: "translate(-193.57 -141.67) rotate(-0.08)",
fill: "#fff"
}),
_react2.default.createElement("rect", {
x: 319.59,
y: 331.09,
width: 240.06,
height: 367.12,
transform: "matrix(1, 0, 0, 1, -193.57, -141.67)",
fill: props.primaryColor
}),
_react2.default.createElement("ellipse", {
cx: 440.54,
cy: 716.44,
rx: 9.89,
ry: 10.13,
transform: "matrix(1, 0, 0, 1, -193.85, -141.67)",
fill: "#dbdbdb"
}),
_react2.default.createElement("ellipse", {
cx: 397.81,
cy: 315.27,
rx: 3.3,
ry: 3.38,
transform: "translate(-193.3 -141.73) rotate(-0.08)",
fill: "#dbdbdb"
}),
_react2.default.createElement("rect", {
x: 414.29,
y: 313.19,
width: 42.87,
height: 3.38,
rx: 1.43,
ry: 1.43,
transform: "translate(-193.3 -141.68) rotate(-0.08)",
fill: "#dbdbdb"
}),
_react2.default.createElement("rect", {
x: 193.08,
y: 400.71,
width: 195.96,
height: 356.89,
rx: 10,
ry: 10,
transform: "translate(-193.66 -141.88) rotate(-0.08)",
fill: "url(#fd9cbc55-269a-4233-8dd0-3aded2a6d9e7)"
}),
_react2.default.createElement("rect", {
x: 197.6,
y: 406.59,
width: 186.94,
height: 342.74,
rx: 10,
ry: 10,
transform: "translate(-193.66 -141.88) rotate(-0.08)",
fill: "#fff"
}),
_react2.default.createElement("rect", {
x: 218.69,
y: 430.82,
width: 144.73,
height: 278.92,
transform: "translate(-193.65 -141.88) rotate(-0.08)",
fill: props.primaryColor
}),
_react2.default.createElement("ellipse", {
cx: 291.26,
cy: 729.83,
rx: 11.54,
ry: 11.82,
transform: "matrix(1, 0, 0, 1, -193.87, -141.88)",
fill: "#dbdbdb"
}),
_react2.default.createElement("ellipse", {
cx: 268.93,
cy: 417.85,
rx: 2.31,
ry: 2.36,
transform: "translate(-193.44 -141.91) rotate(-0.08)",
fill: "#dbdbdb"
}),
_react2.default.createElement("rect", {
x: 279.31,
y: 416.03,
width: 35.77,
height: 3.55,
rx: 1.5,
ry: 1.5,
transform: "translate(-193.44 -141.87) rotate(-0.08)",
fill: "#dbdbdb"
})
);
};
UndrawDevices.propTypes = {
/**
* Hex color
*/
primaryColor: _propTypes2.default.string,
/**
* percentage
*/
height: _propTypes2.default.string,
/**
* custom class for svg
*/
class: _propTypes2.default.string
};
UndrawDevices.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
exports.default = UndrawDevices;