react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
290 lines (280 loc) • 9.28 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 UndrawContrast = function UndrawContrast(props) {
return _react2.default.createElement(
"svg",
{
style: { height: props.height, width: '100%' },
className: props.class,
id: "c9ac9d6c-7cdc-4c94-8232-f936da68e97d",
"data-name": "Layer 1",
xmlnsXlink: "http://www.w3.org/1999/xlink",
viewBox: "0 0 912.5 703.5"
},
_react2.default.createElement(
"defs",
null,
_react2.default.createElement(
"linearGradient",
{
id: "a1217de1-da1b-4bbe-8b6b-df359b856d80",
x1: 424.5,
y1: 675,
x2: 424.5,
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: "50b3c8bc-dd0e-4375-8727-34e41ad39fa8",
x1: 191.5,
y1: 281,
x2: 191.5,
y2: 256,
xlinkHref: "#a1217de1-da1b-4bbe-8b6b-df359b856d80"
}),
_react2.default.createElement(
"linearGradient",
{
id: "dfaf505b-dd53-4c52-bb27-3f20233ae8bb",
x1: 627.5,
y1: 281,
x2: 627.5,
y2: 256,
gradientUnits: "userSpaceOnUse"
},
_react2.default.createElement("stop", { offset: 0, stopOpacity: 0.12 }),
_react2.default.createElement("stop", { offset: 0.55, stopOpacity: 0.09 }),
_react2.default.createElement("stop", { offset: 1, stopOpacity: 0.02 })
),
_react2.default.createElement("linearGradient", {
id: "99ed4748-145a-4422-a012-b3270fb87fdc",
x1: 198,
y1: 328,
x2: 198,
y2: 312,
xlinkHref: "#a1217de1-da1b-4bbe-8b6b-df359b856d80"
}),
_react2.default.createElement("linearGradient", {
id: "69284a17-3a7e-4461-bc9d-ec72dd0f9019",
x1: 634,
y1: 328,
x2: 634,
y2: 312,
xlinkHref: "#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"
}),
_react2.default.createElement("linearGradient", {
id: "d24cd686-1bb3-48c3-bb03-45084e2445d7",
x1: 634,
y1: 353,
x2: 634,
y2: 337,
xlinkHref: "#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"
}),
_react2.default.createElement("linearGradient", {
id: "0a34c182-11cb-46d2-9bee-306516ed3b5b",
x1: 634,
y1: 378,
x2: 634,
y2: 362,
xlinkHref: "#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"
}),
_react2.default.createElement("linearGradient", {
id: "34f95aaf-f4ca-4e12-941d-7adca9e033d3",
x1: 634,
y1: 403,
x2: 634,
y2: 387,
xlinkHref: "#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"
}),
_react2.default.createElement("linearGradient", {
id: "17dbb2a6-67e8-413e-95fb-50e0c7aab595",
x1: 634,
y1: 428,
x2: 634,
y2: 412,
xlinkHref: "#dfaf505b-dd53-4c52-bb27-3f20233ae8bb"
}),
_react2.default.createElement("linearGradient", {
id: "50b6b42e-ba1d-4234-9b3e-ec3a0df448c2",
x1: 198,
y1: 353,
x2: 198,
y2: 337,
xlinkHref: "#a1217de1-da1b-4bbe-8b6b-df359b856d80"
}),
_react2.default.createElement("linearGradient", {
id: "a1fc3972-393a-4ce3-8d80-f122a3c0b7bb",
x1: 198,
y1: 378,
x2: 198,
y2: 362,
xlinkHref: "#a1217de1-da1b-4bbe-8b6b-df359b856d80"
}),
_react2.default.createElement("linearGradient", {
id: "194d01da-8667-4b3e-85ff-e74ede087b08",
x1: 198,
y1: 403,
x2: 198,
y2: 387,
xlinkHref: "#a1217de1-da1b-4bbe-8b6b-df359b856d80"
}),
_react2.default.createElement("linearGradient", {
id: "4ae13924-7169-46dd-a41b-c9ba3b889a05",
x1: 198,
y1: 428,
x2: 198,
y2: 412,
xlinkHref: "#a1217de1-da1b-4bbe-8b6b-df359b856d80"
})
),
_react2.default.createElement(
"title",
null,
"contrast"
),
_react2.default.createElement("rect", {
x: 66.5,
y: 79.5,
width: 846,
height: 624,
fill: props.primaryColor,
opacity: 0.2
}),
_react2.default.createElement("polygon", {
points: "0 0 0 34.06 0 675 849 675 849 34.06 849 0 0 0",
fill: "url(#a1217de1-da1b-4bbe-8b6b-df359b856d80)"
}),
_react2.default.createElement("rect", { x: 12, y: 42, width: 828, height: 621, fill: "#fff" }),
_react2.default.createElement("rect", { x: 12, y: 9, width: 828, height: 33, fill: "#f5f5f5" }),
_react2.default.createElement("circle", { cx: 36, cy: 25, r: 8, fill: "#ff5252" }),
_react2.default.createElement("circle", { cx: 58, cy: 25, r: 8, fill: "#ff0" }),
_react2.default.createElement("circle", { cx: 80, cy: 25, r: 8, fill: "#69f0ae" }),
_react2.default.createElement("rect", { x: 426, y: 42, width: 414, height: 621, fill: props.primaryColor }),
_react2.default.createElement("rect", {
x: 78,
y: 256,
width: 227,
height: 25,
fill: "url(#50b3c8bc-dd0e-4375-8727-34e41ad39fa8)"
}),
_react2.default.createElement("rect", {
x: 514,
y: 256,
width: 227,
height: 25,
fill: "url(#dfaf505b-dd53-4c52-bb27-3f20233ae8bb)"
}),
_react2.default.createElement("rect", { x: 82, y: 259, width: 220, height: 18, fill: props.primaryColor }),
_react2.default.createElement("rect", {
x: 47,
y: 312,
width: 302,
height: 16,
fill: "url(#99ed4748-145a-4422-a012-b3270fb87fdc)"
}),
_react2.default.createElement("rect", {
x: 483,
y: 312,
width: 302,
height: 16,
fill: "url(#69284a17-3a7e-4461-bc9d-ec72dd0f9019)"
}),
_react2.default.createElement("rect", {
x: 483,
y: 337,
width: 302,
height: 16,
fill: "url(#d24cd686-1bb3-48c3-bb03-45084e2445d7)"
}),
_react2.default.createElement("rect", {
x: 483,
y: 362,
width: 302,
height: 16,
fill: "url(#0a34c182-11cb-46d2-9bee-306516ed3b5b)"
}),
_react2.default.createElement("rect", {
x: 483,
y: 387,
width: 302,
height: 16,
fill: "url(#34f95aaf-f4ca-4e12-941d-7adca9e033d3)"
}),
_react2.default.createElement("rect", {
x: 483,
y: 412,
width: 302,
height: 16,
fill: "url(#17dbb2a6-67e8-413e-95fb-50e0c7aab595)"
}),
_react2.default.createElement("rect", {
x: 47,
y: 337,
width: 302,
height: 16,
fill: "url(#50b6b42e-ba1d-4234-9b3e-ec3a0df448c2)"
}),
_react2.default.createElement("rect", {
x: 47,
y: 362,
width: 302,
height: 16,
fill: "url(#a1fc3972-393a-4ce3-8d80-f122a3c0b7bb)"
}),
_react2.default.createElement("rect", {
x: 47,
y: 387,
width: 302,
height: 16,
fill: "url(#194d01da-8667-4b3e-85ff-e74ede087b08)"
}),
_react2.default.createElement("rect", {
x: 47,
y: 412,
width: 302,
height: 16,
fill: "url(#4ae13924-7169-46dd-a41b-c9ba3b889a05)"
}),
_react2.default.createElement("rect", { x: 50, y: 314, width: 297, height: 11, fill: props.primaryColor }),
_react2.default.createElement("rect", { x: 50, y: 339, width: 297, height: 11, fill: props.primaryColor }),
_react2.default.createElement("rect", { x: 50, y: 364, width: 297, height: 11, fill: props.primaryColor }),
_react2.default.createElement("rect", { x: 50, y: 389, width: 297, height: 11, fill: props.primaryColor }),
_react2.default.createElement("rect", { x: 50, y: 414, width: 297, height: 11, fill: props.primaryColor }),
_react2.default.createElement("rect", { x: 517, y: 259, width: 220, height: 18, fill: "#fff" }),
_react2.default.createElement("rect", { x: 485, y: 314, width: 297, height: 11, fill: "#fff" }),
_react2.default.createElement("rect", { x: 485, y: 339, width: 297, height: 11, fill: "#fff" }),
_react2.default.createElement("rect", { x: 485, y: 364, width: 297, height: 11, fill: "#fff" }),
_react2.default.createElement("rect", { x: 485, y: 389, width: 297, height: 11, fill: "#fff" }),
_react2.default.createElement("rect", { x: 485, y: 414, width: 297, height: 11, fill: "#fff" })
);
};
UndrawContrast.propTypes = {
/**
* Hex color
*/
primaryColor: _propTypes2.default.string,
/**
* percentage
*/
height: _propTypes2.default.string,
/**
* custom class for svg
*/
class: _propTypes2.default.string
};
UndrawContrast.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
exports.default = UndrawContrast;