From 89b487e8ff52928f7d462ff392250d5805b03ca6 Mon Sep 17 00:00:00 2001
From: unknown <lindsay.kelly15@gmail.com>
Date: Wed, 22 Dec 2021 14:59:42 -0500
Subject: [PATCH] styling for homepage done

---
 front-end/src/App.js              |  1 +
 front-end/src/components/Home.js  | 17 ++++++++++++++-
 front-end/src/components/Login.js |  1 +
 front-end/src/index.css           | 35 +++++++++++++++++++++++++++++--
 4 files changed, 51 insertions(+), 3 deletions(-)

diff --git a/front-end/src/App.js b/front-end/src/App.js
index 8d15298..aac191a 100644
--- a/front-end/src/App.js
+++ b/front-end/src/App.js
@@ -7,6 +7,7 @@ import axios from 'axios';
 import Home from './components/Home';
 import Plant from './components/Plant';
 import PlantList from './components/PlantList';
+import Login from './components/Login';
 
 const initialFormValues = {
   nickname: '',
diff --git a/front-end/src/components/Home.js b/front-end/src/components/Home.js
index be5e61c..f0e4b5c 100644
--- a/front-end/src/components/Home.js
+++ b/front-end/src/components/Home.js
@@ -8,7 +8,22 @@ export default function Home() {
 
 
 return(
-<h1>is home rendering?</h1>
+    <div className='home-container'>
+        <h2>Never kill a plant again (hopefully)</h2>
+        <img src="https://rem-stroitelstvo.ru/wp-content/uploads/2017/02/skandi22.jpg" />
+
+        <p>Ok, so we can’t really guarantee you won’t kill your houseplants. <br></br>Plants have different needs and react to sunlight, water, and fertilizer in a variety of ways. Learn about their needs and you might be able to stop the damage in time. Use a little extra TLC, and they might even <i>flourish</i>.</p>
+
+        <p>Not sure where to start? <br></br>Our app is here to help you figure out what your plants need and how you can nurture them.</p>
+
+        <h2>Identify Your Plant</h2>
+        <p>Manually enter your plant babies' species into the app and you'll get a brief description of what your plants should look like when they're healthy, care instructions with their water and light preferences, as well as a list of common issues that cause them to fall ill.</p>
+
+        <h2>Smart Tracking</h2>
+        <p>By logging the different species of plants you have at home, you can manually keep track of the light intensity of the room in which they're placed and <b>get push notifications</b> about when you should water them based on the weather in your area.</p>
+        <h4></h4>
+    </div>
+
 )
 
 }
diff --git a/front-end/src/components/Login.js b/front-end/src/components/Login.js
index e69de29..8b13789 100644
--- a/front-end/src/components/Login.js
+++ b/front-end/src/components/Login.js
@@ -0,0 +1 @@
+
diff --git a/front-end/src/index.css b/front-end/src/index.css
index 25ea6c7..87a8c1b 100644
--- a/front-end/src/index.css
+++ b/front-end/src/index.css
@@ -5,6 +5,8 @@ body {
     sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  background-color: #cebdb3;
+  /* background-image: url("https://images.pexels.com/photos/2266845/pexels-photo-2266845.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940"); */
 }
 
 code {
@@ -15,7 +17,10 @@ code {
 nav {
   display: flex;
   justify-content: space-evenly;
-  margin-bottom: 1%;
+  margin: 1% 20%;
+  border: 2px solid black;
+  padding: 0.5%;
+  border-radius: 12px;
 }
 
 nav a {
@@ -27,6 +32,31 @@ nav a:hover {
   font-weight: bold;
 }
 
+header {
+  color: #485a36;
+  font-weight: bold;
+}
+
+/* HOMEPAGE STYLING */
+.home-container {
+  max-width: 68%;
+  margin: auto;
+}
+
+.home-container img {
+  width: 825px;
+  height: 407px;
+  border: 2px solid black;
+  border-radius: 3px;
+  opacity: 0.85;
+}
+
+.home-container h2 {
+  color: #485a36;
+  font-style: italic;
+}
+
+/* PLANTLIST STYLING */
 #plant-form {
   background-image: url("https://images.pexels.com/photos/4503823/pexels-photo-4503823.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940");
   background-repeat: no-repeat;
@@ -89,4 +119,5 @@ button:hover {
   background-color: #dde6ce;
   opacity: 0.95;
   border: 2px solid rgb(61, 61, 61);
-}
\ No newline at end of file
+}
+