laid out some very basic components, the tile component still needs to be worked upon

4 files changed, 50 insertions, 0 deletions

diff --git a/src/components/Views/Home.css b/src/components/Views/Home.css
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/components/Views/Home.css
diff --git a/src/components/Views/Home/Home.css b/src/components/Views/Home/Home.css
new file mode 100644
index 0000000..4f5cb8d
--- /dev/null
+++ b/src/components/Views/Home/Home.css
@@ -0,0 +1,17 @@
+@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@500&display=swap");
+/* Experimental color scheme */
+.view {
+  width: 80%;
+  margin: 2rem auto; }
+
+.view {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: center; }
+
+.tile {
+  width: 5rem;
+  height: 5rem;
+  border: 1px dashed #000000;
+  margin: 1rem; }
diff --git a/src/components/Views/Home/Home.js b/src/components/Views/Home/Home.js
new file mode 100644
index 0000000..51c4c4f
--- /dev/null
+++ b/src/components/Views/Home/Home.js
@@ -0,0 +1,16 @@
+import React from "react";
+// import React, { useState } from "react";
+import "./Home.css";
+
+const HomeView = (procs) => {
+	const tileHeight = procs.height;
+	const tileWidth = procs.width;
+	// const [activeLink, updateActiveLink] = useState("home")
+	return (
+		<div className={"view"}>
+			<div className={"tile"}></div>
+		</div>
+	)
+}
+
+export default HomeView
diff --git a/src/components/Views/Home/Home.scss b/src/components/Views/Home/Home.scss
new file mode 100644
index 0000000..54a5ad7
--- /dev/null
+++ b/src/components/Views/Home/Home.scss
@@ -0,0 +1,17 @@
+@import "../../../styles/theme";
+@import "../../../styles/view";
+
+.view {
+	display: flex;
+	flex-direction: row;
+	flex-wrap: wrap;
+	justify-content: center;;
+}
+
+.tile {
+	width: 5rem;
+	height: 5rem;
+
+	border: 1px dashed $defFG;
+	margin: 1rem;
+}