react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
591 lines (581 loc) • 18.2 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 UndrawGoldenGateBridge = function UndrawGoldenGateBridge(props) {
return _react2.default.createElement(
"svg",
{
style: { height: props.height, width: '100%' },
className: props.class,
id: "404ff4c3-798a-4d7f-af0d-3af2d2926644",
"data-name": "Layer 1",
xmlnsXlink: "http://www.w3.org/1999/xlink",
viewBox: "0 0 897.13 619.94"
},
_react2.default.createElement(
"defs",
null,
_react2.default.createElement(
"linearGradient",
{
id: "f85ad179-a9e5-43a6-9cd0-6b2f616378fe",
x1: 212.02,
y1: 94.83,
x2: 212.02,
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: "77139c16-33a6-4dfa-8989-da93276af52e",
x1: 789.57,
y1: 413,
x2: 789.57,
y2: 198.23,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "c1f90bbd-6146-4ee7-8dcf-9d36f44ef679",
x1: 789.57,
y1: 209.53,
x2: 789.57,
y2: 94.44,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "c28052ae-ed0b-41fd-8f79-8e5e5b7fe1eb",
x1: 789.57,
y1: 110.88,
x2: 789.57,
y2: 41,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "d21e40ae-c1e5-42b1-bc13-f4e123f15ce0",
x1: 107.57,
y1: 413,
x2: 107.57,
y2: 198.23,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "7200f34b-2b30-401a-b9a9-80163e9b6c6b",
x1: 107.57,
y1: 209.53,
x2: 107.57,
y2: 94.44,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "e5c8761b-89d8-4d0e-8298-23bf4ff282f6",
x1: 107.57,
y1: 110.88,
x2: 107.57,
y2: 41,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "4c3ebaf4-f809-4b12-9ba4-198cb2c9e5a1",
x1: 449.07,
y1: 320,
x2: 449.07,
y2: 292,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "fa3bdb70-ddd3-4384-8681-e1e959ecf168",
x1: 697.59,
y1: 571.53,
x2: 822.41,
y2: 571.53,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "680c971b-18b3-42eb-b3fe-620c6c656ca0",
x1: 548.07,
y1: 571,
x2: 548.07,
y2: 527,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "51e936ee-3820-4ad2-98e1-dde99ed0951f",
x1: 710.5,
y1: 732.03,
x2: 710.5,
y2: 680.03,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "6a43d89c-cf4a-4c8b-801f-93cf02c7a71f",
x1: 660.33,
y1: 668.03,
x2: 660.33,
y2: 497.03,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
}),
_react2.default.createElement("linearGradient", {
id: "9d954d62-6ebc-4ad3-aace-04154c80b8e0",
x1: 557.79,
y1: 348.81,
x2: 557.79,
y2: 339.64,
xlinkHref: "#f85ad179-a9e5-43a6-9cd0-6b2f616378fe"
})
),
_react2.default.createElement(
"title",
null,
"Golden Gate Bridge"
),
_react2.default.createElement("path", {
d: "M442.5,549.4s22-7.57,38,0,42,2.52,50-1.51,44,1.51,48,5.55,20,9.09,31,5,33-13.13,42-7.57",
transform: "translate(-151.43 -140.03)",
fill: "#2196f3"
}),
_react2.default.createElement("path", {
d: "M442.5,549.4s22-7.57,38,0,42,2.52,50-1.51,44,1.51,48,5.55,20,9.09,31,5,33-13.13,42-7.57",
transform: "translate(-151.43 -140.03)",
opacity: 0.2
}),
_react2.default.createElement("path", {
d: "M363.5,490s50.42-15,87.09,0,96.26,5,114.59-3,100.84,3,110,11,45.84,18,71,10,75.63-26,96.26-15",
transform: "translate(-151.43 -140.03)",
fill: "#2196f3"
}),
_react2.default.createElement("path", {
d: "M363.5,490s50.42-15,87.09,0,96.26,5,114.59-3,100.84,3,110,11,45.84,18,71,10,75.63-26,96.26-15",
transform: "translate(-151.43 -140.03)",
opacity: 0.2
}),
_react2.default.createElement("ellipse", {
cx: 212.02,
cy: 47.41,
rx: 48.05,
ry: 47.41,
fill: "url(#f85ad179-a9e5-43a6-9cd0-6b2f616378fe)"
}),
_react2.default.createElement("circle", {
cx: 212.02,
cy: 47.41,
r: 41.88,
fill: "#ff9800",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("rect", {
x: 771.07,
y: 198.23,
width: 37,
height: 214.77,
fill: "url(#77139c16-33a6-4dfa-8989-da93276af52e)"
}),
_react2.default.createElement("rect", {
x: 779.6,
y: 94.44,
width: 19.92,
height: 115.09,
fill: "url(#c1f90bbd-6146-4ee7-8dcf-9d36f44ef679)"
}),
_react2.default.createElement("rect", {
x: 785.3,
y: 41,
width: 8.54,
height: 69.88,
fill: "url(#c28052ae-ed0b-41fd-8f79-8e5e5b7fe1eb)"
}),
_react2.default.createElement("rect", {
x: 89.07,
y: 198.23,
width: 37,
height: 214.77,
fill: "url(#d21e40ae-c1e5-42b1-bc13-f4e123f15ce0)"
}),
_react2.default.createElement("rect", {
x: 97.6,
y: 94.44,
width: 19.92,
height: 115.09,
fill: "url(#7200f34b-2b30-401a-b9a9-80163e9b6c6b)"
}),
_react2.default.createElement("rect", {
x: 103.3,
y: 41,
width: 8.54,
height: 69.88,
fill: "url(#e5c8761b-89d8-4d0e-8298-23bf4ff282f6)"
}),
_react2.default.createElement("rect", {
x: 6.07,
y: 292,
width: 886,
height: 28,
fill: "url(#4c3ebaf4-f809-4b12-9ba4-198cb2c9e5a1)"
}),
_react2.default.createElement("rect", { x: 9.07, y: 296, width: 879, height: 17, fill: "#ff5252" }),
_react2.default.createElement("rect", { x: 9.07, y: 313, width: 879, height: 3, fill: "#ff5252" }),
_react2.default.createElement("rect", { x: 9.07, y: 313, width: 879, height: 3, opacity: 0.2 }),
_react2.default.createElement("rect", { x: 94.57, y: 198.5, width: 26, height: 209, fill: "#ff5252" }),
_react2.default.createElement("rect", { x: 100.57, y: 97.5, width: 14, height: 112, fill: "#ff5252" }),
_react2.default.createElement("rect", { x: 104.57, y: 45.5, width: 6, height: 68, fill: "#ff5252" }),
_react2.default.createElement("rect", {
x: 928,
y: 338.53,
width: 26,
height: 209,
transform: "translate(1730.57 746.03) rotate(-180)",
fill: "#ff5252"
}),
_react2.default.createElement("rect", { x: 782.57, y: 97.5, width: 14, height: 112, fill: "#ff5252" }),
_react2.default.createElement("rect", { x: 786.57, y: 45.5, width: 6, height: 68, fill: "#ff5252" }),
_react2.default.createElement("path", {
d: "M1048.5,280s-61-4-107.5-86.5c-351,476-682,0-682,0C212.5,276,151.5,280,151.5,280",
transform: "translate(-151.43 -140.03)",
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10,
strokeWidth: 2
}),
_react2.default.createElement("line", {
x1: 20.96,
y1: 134.71,
x2: 20.96,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 52.38,
y1: 117.65,
x2: 52.38,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 413.1,
y1: 261.79,
x2: 413.1,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 485.07,
y1: 265.06,
x2: 485.07,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 340.42,
y1: 242.11,
x2: 340.42,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 270.92,
y1: 206.82,
x2: 270.92,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 199.7,
y1: 153.5,
x2: 199.7,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 557.8,
y1: 247,
x2: 557.8,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 632.12,
y1: 209.5,
x2: 632.12,
y2: 295.5,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 702.4,
y1: 153.5,
x2: 702.4,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 162.05,
y1: 117.65,
x2: 162.05,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 737.36,
y1: 117.65,
x2: 737.36,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 876.18,
y1: 134.71,
x2: 876.18,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 844.75,
y1: 117.65,
x2: 844.75,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 235.91,
y1: 182.86,
x2: 235.91,
y2: 295.5,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 307.39,
y1: 227.35,
x2: 307.39,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 370.87,
y1: 252.5,
x2: 370.87,
y2: 295.5,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 448.57,
y1: 265.06,
x2: 448.57,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 524.09,
y1: 257.1,
x2: 524.09,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 593.81,
y1: 231.5,
x2: 593.81,
y2: 296,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("line", {
x1: 664.01,
y1: 186.66,
x2: 664.01,
y2: 295.5,
fill: "none",
stroke: "#ff5252",
strokeMiterlimit: 10
}),
_react2.default.createElement("rect", { x: 101.07, y: 197, width: 13, height: 2, opacity: 0.2 }),
_react2.default.createElement("rect", { x: 105.07, y: 96, width: 5, height: 2, opacity: 0.2 }),
_react2.default.createElement("rect", { x: 783.07, y: 196, width: 13, height: 2, opacity: 0.2 }),
_react2.default.createElement("rect", { x: 787.07, y: 96, width: 5, height: 2, opacity: 0.2 }),
_react2.default.createElement("path", {
d: "M697.59,666V476S755.5,619,822.41,667Z",
transform: "translate(-151.43 -140.03)",
fill: "url(#fa3bdb70-ddd3-4384-8681-e1e959ecf168)"
}),
_react2.default.createElement("path", {
d: "M699.5,663V479s46,153,118,185Z",
transform: "translate(-151.43 -140.03)",
fill: "#f5f5f5"
}),
_react2.default.createElement("path", {
d: "M702.5,663V488.32c-2-5.88-3-9.29-3-9.29V663l118,1-.05,0Z",
transform: "translate(-151.43 -140.03)",
fill: "#ff5252",
opacity: 0.2
}),
_react2.default.createElement("rect", {
x: 500.07,
y: 527,
width: 96,
height: 44,
rx: 19,
ry: 19,
fill: "url(#680c971b-18b3-42eb-b3fe-620c6c656ca0)"
}),
_react2.default.createElement("rect", {
x: 502.07,
y: 530,
width: 92,
height: 38,
rx: 19,
ry: 19,
fill: "#64ffda"
}),
_react2.default.createElement("path", {
d: "M659.5,694h0a19.06,19.06,0,0,1,19-19h54a18.82,18.82,0,0,1,8.86,2.22A19,19,0,0,0,726.5,670h-54a19.06,19.06,0,0,0-19,19h0a19,19,0,0,0,10.14,16.78A18.88,18.88,0,0,1,659.5,694Z",
transform: "translate(-151.43 -140.03)",
fill: "#ff5252",
opacity: 0.2
}),
_react2.default.createElement("path", {
d: "M562.5,680l35.85,52H858.5l-31.78-42.46A22.83,22.83,0,0,0,808.51,680Z",
transform: "translate(-151.43 -140.03)",
fill: "url(#51e936ee-3820-4ad2-98e1-dde99ed0951f)"
}),
_react2.default.createElement("path", {
d: "M564.5,683l35,45h254l-31-36.74A23.27,23.27,0,0,0,804.69,683Z",
transform: "translate(-151.43 -140.03)",
fill: props.primaryColor
}),
_react2.default.createElement("path", {
d: "M597.56,668S583.93,521.16,723.45,497c0,0-66.09,93.37-24.13,171Z",
transform: "translate(-151.43 -140.03)",
fill: "url(#6a43d89c-cf4a-4c8b-801f-93cf02c7a71f)"
}),
_react2.default.createElement("path", {
d: "M600.5,664s-13-140,120-163c0,0-63,89-23,163Z",
transform: "translate(-151.43 -140.03)",
fill: props.primaryColor
}),
_react2.default.createElement("polygon", {
points: "546.51 339.64 569.07 343.95 547.18 348.81 546.51 339.64",
fill: "url(#9d954d62-6ebc-4ad3-aace-04154c80b8e0)"
}),
_react2.default.createElement("polygon", {
points: "548.51 340.45 567.07 344 549.07 348 548.51 340.45",
fill: "#ff5252"
}),
_react2.default.createElement("path", {
d: "M716.26,507.57c2.59-4.21,4.24-6.54,4.24-6.54-133,23-120,163-120,163h7.77C607.39,641.87,608.76,533.76,716.26,507.57Z",
transform: "translate(-151.43 -140.03)",
fill: "#ff5252",
opacity: 0.2
}),
_react2.default.createElement("path", {
d: "M807.69,687a23.27,23.27,0,0,1,17.78,8.26L853.12,728h.38l-31-36.74A23.27,23.27,0,0,0,804.69,683H564.5l3.11,4Z",
transform: "translate(-151.43 -140.03)",
fill: "#ff5252",
opacity: 0.2
}),
_react2.default.createElement("path", {
d: "M362.5,586.4s9.05-7.57,15.64,0,17.28,2.52,20.57-1.51,18.11,1.51,19.75,5.55,8.23,9.09,12.76,5,13.58-13.13,17.28-7.57",
transform: "translate(-151.43 -140.03)",
fill: "#2196f3"
}),
_react2.default.createElement("path", {
d: "M362.5,586.4s9.05-7.57,15.64,0,17.28,2.52,20.57-1.51,18.11,1.51,19.75,5.55,8.23,9.09,12.76,5,13.58-13.13,17.28-7.57",
transform: "translate(-151.43 -140.03)",
opacity: 0.2
}),
_react2.default.createElement("path", {
d: "M257.5,662.4s31.26-7.57,54,0,59.68,2.52,71.05-1.51,62.53,1.51,68.21,5.55,28.42,9.09,44.05,5,46.89-13.13,59.68-7.57",
transform: "translate(-151.43 -140.03)",
fill: "#2196f3"
}),
_react2.default.createElement("path", {
d: "M164.5,735.64s31.26-8.12,54,0,59.68,2.71,71.05-1.62,62.53,1.62,68.21,6,28.42,9.74,44.05,5.41,46.89-14.07,59.68-8.12",
transform: "translate(-151.43 -140.03)",
fill: "#2196f3"
}),
_react2.default.createElement("path", {
d: "M502.5,749.4s13.16-7.57,22.73,0,25.12,2.52,29.9-1.51,26.32,1.51,28.71,5.55,12,9.09,18.54,5,19.74-13.13,25.12-7.57",
transform: "translate(-151.43 -140.03)",
fill: "#2196f3"
}),
_react2.default.createElement("path", {
d: "M864.5,714.4s13.16-7.57,22.73,0,25.12,2.52,29.9-1.51,26.32,1.51,28.71,5.55,12,9.09,18.54,5,19.74-13.13,25.12-7.57",
transform: "translate(-151.43 -140.03)",
fill: "#2196f3"
}),
_react2.default.createElement("path", {
d: "M785.5,607.4s16.63-7.57,28.73,0,31.75,2.52,37.8-1.51,33.26,1.51,36.29,5.55,15.12,9.09,23.44,5,24.95-13.13,31.75-7.57",
transform: "translate(-151.43 -140.03)",
fill: "#2196f3"
}),
_react2.default.createElement("path", {
d: "M785.5,607.4s16.63-7.57,28.73,0,31.75,2.52,37.8-1.51,33.26,1.51,36.29,5.55,15.12,9.09,23.44,5,24.95-13.13,31.75-7.57",
transform: "translate(-151.43 -140.03)",
opacity: 0.2
})
);
};
UndrawGoldenGateBridge.propTypes = {
/**
* Hex color
*/
primaryColor: _propTypes2.default.string,
/**
* percentage
*/
height: _propTypes2.default.string,
/**
* custom class for svg
*/
class: _propTypes2.default.string
};
UndrawGoldenGateBridge.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
exports.default = UndrawGoldenGateBridge;