navBar and Home basics done

Author: Kyler-Chiago

mlflow-site/src/app/components/Button.tsx

@@ -1,7 +1,26 @@
+'use client';
+
 const Button = () => {
-    return (
-      <div className='button'>Button</div>
-    )
-  }
-  
-  export default Button
+  return (
+    <div className='button'>
+      <button
+        onClick={() => {
+          window.location.assign('https://github.com/oslabs-beta/mlflow-js');
+        }}
+        className='homeButton homeButtonDownload text-white'
+      >
+        Download
+      </button>
+      <button
+        onClick={() => {
+          window.location.assign('https://github.com/oslabs-beta/mlflow-js');
+        }}
+        className='homeButton homeButtonRead'
+      >
+        Read the Docs
+      </button>
+    </div>
+  );
+};
+
+export default Button;

mlflow-site/src/app/globals.css

@@ -138,7 +138,7 @@ body {
   grid-row: 3;
   width: 100%;
   height: 100%;
-  background-color: aqua;
+  /* background-color: aqua; */
 }
 
 .team {
@@ -161,9 +161,26 @@ body {
   /* background-color: rgb(102, 102, 54); */
 }
 
+.homeButton {
+  padding: 3px;
+  padding-left: 6px;
+  padding-right: 6px;
+  border-radius: 5px;
+  font-size: 0.8rem;
+  margin-right: 8px;
+}
+
+.homeButtonDownload {
+  background-color: rgb(66, 107, 31);
+}
+
+.homeButtonRead {
+  background-color: rgb(204, 204, 204);
+}
+
 .button {
   width: 100%;
-  background-color: rgb(14, 69, 129);
+  /* background-color: rgb(14, 69, 129); */
 }
 
 .features {