From b0c6649240d76d5175b75e8a8ef51595aa5c9930 Mon Sep 17 00:00:00 2001 From: euginwae2 Date: Thu, 27 Feb 2020 18:55:50 -0700 Subject: [PATCH] complete basic components --- package-lock.json | 156 +++++++++++++++++++++++++++++++ package.json | 2 + src/components/call-to-action.js | 20 ++++ src/components/head-line.js | 9 ++ src/components/head-nav.js | 16 ++++ src/components/industries.js | 20 ++++ src/components/layout.js | 15 +-- src/components/pricing.js | 35 +++++++ src/components/value-prop.js | 27 ++++++ src/pages/index.js | 34 ++++--- 10 files changed, 312 insertions(+), 22 deletions(-) create mode 100644 src/components/call-to-action.js create mode 100644 src/components/head-line.js create mode 100644 src/components/head-nav.js create mode 100644 src/components/industries.js create mode 100644 src/components/pricing.js create mode 100644 src/components/value-prop.js diff --git a/package-lock.json b/package-lock.json index 85e5919..95ac53e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1356,6 +1356,16 @@ "warning": "^3.0.0" } }, + "@restart/context": { + "version": "2.1.4", + "resolved": "https://registry.npmjs.org/@restart/context/-/context-2.1.4.tgz", + "integrity": "sha512-INJYZQJP7g+IoDUh/475NlGiTeMfwTXUEr3tmRneckHIxNolGOW9CTq83S8cxq0CgJwwcMzMJFchxvlwe7Rk8Q==" + }, + "@restart/hooks": { + "version": "0.3.21", + "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.3.21.tgz", + "integrity": "sha512-Wcu3CFJV+iiqPEIoPVx3/CYnZBRgPeRABo6bLJByRH9ptJXyObn7WYPG7Rv0cg3+55bqcBbG0xEfovzwE2PNXg==" + }, "@sindresorhus/is": { "version": "0.14.0", "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz", @@ -2785,6 +2795,11 @@ "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz", "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=" }, + "bootstrap": { + "version": "4.4.1", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.4.1.tgz", + "integrity": "sha512-tbx5cHubwE6e2ZG7nqM3g/FZ5PQEDMWmMGNrCUBVRPHXTJaH7CBDdsLeu3eCh3B1tzAxTnAbtmrzvWEvT2NNEA==" + }, "boxen": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/boxen/-/boxen-4.2.0.tgz", @@ -3471,6 +3486,11 @@ } } }, + "classnames": { + "version": "2.2.6", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz", + "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==" + }, "clean-stack": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", @@ -9846,6 +9866,11 @@ "object.assign": "^4.1.0" } }, + "keycode": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz", + "integrity": "sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ=" + }, "keyv": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/keyv/-/keyv-3.1.0.tgz", @@ -11796,6 +11821,11 @@ "ts-pnp": "^1.1.2" } }, + "popper.js": { + "version": "1.16.1", + "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", + "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==" + }, "portfinder": { "version": "1.0.25", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.25.tgz", @@ -12676,6 +12706,25 @@ "react-is": "^16.8.1" } }, + "prop-types-extra": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/prop-types-extra/-/prop-types-extra-1.1.1.tgz", + "integrity": "sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew==", + "requires": { + "react-is": "^16.3.2", + "warning": "^4.0.0" + }, + "dependencies": { + "warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "requires": { + "loose-envify": "^1.0.0" + } + } + } + }, "proto-list": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz", @@ -12866,6 +12915,47 @@ "prop-types": "^15.6.2" } }, + "react-bootstrap": { + "version": "1.0.0-beta.16", + "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-1.0.0-beta.16.tgz", + "integrity": "sha512-wjb+3CwviDWAaz4O3gQpd2XMDNqbOiqOOzpLm5aLPcp1wTsQsVRhyM+rTPmO3hYU8auA2eNpTYLz08/fAcMqDA==", + "requires": { + "@babel/runtime": "^7.4.2", + "@restart/context": "^2.1.4", + "@restart/hooks": "^0.3.11", + "@types/react": "^16.8.23", + "classnames": "^2.2.6", + "dom-helpers": "^5.1.2", + "invariant": "^2.2.4", + "keycode": "^2.2.0", + "popper.js": "^1.16.0", + "prop-types": "^15.7.2", + "prop-types-extra": "^1.1.0", + "react-overlays": "^2.1.0", + "react-transition-group": "^4.0.0", + "uncontrollable": "^7.0.0", + "warning": "^4.0.3" + }, + "dependencies": { + "dom-helpers": { + "version": "5.1.3", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.3.tgz", + "integrity": "sha512-nZD1OtwfWGRBWlpANxacBEZrEuLa16o1nh7YopFWeoF68Zt8GGEmzHu6Xv4F3XaFIC+YXtTLrzgqKxFgLEe4jw==", + "requires": { + "@babel/runtime": "^7.6.3", + "csstype": "^2.6.7" + } + }, + "warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "requires": { + "loose-envify": "^1.0.0" + } + } + } + }, "react-dev-utils": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-4.2.3.tgz", @@ -13164,6 +13254,39 @@ "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" }, + "react-overlays": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-2.1.1.tgz", + "integrity": "sha512-gaQJwmb8Ij2IGVt4D1HmLtl4A0mDVYxlsv/8i0dHWK7Mw0kNat6ORelbbEWzaXTK1TqMeQtJw/jraL3WOADz3w==", + "requires": { + "@babel/runtime": "^7.4.5", + "@restart/hooks": "^0.3.12", + "dom-helpers": "^5.1.0", + "popper.js": "^1.15.0", + "prop-types": "^15.7.2", + "uncontrollable": "^7.0.0", + "warning": "^4.0.3" + }, + "dependencies": { + "dom-helpers": { + "version": "5.1.3", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.3.tgz", + "integrity": "sha512-nZD1OtwfWGRBWlpANxacBEZrEuLa16o1nh7YopFWeoF68Zt8GGEmzHu6Xv4F3XaFIC+YXtTLrzgqKxFgLEe4jw==", + "requires": { + "@babel/runtime": "^7.6.3", + "csstype": "^2.6.7" + } + }, + "warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "requires": { + "loose-envify": "^1.0.0" + } + } + } + }, "react-reconciler": { "version": "0.24.0", "resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.24.0.tgz", @@ -13185,6 +13308,28 @@ "shallowequal": "^1.0.1" } }, + "react-transition-group": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.3.0.tgz", + "integrity": "sha512-1qRV1ZuVSdxPlPf4O8t7inxUGpdyO5zG9IoNfJxSO0ImU2A1YWkEQvFPuIPZmMLkg5hYs7vv5mMOyfgSkvAwvw==", + "requires": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + }, + "dependencies": { + "dom-helpers": { + "version": "5.1.3", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.1.3.tgz", + "integrity": "sha512-nZD1OtwfWGRBWlpANxacBEZrEuLa16o1nh7YopFWeoF68Zt8GGEmzHu6Xv4F3XaFIC+YXtTLrzgqKxFgLEe4jw==", + "requires": { + "@babel/runtime": "^7.6.3", + "csstype": "^2.6.7" + } + } + } + }, "read": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz", @@ -15408,6 +15553,17 @@ "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz", "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=" }, + "uncontrollable": { + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-7.1.1.tgz", + "integrity": "sha512-EcPYhot3uWTS3w00R32R2+vS8Vr53tttrvMj/yA1uYRhf8hbTG2GyugGqWDY0qIskxn0uTTojVd6wPYW9ZEf8Q==", + "requires": { + "@babel/runtime": "^7.6.3", + "@types/react": "^16.9.11", + "invariant": "^2.2.4", + "react-lifecycles-compat": "^3.0.4" + } + }, "unicode-canonical-property-names-ecmascript": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz", diff --git a/package.json b/package.json index dac7673..b4b9829 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "version": "0.1.0", "author": "Kyle Mathews ", "dependencies": { + "bootstrap": "^4.4.1", "gatsby": "^2.19.7", "gatsby-image": "^2.2.39", "gatsby-plugin-manifest": "^2.2.39", @@ -15,6 +16,7 @@ "gatsby-transformer-sharp": "^2.3.13", "prop-types": "^15.7.2", "react": "^16.12.0", + "react-bootstrap": "^1.0.0-beta.16", "react-dom": "^16.12.0", "react-helmet": "^5.2.1" }, diff --git a/src/components/call-to-action.js b/src/components/call-to-action.js new file mode 100644 index 0000000..6a3710d --- /dev/null +++ b/src/components/call-to-action.js @@ -0,0 +1,20 @@ +import React from 'react' +import Form from 'react-bootstrap/Form' +import Col from 'react-bootstrap/Col' +import Row from 'react-bootstrap/Row' +import Button from 'react-bootstrap/Button' + +const CallToAction = () => ( +
+ + Request a demo + + + + + + + +
+) +export default CallToAction diff --git a/src/components/head-line.js b/src/components/head-line.js new file mode 100644 index 0000000..424b43b --- /dev/null +++ b/src/components/head-line.js @@ -0,0 +1,9 @@ +import Jumbotron from 'react-bootstrap/Jumbotron' +import React from 'react'; + +const HeadLine = () =>( + +

Contingent Workforce Management

+ +) +export default HeadLine diff --git a/src/components/head-nav.js b/src/components/head-nav.js new file mode 100644 index 0000000..1872e6e --- /dev/null +++ b/src/components/head-nav.js @@ -0,0 +1,16 @@ +import Navbar from 'react-bootstrap/Navbar' +import Nav from 'react-bootstrap/Nav' +import React from 'react' + +const HeadNav = () => ( + + Lome + + +) +export default HeadNav diff --git a/src/components/industries.js b/src/components/industries.js new file mode 100644 index 0000000..95a472a --- /dev/null +++ b/src/components/industries.js @@ -0,0 +1,20 @@ +import React from 'react' +import Row from 'react-bootstrap/Row' +import Col from 'react-bootstrap/Col' +import Card from 'react-bootstrap/Card' + +const Industries =()=>( +
+ + Autonomous Vehicles + Academia + Defence + + + Healthcare + Finance + Retail + +
+) +export default Industries diff --git a/src/components/layout.js b/src/components/layout.js index 0359ea6..1cf21bf 100644 --- a/src/components/layout.js +++ b/src/components/layout.js @@ -11,7 +11,6 @@ import { useStaticQuery, graphql } from "gatsby" import Header from "./header" import "./layout.css" - const Layout = ({ children }) => { const data = useStaticQuery(graphql` query SiteTitleQuery { @@ -25,19 +24,13 @@ const Layout = ({ children }) => { return ( <> -
-
+ +
{children}
diff --git a/src/components/pricing.js b/src/components/pricing.js new file mode 100644 index 0000000..1d6fe75 --- /dev/null +++ b/src/components/pricing.js @@ -0,0 +1,35 @@ +import React from 'react' +import Card from 'react-bootstrap/Card' +import Col from 'react-bootstrap/Col' +import Row from 'react-bootstrap/Row' + +const Pricing = () => ( + + + + + $500 USD/Month + Data Analyst + + + + + + + $100 USD/Month + Vendor Relationship Manager + + + + + + + $1 USD/Month + Contingent Worker Dashboard + + + + +) + +export default Pricing diff --git a/src/components/value-prop.js b/src/components/value-prop.js new file mode 100644 index 0000000..35d7f63 --- /dev/null +++ b/src/components/value-prop.js @@ -0,0 +1,27 @@ +import React from 'react' +import Card from 'react-bootstrap/Card' +import Col from 'react-bootstrap/Col' +import Row from 'react-bootstrap/Row' + +const ValueProp = () => ( + +

Why Lome

 + + +
  • Reduce Administrative Overhead
    • +
  • Monitor throughput and Quality
    • +
  • Visualization Tools
    • +
  • Protect IP
    • + + +
  • Collect and track metrics
    • +
  • Track resource requests
    • +
  • Powerful auditing tools
    • +
  • Integrations
    • + + +     +     +) + +export default ValueProp diff --git a/src/pages/index.js b/src/pages/index.js index 7eb6257..14817f9 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -1,21 +1,33 @@ import React from "react" -import { Link } from "gatsby" - import Layout from "../components/layout" import Image from "../components/image" import SEO from "../components/seo" +import HeadLine from "../components/head-line" +import Industries from "../components/industries" +import ValueProp from "../components/value-prop" +import 'bootstrap/dist/css/bootstrap.min.css'; +import Container from 'react-bootstrap/Container' +import HeadNav from '../components/head-nav' +import CallToAction from '../components/call-to-action' +import Pricing from '../components/pricing' const IndexPage = () => ( - + -

    Hi people

    -

    Welcome to your new Gatsby site.

    -

    Now go build something great.

    -
    - -
    - Go to page 2 -     + + + + + + + + ) export default IndexPage