Merge pull request #1 from trechriron/trentin-basic-layout-v1

Basic structure including inline styles for our basic layout.

src/App/DevForm.jsx

@@ -0,0 +1,27 @@
+const devStyles = {
+    header: {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        height: "100%",
+        width: "100%",
+        fontSize: "2rem",
+    },
+    body: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "center",
+        alignItems: "center",
+        height: "300px",
+        width: "100%",
+    },
+  };
+
+return (
+    <div>
+        <Widget src="monkeypatcher.near/App.Header" trust={{ mode: "trusted-author" }} />
+        <h1 style={devStyles.header}>DEV FORM</h1>
+        <div style={devStyles.body}></div>
+        <div><Widget src="monkeypatcher.near/App.Footer" trust={{ mode: "trusted-author" }} /></div>
+    </div>
+);

src/App/DevResultPage.jsx

@@ -0,0 +1,28 @@
+const devResultStyles = {
+    header: {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        height: "100%",
+        width: "100%",
+        fontSize: "2rem",
+    },
+    body: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "center",
+        alignItems: "center",
+        height: "300px",
+        width: "100%",
+    },
+  };
+
+return (
+    <div>
+        <Widget src="monkeypatcher.near/App.Header" trust={{ mode: "trusted-author" }} />
+        <h1 style={devResultStyles.header}>DEV RESULT</h1>
+        <p>Result line graph from data for dev usage.</p>
+        <div><Widget src="monkeypatcher.near/App.Footer" trust={{ mode: "trusted-author" }} /></div>
+    </div>
+
+)

src/App/Footer.jsx

@@ -0,0 +1,32 @@
+const footerStyles = {
+    row: {
+        display: "flex",
+        flexDirection: "row",
+        justifyContent: "space-around",
+        alignItems: "center",
+        padding: "10px",
+        backgroundColor: 'black',
+        color: 'white',
+    },
+    column: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "space-around",
+    },
+}
+
+return (
+    <div>
+        <div style={footerStyles.row}>
+        <div style={footerStyles.column}>
+            <a href="/monkeypatcher.near/scc">HOME</a>
+        </div>
+        <div style={footerStyles.column}>
+            <a href="/monkeypatcher.near/App.ProviderForm">PROVIDER FORM</a>
+        </div>
+        <div style={footerStyles.column}>
+            <a href="/monkeypatcher.near/App.DevForm" >DEVELOPER FORM</a>
+        </div>
+        </div>
+    </div>
+);

src/App/Header.jsx

@@ -0,0 +1,32 @@
+const headerStyles = {
+    header: {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        height: "100%",
+        width: "100%",
+        fontSize: "2rem",
+    },
+    row: {
+        display: "flex",
+        flexDirection: "row",
+        justifyContent: "space-around",
+        alignItems: "center",
+        padding: "10px",
+        backgroundColor: 'black',
+        color: 'white',
+    },
+    column: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "space-around",
+    },
+}
+
+return (
+    <div>
+        <div style={headerStyles.row}>
+        <h1 style={headerStyles.header}>BOS Services Calculator</h1>
+        </div>
+    </div>
+);

src/App/ProviderForm.jsx

@@ -0,0 +1,28 @@
+const providerStyles = {
+    header: {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        height: "100%",
+        width: "100%",
+        fontSize: "2rem",
+    },
+    body: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "center",
+        alignItems: "center",
+        height: "300px",
+        width: "100%",
+    },
+  };
+
+return (
+    <div>
+        <Widget src="monkeypatcher.near/App.Header" trust={{ mode: "trusted-author" }} />
+        <h1 style={providerStyles.header}>PROVIDER FORM</h1>
+        <div style={providerStyles.body}></div>
+        <div><Widget src="monkeypatcher.near/App.Footer" trust={{ mode: "trusted-author" }} /></div>
+    </div>
+);
+ß

src/App/ProviderResultPage.jsx

@@ -0,0 +1,28 @@
+const providerResultStyles = {
+  header: {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      height: "100%",
+      width: "100%",
+      fontSize: "2rem",
+  },
+  body: {
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center",
+      height: "300px",
+      width: "100%",
+  },
+};
+
+
+return (
+  <div>
+    <Widget src="monkeypatcher.near/App.Header" trust={{ mode: "trusted-author" }} />
+    <h1 style={providerResultStyles.header}>PROVIDER RESULT</h1>
+    <p>Result line graph and info for provider form data.</p>
+    <div><Widget src="monkeypatcher.near/App.Footer" trust={{ mode: "trusted-author" }} /></div>
+  </div>
+);

src/scc.jsx

@@ -0,0 +1,31 @@
+const sccStyles = {
+    row: {
+        display: "flex",
+        flexDirection: "row",
+        justifyContent: "space-around",
+        alignItems: "center",
+        padding: "10px",
+    },
+    column: {
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "space-around",
+    },
+};
+
+// <Widget src="monkeypatcher.near/App.DevForm" trust={{ mode: "trusted-author" }} />
+
+return (
+    <div>
+        <Widget src="monkeypatcher.near/App.Header" trust={{ mode: "trusted-author" }} />
+        <div style={sccStyles.row}></div>
+        <div style={sccStyles.row}>
+            <div style={sccStyles.column}>
+                <a href="/monkeypatcher.near/App.ProviderForm">I want to be a Provider of Services</a>
+            </div>
+            <div style={sccStyles.column}>
+                <a href="/monkeypatcher.near/App.DevForm" >I want to develop an app on the BOS</a>
+            </div>
+        </div>
+    </div>
+);