@hackoregon/component-library
Version:
Official repo for Hack Oregon React component library
707 lines (562 loc) • 29.3 kB
JavaScript
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _templateObject38() {
var data = _taggedTemplateLiteral(["\n margin: 0;\n"]);
_templateObject38 = function _templateObject38() {
return data;
};
return data;
}
function _templateObject37() {
var data = _taggedTemplateLiteral(["\n box-sizing: border-box;\n display: inline-block;\n width: 33.333333%;\n height: 200px;\n vertical-align: top;\n margin-top: 60px;\n\n @media (max-width: 850px) {\n width: 100%;\n text-align: center;\n height: auto;\n text-align: center !important;\n }\n\n span {\n font-family: \"Rubik\", sans-serif;\n font-size: 16px;\n display: block;\n margin-top: 20px;\n }\n"]);
_templateObject37 = function _templateObject37() {
return data;
};
return data;
}
function _templateObject36() {
var data = _taggedTemplateLiteral(["\n & > div {\n text-align: left;\n }\n"]);
_templateObject36 = function _templateObject36() {
return data;
};
return data;
}
function _templateObject35() {
var data = _taggedTemplateLiteral(["\n border: 2px solid #ef495c;\n padding: 10px 20px;\n font-family: \"Rubik\", sans-serif;\n font-size: 16px;\n color: #ef495c;\n background-color: transparent;\n margin: 10px 0px 50px;\n\n :hover {\n cursor: pointer;\n }\n"]);
_templateObject35 = function _templateObject35() {
return data;
};
return data;
}
function _templateObject34() {
var data = _taggedTemplateLiteral(["\n text-align: right;\n"]);
_templateObject34 = function _templateObject34() {
return data;
};
return data;
}
function _templateObject33() {
var data = _taggedTemplateLiteral(["\n background: url(", ") center no-repeat;\n background-size: cover;\n"]);
_templateObject33 = function _templateObject33() {
return data;
};
return data;
}
function _templateObject32() {
var data = _taggedTemplateLiteral(["\n display: inline-block;\n width: 66.66666666%;\n height: 100%;\n position: relative;\n box-sizing: border-box;\n vertical-align: top;\n padding: 100px 3%;\n background-color: white;\n\n a {\n border: none;\n :hover {\n cursor: pointer;\n }\n }\n\n @media (max-width: 850px) {\n width: 100%;\n }\n"]);
_templateObject32 = function _templateObject32() {
return data;
};
return data;
}
function _templateObject31() {
var data = _taggedTemplateLiteral(["\n display: inline-block;\n width: 33.3333333%;\n height: 100%;\n position: relative;\n box-sizing: border-box;\n vertical-align: top;\n padding: 100px 3%;\n background-color: #250f28;\n color: white;\n min-height: 100vh;\n\n a {\n border: none;\n }\n\n p {\n color: white;\n line-height: 1.5;\n }\n\n @media (max-width: 850px) {\n width: 100%;\n }\n"]);
_templateObject31 = function _templateObject31() {
return data;
};
return data;
}
function _templateObject30() {
var data = _taggedTemplateLiteral(["\n background-color: #ef495c;\n"]);
_templateObject30 = function _templateObject30() {
return data;
};
return data;
}
function _templateObject29() {
var data = _taggedTemplateLiteral(["\n text-align: center;\n"]);
_templateObject29 = function _templateObject29() {
return data;
};
return data;
}
function _templateObject28() {
var data = _taggedTemplateLiteral(["\n display: none;\n position: absolute;\n transform: translate(-50%, -50%);\n top: 50%;\n left: 50%;\n z-index: 10;\n\n @media (max-width: 850px) {\n display: block;\n img {\n width: 78vw;\n max-width: 500px;\n }\n }\n"]);
_templateObject28 = function _templateObject28() {
return data;
};
return data;
}
function _templateObject27() {
var data = _taggedTemplateLiteral(["\n display: block;\n position: absolute;\n transform: translate(-50%, -50%);\n top: 50%;\n left: 50%;\n z-index: 10;\n\n @media (max-width: 850px) {\n display: none;\n }\n"]);
_templateObject27 = function _templateObject27() {
return data;
};
return data;
}
function _templateObject26() {
var data = _taggedTemplateLiteral(["\n display: block;\n font-family: \"Rubik\", sans-serif;\n font-size: 16px;\n color: black;\n line-height: 1.5;\n"]);
_templateObject26 = function _templateObject26() {
return data;
};
return data;
}
function _templateObject25() {
var data = _taggedTemplateLiteral(["\n display: block;\n font-family: \"Rubik\", sans-serif;\n font-size: 24px;\n margin: 12px 0;\n"]);
_templateObject25 = function _templateObject25() {
return data;
};
return data;
}
function _templateObject24() {
var data = _taggedTemplateLiteral(["\n display: block;\n font-family: \"Rubik\", sans-serif;\n font-size: 35px;\n margin: 40px 0;\n text-align: center;\n"]);
_templateObject24 = function _templateObject24() {
return data;
};
return data;
}
function _templateObject23() {
var data = _taggedTemplateLiteral(["\n display: inline-block;\n width: 50%;\n height: 100%;\n position: relative;\n box-sizing: border-box;\n vertical-align: top;\n padding: 80px 6%;\n\n @media (max-width: 850px) {\n width: 100%;\n }\n"]);
_templateObject23 = function _templateObject23() {
return data;
};
return data;
}
function _templateObject22() {
var data = _taggedTemplateLiteral(["\n display: inline-block;\n width: 50%;\n height: 100%;\n position: relative;\n box-sizing: border-box;\n vertical-align: top;\n padding: 80px 6%;\n\n @media (max-width: 850px) {\n width: 100%;\n }\n"]);
_templateObject22 = function _templateObject22() {
return data;
};
return data;
}
function _templateObject21() {
var data = _taggedTemplateLiteral(["\n display: inline-block;\n position: relative;\n width: 10%;\n min-width: 40px;\n img {\n width: 100%;\n }\n"]);
_templateObject21 = function _templateObject21() {
return data;
};
return data;
}
function _templateObject20() {
var data = _taggedTemplateLiteral(["\n background-color: white;\n"]);
_templateObject20 = function _templateObject20() {
return data;
};
return data;
}
function _templateObject19() {
var data = _taggedTemplateLiteral(["\n background-color: #250f28;\n color: black;\n position: relative;\n"]);
_templateObject19 = function _templateObject19() {
return data;
};
return data;
}
function _templateObject18() {
var data = _taggedTemplateLiteral(["\n font-family: \"Rubik\", sans-serif;\n font-size: 20px;\n color: white;\n display: inline-block;\n"]);
_templateObject18 = function _templateObject18() {
return data;
};
return data;
}
function _templateObject17() {
var data = _taggedTemplateLiteral(["\n color: white;\n font-family: \"Rubik\", sans-serif;\n font-size: 50px;\n letter-spacing: -1px;\n text-align: left;\n line-height: 1.2;\n padding: 0px;\n display: block;\n position: relative;\n box-sizing: border-box;\n"]);
_templateObject17 = function _templateObject17() {
return data;
};
return data;
}
function _templateObject16() {
var data = _taggedTemplateLiteral(["\n width: 90%;\n display: inline-block;\n position: relative;\n vertical-align: top;\n padding: 0 20px;\n box-sizing: border-box;\n"]);
_templateObject16 = function _templateObject16() {
return data;
};
return data;
}
function _templateObject15() {
var data = _taggedTemplateLiteral(["\n width: 100%;\n display: block;\n position: relative;\n background-color: #250f28;\n padding: 60px 15%;\n box-sizing: border-box;\n\n @media (max-width: 850px) {\n padding: 60px 10%;\n }\n"]);
_templateObject15 = function _templateObject15() {
return data;
};
return data;
}
function _templateObject14() {
var data = _taggedTemplateLiteral(["\n background-color: white;\n height: 100%;\n color: white;\n"]);
_templateObject14 = function _templateObject14() {
return data;
};
return data;
}
function _templateObject13() {
var data = _taggedTemplateLiteral(["\n margin-top: 40px;\n margin-bottom: 120px;\n"]);
_templateObject13 = function _templateObject13() {
return data;
};
return data;
}
function _templateObject12() {
var data = _taggedTemplateLiteral(["\n color: #ed485b;\n font-family: \"Rubik\";\n font-size: 18px;\n font-style: italic;\n\n a {\n text-decoration: none;\n border: none;\n\n :hover {\n text-decoration: underline;\n }\n }\n"]);
_templateObject12 = function _templateObject12() {
return data;
};
return data;
}
function _templateObject11() {
var data = _taggedTemplateLiteral(["\n position: relative;\n width: 100%;\n height: 25px;\n background-color: #240f27;\n"]);
_templateObject11 = function _templateObject11() {
return data;
};
return data;
}
function _templateObject10() {
var data = _taggedTemplateLiteral(["\n display: block;\n box-sizing: border-box;\n position: relative;\n padding-left: 70px;\n width: 50%;\n\n @media (max-width: 850px) {\n width: 100%;\n padding: 0 36px;\n }\n"]);
_templateObject10 = function _templateObject10() {
return data;
};
return data;
}
function _templateObject9() {
var data = _taggedTemplateLiteral(["\n display: block;\n font-family: \"Rubik\";\n font-size: 16px;\n position: absolute;\n top: 70px;\n right: 9%;\n margin: 0;\n\n a {\n color: #240f27;\n text-decoration: none;\n border-bottom: none;\n :hover {\n color: #240f27;\n text-decoration: underline;\n }\n }\n\n @media (max-width: 850px) {\n right: 3%;\n }\n"]);
_templateObject9 = function _templateObject9() {
return data;
};
return data;
}
function _templateObject8() {
var data = _taggedTemplateLiteral(["\n margin-top: 148px;\n background-color: #240f27;\n padding: 40px;\n width: 100%;\n max-width: 320px;\n position: absolute;\n top: 0;\n right: 9%;\n box-shadow: 14px 30px 60px 9px #0f18287a;\n\n ::before {\n content: \"\";\n width: 100%;\n border-bottom: solid 8px #ef495c;\n position: absolute;\n left: 0;\n top: 0px;\n z-index: 1;\n }\n\n @media (max-width: 1024px) {\n max-width: 270px;\n right: 6%;\n }\n\n @media (max-width: 850px) {\n position: relative;\n max-width: none;\n width: 100%;\n top: 0;\n right: 0;\n box-sizing: border-box;\n margin-bottom: 100px;\n }\n"]);
_templateObject8 = function _templateObject8() {
return data;
};
return data;
}
function _templateObject7() {
var data = _taggedTemplateLiteral(["\n position: relative;\n"]);
_templateObject7 = function _templateObject7() {
return data;
};
return data;
}
function _templateObject6() {
var data = _taggedTemplateLiteral(["\n background-color: #ffffff;\n padding: 0px;\n height: auto;\n box-sizing: border-box;\n"]);
_templateObject6 = function _templateObject6() {
return data;
};
return data;
}
function _templateObject5() {
var data = _taggedTemplateLiteral(["\n font-size: 20px;\n line-height: 1.8;\n font-family: \"Rubik\", sans-serif;\n width: 100%;\n margin: 25px 0;\n max-width: 1000px;\n text-align: left;\n color: #001732;\n\n @media (max-width: 1024px) {\n font-size: 16px;\n }\n"]);
_templateObject5 = function _templateObject5() {
return data;
};
return data;
}
function _templateObject4() {
var data = _taggedTemplateLiteral(["\n font-family: \"Rubik\", sans-serif;\n text-align: left;\n font-size: 50px;\n line-height: 1.2;\n width: 100%;\n letter-spacing: -2px;\n margin: 0;\n"]);
_templateObject4 = function _templateObject4() {
return data;
};
return data;
}
function _templateObject3() {
var data = _taggedTemplateLiteral(["\n position: relative;\n margin: 0;\n padding: 30px 0px 20px;\n width: 160px;\n"]);
_templateObject3 = function _templateObject3() {
return data;
};
return data;
}
function _templateObject2() {
var data = _taggedTemplateLiteral(["\n font-family: \"Rubik\", sans-serif;\n font-weight: 400;\n font-size: 16px;\n font-style: italic;\n color: #aaa4ab;\n margin: 0;\n"]);
_templateObject2 = function _templateObject2() {
return data;
};
return data;
}
function _templateObject() {
var data = _taggedTemplateLiteral(["\n font-family: \"Rubik\", sans-serif;\n text-align: left;\n font-size: 18px;\n color: white;\n margin: 0 auto;\n"]);
_templateObject = function _templateObject() {
return data;
};
return data;
}
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
import React from "react";
import { cx, css } from "emotion";
import window from "global/window";
import { Header, Footer } from "@hackoregon/component-library";
import CanvasParticles from "./CanvasParticles";
import DataList from "./DataList";
import SearchBar from "./SearchBar";
import logo from "../../assets/civic-logo-animated.svg";
import smallLogo from "../../assets/civic-logo-c.svg";
import brain from "../../assets/brain.svg";
import brainMobile from "../../assets/brain-mobile.svg";
import trees from "../../assets/trees.png";
import hackOregonLogo from "../../assets/hack-oregon-logo.png";
import heartMail from "../../assets/heartmail.png";
import twitterLogo from "../../assets/twitter-logo.png";
import cities from "./cities";
import zipCodes from "./zipCodes.json";
var searchTitle = css(_templateObject());
var searchSubTitle = css(_templateObject2());
var logoWrapper = css(_templateObject3());
var missionStatementTitle = css(_templateObject4());
var missionStatement = css(_templateObject5());
var appWrapper = css(_templateObject6());
var contentWrapper = css(_templateObject7());
var lookupWrapper = css(_templateObject8());
var collectionsLink = css(_templateObject9());
var leftContainer = css(_templateObject10());
var topBar = css(_templateObject11());
var ctaStyle = css(_templateObject12());
var citySkyline = css(_templateObject13());
var aboutCivicWrapper = css(_templateObject14());
var sectionHeaderWrapper = css(_templateObject15());
var sectionRightContainer = css(_templateObject16());
var sectionHeaderTitle = css(_templateObject17());
var sectionHeaderSubtitle = css(_templateObject18());
var sectionContentWrapper = css(_templateObject19());
var one = css(_templateObject20());
var smallLogoWrapper = css(_templateObject21());
var contentLeftContainer = css(_templateObject22());
var contentRightContainer = css(_templateObject23());
var listTitle = css(_templateObject24());
var listSubTitle = css(_templateObject25());
var listText = css(_templateObject26());
var brainWrapper = css(_templateObject27());
var brainWrapperMobile = css(_templateObject28());
var centered = css(_templateObject29());
var salmonBackground = css(_templateObject30());
var leftThirdWrapper = css(_templateObject31());
var rightThirdWrapper = css(_templateObject32());
var treesBackground = css(_templateObject33(), trees);
var hackOregonLogoWrapper = css(_templateObject34());
var buttonStyle = css(_templateObject35());
var talkToUs = css(_templateObject36());
var iconAndTextWrapper = css(_templateObject37());
var donateButton = css(_templateObject38());
var LandingPage = function (_React$Component) {
_inherits(LandingPage, _React$Component);
function LandingPage() {
var _getPrototypeOf2;
var _this;
_classCallCheck(this, LandingPage);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(LandingPage)).call.apply(_getPrototypeOf2, [this].concat(args)));
_defineProperty(_assertThisInitialized(_this), "state", {
city: "Portland",
state: "OR",
imgPath: "portland"
});
_defineProperty(_assertThisInitialized(_this), "handleSearch", function (input) {
var key = input ? input.toLowerCase() : "";
var cityResult = cities[key];
if (cityResult) {
return _this.setState({
city: cityResult.name,
state: cityResult.state,
imgPath: cityResult.path
});
}
var zipResult = zipCodes[key];
if (zipResult) {
var cityData = zipResult.city ? cities[zipResult.city.toLowerCase()] : {};
return _this.setState({
city: cityData ? cityData.name : zipResult.city,
state: zipResult.state,
imgPath: cityData ? cityData.path : "portland"
});
}
return null;
});
return _this;
}
_createClass(LandingPage, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
this.node.style.opacity = 0;
window.requestAnimationFrame(function () {
_this2.node.style.transition = "opacity 2500ms";
_this2.node.style.opacity = 1;
});
}
}, {
key: "render",
value: function render() {
var _this3 = this;
var _this$state = this.state,
city = _this$state.city,
state = _this$state.state,
imgPath = _this$state.imgPath;
var cityPath = require("../../assets/cities/".concat(imgPath || "portland", ".png"));
return React.createElement("div", {
className: appWrapper,
ref: function ref(node) {
_this3.node = node;
}
}, React.createElement(CanvasParticles, null), React.createElement("div", {
className: contentWrapper
}, React.createElement(Header, {
title: "Civic"
}), this.props.children, React.createElement("div", {
className: aboutCivicWrapper,
id: "aboutCivic"
}, React.createElement("div", {
className: sectionHeaderWrapper
}, React.createElement("div", {
className: smallLogoWrapper
}, React.createElement("img", {
src: smallLogo
})), React.createElement("div", {
className: sectionRightContainer
}, React.createElement("div", {
className: sectionHeaderTitle
}, "CIVIC Software Foundation"), React.createElement("div", {
className: sectionHeaderSubtitle
}, "CIVIC is a fully open source project. The Civic Software Foundation supports a network of people, cities, and organizations who are dedicated to innovating on the CIVIC Platform."))), React.createElement("div", {
className: cx(sectionContentWrapper, one)
}, React.createElement("div", {
className: contentLeftContainer
}, React.createElement("div", {
className: listTitle
}, "Supporting People"), React.createElement("div", {
className: listSubTitle
}, "Vision"), React.createElement("p", {
className: listText
}, "Empowering cities to create technology that is a reflection of their ambition, their values, and their priorities."), React.createElement("div", {
className: listSubTitle
}, "Workflow"), React.createElement("p", {
className: listText
}, "Bringing our experience to existing partnerships to reshape and modernize current infrastructure and create a process to ensure sustainable outcomes."), React.createElement("div", {
className: listSubTitle
}, "Tactics"), React.createElement("p", {
className: listText
}, "Helping teams solve technical challenges with proven implementation strategies.")), React.createElement("div", {
className: brainWrapper
}, React.createElement("img", {
src: brain
})), React.createElement("div", {
className: brainWrapperMobile
}, React.createElement("img", {
src: brainMobile
})), React.createElement("div", {
className: contentRightContainer
}, React.createElement("div", {
className: listTitle
}, "Supporting Technology"), React.createElement("div", {
className: listSubTitle
}, "Open Data"), React.createElement("p", {
className: listText
}, "Lowering the barrier to entry for information to be accessible and secure from the internet so data can be actionable in many ways."), React.createElement("div", {
className: listSubTitle
}, "Open Code"), React.createElement("p", {
className: listText
}, "Designing for maximum interoperability between systems with reproducible standards that are built to scale."), React.createElement("div", {
className: listSubTitle
}, "Open Outcomes"), React.createElement("p", {
className: listText
}, "Enabling transparency in analytical models with live data sources that power shareable visualizations on the web.")))), React.createElement("div", {
className: aboutCivicWrapper,
id: "getStarted"
}, React.createElement("div", {
className: cx(sectionHeaderWrapper, salmonBackground)
}, React.createElement("div", {
className: cx(sectionHeaderTitle, centered)
}, "CIVIC is made by people.")), React.createElement("div", {
className: sectionContentWrapper
}, React.createElement("div", {
className: leftThirdWrapper
}, React.createElement("div", {
className: listTitle
}, "Membership Model for Cities"), React.createElement("p", {
className: listText
}, "The code for CIVIC is open source and free, but we recognize cities will be most successful through a supported process."), React.createElement("p", {
className: listText
}, "We have resources to help navigate the technical challenges and strategic opportunities that facilitate long-term goals for cities engaging with modern data systems."), React.createElement("p", {
className: listText
}, "We\u2019re announcing a call to action for cities who want to work closely with people who are building the CIVIC Platform to become members and benefit from hands-on collaboration with our partner network."), React.createElement("a", {
href: "http://hackoregon.org/membership"
}, React.createElement("button", {
className: buttonStyle
}, "Start the conversation"))), React.createElement("div", {
className: rightThirdWrapper
}, React.createElement("div", {
className: listTitle
}, "Get Involved \u2728"), React.createElement("div", {
className: listSubTitle
}, "Teamwork and building on CIVIC"), React.createElement("p", {
className: listText
}, "You can help make CIVIC! We\u2019re actively building focus teams across the country to develop new stories, new features, and better functionality on the platform. If you\u2019re interested in collaborating with the people who are creating CIVIC, we\u2019d love to talk to you."), React.createElement("a", {
href: "http://hackoregon.org/joinacivicteam",
target: "_blank"
}, React.createElement("button", {
className: buttonStyle
}, "Apply now")), React.createElement("div", {
className: listSubTitle
}, "Collaborate as an industry partner"), React.createElement("p", {
className: listText
}, "We work with a variety of companies and organizations dedicated to empowering data driven innovation in cities. It\u2019s important that CIVIC includes diverse perspectives across industry sectors whether or not you have experience working with government or software. Start the conversation by applying to join our network."), React.createElement("a", {
href: "http://hackoregon.org/joinacivicteam",
target: "_blank"
}, React.createElement("button", {
className: buttonStyle
}, "Apply now"))))), React.createElement("div", {
className: aboutCivicWrapper,
id: "aboutCivic"
}, React.createElement("div", {
className: cx(sectionHeaderWrapper, treesBackground)
}, React.createElement("div", {
className: cx(sectionHeaderTitle, hackOregonLogoWrapper)
}, React.createElement("img", {
src: hackOregonLogo,
width: "300"
}))), React.createElement("div", {
className: sectionContentWrapper
}, React.createElement("div", {
className: cx(rightThirdWrapper, talkToUs)
}, React.createElement("div", {
className: listTitle
}, "Talk to us"), React.createElement("div", {
className: listSubTitle
}, React.createElement("a", {
href: "mailto:hi@civicsoftwarefoundation.org"
}, "hi@civicsoftwarefoundation.org")), React.createElement("div", {
className: listTitle
}, "CIVIC launched to the world June 21st, 2018 at Hack Oregon\u2019s live Demo Day in Portland, Oregon."), React.createElement("div", {
className: listText
}, "Please be patient while our website is under construction and stay tuned as we are able to share new things from the CIVIC Software Foundation."), React.createElement("div", {
className: iconAndTextWrapper
}, React.createElement("img", {
src: heartMail,
width: "60"
}), React.createElement("span", null, "Subscribe for updates!")), React.createElement("div", {
className: iconAndTextWrapper
}, React.createElement("a", {
href: "https://secure.squarespace.com/checkout/donate?donatePageId=551721b2e4b057e153f5c1cc"
}, React.createElement("button", {
className: cx(buttonStyle, donateButton)
}, "Donate")), React.createElement("span", null, "Help us continue to maintain and develop CIVIC.")), React.createElement("div", {
className: iconAndTextWrapper
}, React.createElement("img", {
src: twitterLogo,
width: "40"
}), React.createElement("span", null, React.createElement("a", {
href: "https://twitter.com/civicsoftware"
}, "@civicsoftware"), React.createElement("br", null), " #CIVIC4Lyfe"))), React.createElement("div", {
className: leftThirdWrapper
}, React.createElement("div", {
className: listTitle
}, "CIVIC was developed by Hack Oregon."), React.createElement("p", {
className: listText
}, "The original concept, design, and source code for the CIVIC platform was developed by volunteer teams at Hack Oregon, a rapid-prototyping lab dedicated to creating open data projects that bring insight to local information challenges."), React.createElement("p", {
className: listText
}, "Hack Oregon is a non-profit program of the CIVIC Software Foundation."), React.createElement("p", {
className: listText
}, "If you live in Portland, you can volunteer to join a team for our next cycle."), React.createElement("a", {
href: "http://hackoregon.org/civicpdx"
}, React.createElement("button", {
className: buttonStyle
}, "Learn more")))))), React.createElement(Footer, null));
}
}]);
return LandingPage;
}(React.Component);
export default LandingPage;