react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
264 lines (254 loc) • 12.3 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 UndrawNotes = function UndrawNotes(props) {
return _react2.default.createElement(
"svg",
{
style: { height: props.height, width: '100%' },
className: props.class,
id: "ef4d1e10-640d-406d-ab29-0014e28ba91d",
"data-name": "Layer 1",
xmlnsXlink: "http://www.w3.org/1999/xlink",
viewBox: "0 0 910.74 527.39"
},
_react2.default.createElement(
"defs",
null,
_react2.default.createElement(
"linearGradient",
{
id: "5b26331d-1310-4294-a782-4ee218ce8a93",
x1: 209.98,
y1: 290.83,
x2: 209.98,
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: "1766677a-11bf-41c4-a6a5-863d2cac0045",
x1: 356.48,
y1: 409.11,
x2: 356.48,
y2: 118.28,
xlinkHref: "#5b26331d-1310-4294-a782-4ee218ce8a93"
}),
_react2.default.createElement("linearGradient", {
id: "aae5fb14-dd79-43d0-b7e4-6e2579fdfd08",
x1: 502.98,
y1: 527.39,
x2: 502.98,
y2: 236.57,
xlinkHref: "#5b26331d-1310-4294-a782-4ee218ce8a93"
}),
_react2.default.createElement("linearGradient", {
id: "66874382-e7df-403e-944e-b16abddffc78",
x1: 912.16,
y1: 688.94,
x2: 912.16,
y2: 281.8,
xlinkHref: "#5b26331d-1310-4294-a782-4ee218ce8a93"
})
),
_react2.default.createElement(
"title",
null,
"notes1"
),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", {
width: 419.96,
height: 290.83,
fill: "url(#5b26331d-1310-4294-a782-4ee218ce8a93)"
})
),
_react2.default.createElement("rect", { x: 4.34, y: 4.34, width: 412.36, height: 283.23, fill: "#f7f7f7" }),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("circle", { cx: 71.35, cy: 100.38, r: 7.6, fill: props.primaryColor }),
_react2.default.createElement("circle", { cx: 71.35, cy: 145.96, r: 7.6, fill: props.primaryColor }),
_react2.default.createElement("circle", { cx: 71.35, cy: 191.53, r: 7.6, fill: props.primaryColor })
),
_react2.default.createElement("rect", { x: 127.24, y: 96.04, width: 230.06, height: 8.68, fill: "#e0e0e0" }),
_react2.default.createElement("rect", { x: 127.24, y: 141.61, width: 230.06, height: 8.68, fill: "#e0e0e0" }),
_react2.default.createElement("rect", { x: 127.24, y: 187.19, width: 230.06, height: 8.68, fill: "#e0e0e0" }),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", {
x: 146.5,
y: 118.28,
width: 419.96,
height: 290.83,
fill: "url(#1766677a-11bf-41c4-a6a5-863d2cac0045)"
})
),
_react2.default.createElement("rect", { x: 150.84, y: 122.62, width: 412.36, height: 283.23, fill: "#f7f7f7" }),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("circle", { cx: 217.85, cy: 218.66, r: 7.6, fill: props.primaryColor }),
_react2.default.createElement("circle", { cx: 217.85, cy: 264.24, r: 7.6, fill: props.primaryColor }),
_react2.default.createElement("circle", { cx: 217.85, cy: 309.82, r: 7.6, fill: props.primaryColor })
),
_react2.default.createElement("rect", { x: 273.73, y: 214.32, width: 230.06, height: 8.68, fill: "#e0e0e0" }),
_react2.default.createElement("rect", { x: 273.73, y: 259.9, width: 230.06, height: 8.68, fill: "#e0e0e0" }),
_react2.default.createElement("rect", { x: 273.73, y: 305.47, width: 230.06, height: 8.68, fill: "#e0e0e0" }),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("rect", {
x: 293,
y: 236.57,
width: 419.96,
height: 290.83,
fill: "url(#aae5fb14-dd79-43d0-b7e4-6e2579fdfd08)"
})
),
_react2.default.createElement("rect", { x: 297.34, y: 240.91, width: 412.36, height: 283.23, fill: "#eee" }),
_react2.default.createElement("circle", { cx: 364.35, cy: 336.94, r: 7.6, fill: props.primaryColor }),
_react2.default.createElement("circle", { cx: 364.35, cy: 382.52, r: 7.6, fill: props.primaryColor }),
_react2.default.createElement("circle", { cx: 364.35, cy: 428.1, r: 7.6, fill: props.primaryColor }),
_react2.default.createElement("rect", { x: 420.23, y: 332.6, width: 230.06, height: 8.68, fill: "#dfdfdf" }),
_react2.default.createElement("rect", { x: 420.23, y: 378.18, width: 230.06, height: 8.68, fill: "#dfdfdf" }),
_react2.default.createElement("rect", { x: 420.23, y: 423.76, width: 230.06, height: 8.68, fill: "#dfdfdf" }),
_react2.default.createElement(
"g",
{ opacity: 0.5 },
_react2.default.createElement("path", {
d: "M1046.74,419c-3-.19-6.09-2.26-6.39-5.24-.36-3.56,3-6.17,5.13-9.08,3.72-5.18,3.27-12.63-.09-18s-9.18-9-15.29-10.8c-5.07-1.51-11-2.35-14-6.77-4.74-7.18,2.59-16.19,3.22-24.77.6-8.17-6.16-16.18-14.32-17-4.72-.45-10.26,1-13.68-2.3a9.28,9.28,0,0,1-2.1-3.4c-2.2-5.71-1.17-12.07-.89-18.18s-.56-13-5.27-16.89c-2.72-2.27-6.32-3.16-9.81-3.73-10.59-1.73-21.44-1.14-32.06.42-14.79,2.17-30.21,6.77-40,18.06s-11.07,30.89.75,40c-1-.8-.56-2.57.87-4.69,0,.2,0,.39,0,.59a30,30,0,0,0,19.69,28.2v2.11a20.58,20.58,0,0,0-6.08,2.57C896.28,375.07,856,399.89,856,399.89l-59.15,10s-29,4.46-27.9,8.93,27.9,1.12,27.9,1.12h59.81a32.26,32.26,0,0,0,15.52-4l32.7-18c-.16,2.6-.24,5.28-.26,8-5.17,3.7-10.23,11.78.4,28.42l.08-.46c0,.15,0,.31,0,.46l-11.89,54.82c-3.62,2.68-6.1,5.15-5.24,6.47.5.76,1.84.9,3.67.65l-16.46,76L921.3,628l7.7,44.1-7.25,6.95-26.9,5a2.44,2.44,0,0,0,.45,4.84h58.94V677.78h.54l-1-13.34,18.63-12.18-6.11-9.34-.87.57L950.55,622.7,948,589.94,975.2,491.4h0v-.11h0l-6.68-27.49,11.71-5.94A17.17,17.17,0,0,0,988.7,437c-1.79-5.19-4-11.31-6.58-17.53a50,50,0,0,0,13.24,9.47c19.38,9.11,42.62.43,60-12.07C1052.61,418,1049.73,419.2,1046.74,419Zm-83.48,23.13-4.15-17.06,5.64,14.42C964,440.8,963.44,441.78,963.25,442.14Zm-23.16-74.44v-1.28a29.9,29.9,0,0,0,10.68-5,42.77,42.77,0,0,0,1.29,13.36C949.44,371.36,945.64,369,940.09,367.71ZM908.78,564.27l23.84-68.93L918,577.17Z",
transform: "translate(-144.63 -186.3)",
fill: "url(#66874382-e7df-403e-944e-b16abddffc78)"
})
),
_react2.default.createElement("path", {
d: "M964.78,638.57l-20.89,13.66-24.08,23.09a2.37,2.37,0,0,0-.34,3h0a2.37,2.37,0,0,0,3.28.69l48-31.36Z",
transform: "translate(-144.63 -186.3)",
fill: "#333"
}),
_react2.default.createElement("path", {
d: "M921.61,391.4l-48.29,26.51a31.36,31.36,0,0,1-15.09,3.87H800.07V412l57.51-9.77S922.7,362.1,927,375.12,921.61,391.4,921.61,391.4Z",
transform: "translate(-144.63 -186.3)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M973.48,491.24H893.33l12-55.34c0-30.12-6-65.89,24.13-65.89h0c30.12,0,26.87,20.58,26.87,50.69Z",
transform: "translate(-144.63 -186.3)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M777.61,162.68h17.08a0,0,0,0,1,0,0v23.67a7.87,7.87,0,0,1-7.87,7.87h-1.34a7.87,7.87,0,0,1-7.87-7.87V162.68A0,0,0,0,1,777.61,162.68Z",
fill: "#fda57d"
}),
_react2.default.createElement("polygon", {
points: "748.7 304.82 731.62 383.66 801.26 467.76 819.65 453.31 764.24 375.78 788.78 304.82 748.7 304.82",
fill: "#e0e0e0"
}),
_react2.default.createElement("polygon", {
points: "748.7 304.82 731.62 383.66 801.26 467.76 819.65 453.31 764.24 375.78 788.78 304.82 748.7 304.82",
opacity: 0.04
}),
_react2.default.createElement("polygon", {
points: "788.12 304.82 770.47 403.68 784.86 486.15 808.97 486.15 802.4 400.75 828.85 304.82 788.12 304.82",
fill: "#e0e0e0"
}),
_react2.default.createElement("path", {
d: "M915.1,405.51",
transform: "translate(-144.63 -186.3)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M961.76,443.49l-53.17,38,4.34,7.6,62.16-31.53a16.69,16.69,0,0,0,8.24-20.32C975.92,415.74,961.76,443.49,961.76,443.49Z",
transform: "translate(-144.63 -186.3)",
opacity: 0.05
}),
_react2.default.createElement("path", {
d: "M947.46,399.72,965,444.57,910.76,476l5.43,14.11,62.16-31.53a16.69,16.69,0,0,0,8.24-20.32c-7.41-21.47-22.72-59.41-35.71-50.49A10,10,0,0,0,947.46,399.72Z",
transform: "translate(-144.63 -186.3)",
opacity: 0.05
}),
_react2.default.createElement("path", {
d: "M946.38,397.55l17.55,44.86-53.17,35.81L914,488l63.24-31.53a16.69,16.69,0,0,0,8.24-20.32c-7.41-21.47-22.72-59.41-35.71-50.49A10,10,0,0,0,946.38,397.55Z",
transform: "translate(-144.63 -186.3)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M953.08,672.46h-25l-32.79,6.15a2.37,2.37,0,0,0-1.93,2.33h0a2.37,2.37,0,0,0,2.37,2.37h57.31Z",
transform: "translate(-144.63 -186.3)",
fill: "#333"
}),
_react2.default.createElement("path", {
d: "M948.74,400.08s13,17.36,10.85,30.38",
transform: "translate(-144.63 -186.3)",
opacity: 0.05
}),
_react2.default.createElement("path", {
d: "M922.24,371a29.29,29.29,0,0,0,17.08.92V351.15H922.24Z",
transform: "translate(-144.63 -186.3)",
opacity: 0.05
}),
_react2.default.createElement("circle", { cx: 787.66, cy: 155.08, r: 29.2, fill: "#fda57d" }),
_react2.default.createElement("path", {
d: "M800.07,412s-28.21,4.34-27.13,8.68,27.13,1.09,27.13,1.09Z",
transform: "translate(-144.63 -186.3)",
fill: "#fda57d"
}),
_react2.default.createElement("path", {
d: "M911.48,478.42s-25.25,13.32-22.8,17.07,26-7.84,26-7.84Z",
transform: "translate(-144.63 -186.3)",
fill: "#fda57d"
}),
_react2.default.createElement("path", {
d: "M910.76,405.51s-21.87,4.78-5.51,30.38",
transform: "translate(-144.63 -186.3)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M936.8,407.68s-21.87,4.78-5.51,30.38",
transform: "translate(-144.63 -186.3)",
opacity: 0.05
}),
_react2.default.createElement("path", {
d: "M937.89,407.68s-21.87,4.78-5.51,30.38",
transform: "translate(-144.63 -186.3)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M954,350.75c-5.77,9.35-5.42,21.49-1.6,31.79s10.73,19.12,17.73,27.59c6.56,7.94,13.59,15.95,22.91,20.33,18.85,8.86,41.44.42,58.35-11.73-2.68,1.14-5.49,2.31-8.39,2.12s-5.92-2.2-6.22-5.09c-.35-3.46,3-6,5-8.83,3.62-5,3.18-12.28-.08-17.55s-8.92-8.72-14.87-10.5c-4.93-1.47-10.73-2.29-13.57-6.58-4.6-7,2.52-15.74,3.13-24.08.59-7.94-6-15.73-13.92-16.49-4.59-.44-10,1-13.3-2.24a9,9,0,0,1-2-3.31c-2.14-5.55-1.14-11.74-.87-17.68s-.55-12.62-5.12-16.42c-2.65-2.2-6.14-3.07-9.54-3.62-10.3-1.68-20.85-1.11-31.17.41-14.39,2.11-29.37,6.58-38.9,17.56s-10.77,30,.73,38.94c-4.07-3.15,15.77-21.7,25.09-16C938,335.81,938.22,351.37,954,350.75Z",
transform: "translate(-144.63 -186.3)",
fill: "#333"
})
);
};
UndrawNotes.propTypes = {
/**
* Hex color
*/
primaryColor: _propTypes2.default.string,
/**
* percentage
*/
height: _propTypes2.default.string,
/**
* custom class for svg
*/
class: _propTypes2.default.string
};
UndrawNotes.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
exports.default = UndrawNotes;