From 059a454f27be2a1ec504a506a55a411bce33b6cc Mon Sep 17 00:00:00 2001
From: Lillian Peterson <lpeterson333@gmail.com>
Date: Thu, 24 Oct 2019 20:34:29 -0400
Subject: [PATCH 1/3] added a song from Youtube

---
 src/App.js | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/App.js b/src/App.js
index 51fbe5a..3ebb8ea 100644
--- a/src/App.js
+++ b/src/App.js
@@ -44,6 +44,14 @@ const App = () => {
             />
               <h3>Added by: Gabriel Boorse</h3>
           </div>
+          <div className="card">
+            <YouTube
+              videoId="x94s6zPm1Ik"
+              opts={opts}
+              onReady={onReady}
+            />
+              <h3>Added by: Lillian Peterson</h3>
+          </div>
         </div>
       </div>
     )

From fefa6375d9edf37f1e74e5fa92e021312b8848c1 Mon Sep 17 00:00:00 2001
From: Zarela Graves <zarelavp@yahoo.com>
Date: Sun, 27 Oct 2019 01:34:14 -0400
Subject: [PATCH 2/3] Updates Netlifyand README file

---
 CONTRIBUTE.md |  1 +
 README.md     | 12 +++++++++---
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/CONTRIBUTE.md b/CONTRIBUTE.md
index 29a2000..6209b3e 100644
--- a/CONTRIBUTE.md
+++ b/CONTRIBUTE.md
@@ -9,6 +9,7 @@ Thank you for collaborating to our coders playlist.
 - Don't `push` to master only `pull` from git
 - Branch names: `name-of-your-feature`
 - Commit messages: Short description describing your action. Ex: `Adds new song to playlist`
+- Don't commit the `yarn.lock` file, unless you are installing dependencies to the project
 
 **IMPORTANT:** Please pull before you push
 
diff --git a/README.md b/README.md
index 689e13c..eda510e 100644
--- a/README.md
+++ b/README.md
@@ -1,13 +1,13 @@
 # 🎵 React Playlist 👩🏻‍💻👨🏻‍💻
 
-[![Netlify Status](https://api.netlify.com/api/v1/badges/0028ccc2-0db4-4c6a-bda2-1284d20add2d/deploy-status)](https://app.netlify.com/sites/determined-mcclintock-d5c5f5/deploys)
+[![Netlify Status](https://api.netlify.com/api/v1/badges/0f963293-9a8f-4143-9fda-df218c4bf78c/deploy-status)](https://app.netlify.com/sites/swfl-coders-playlist/deploys)
 
 Helps us build our future events playlist. You can either modify this app to give it a better look or simply add a new song.
 We all have a song that keeps up going. If you have to choose one, which one will be your favorite coding song?
 
 ## 🚀 Getting started
 
-1. **Pull down this repository.**
+1. **Pull down this repository**
 
    On terminal:
    For SSH
@@ -16,7 +16,7 @@ We all have a song that keeps up going. If you have to choose one, which one wil
    For HTTP
    `git clone https://github.com/swfl-coders/react-playlist.git`
 
-2. **Start developing.**
+2. **Start developing**
 
    Navigate into project and start up.
 
@@ -27,8 +27,14 @@ We all have a song that keeps up going. If you have to choose one, which one wil
    yarn start
    ```
 
+   **NOTE:** Please don't commit the `yarn.lock` file unless you are installing dependencies. Use `git status` to check if any changes have been made after you `yarn install`. Ff you see `yarn.lock` has changes, please checkout the file with `git checkout yarn.lock`.
+
 Open [http://localhost:3000](http://localhost:3000) to view it in the browser or might even open automatically.
 
+3. **Deployment**
+
+We are using **Netlify** for deployments. You can see the latest deploy version here: [SWFL Coders Playlist](https://swfl-coders-playlist.netlify.com/)
+
 This project created with:
 
 - [Create React App](https://github.com/facebook/create-react-app).

From 3636cb78c638b132502f94412ce277fdbb9341dd Mon Sep 17 00:00:00 2001
From: Zarela Graves <zarelavp@yahoo.com>
Date: Sun, 27 Oct 2019 02:45:07 -0400
Subject: [PATCH 3/3] Fixes playlist style

---
 src/App.css | 13 +++++++++----
 src/App.js  |  4 ++--
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/App.css b/src/App.css
index 6e7460a..5f1d265 100644
--- a/src/App.css
+++ b/src/App.css
@@ -2,15 +2,16 @@
   text-align: center;
   background-color: #282c34;
   min-height: 100vh;
+  width: 100%;
 }
 
 .App-header {
-  background-color: #282c34;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   font-size: calc(10px + 2vmin);
+  color: #34d3ac;
   color: white;
 }
 
@@ -19,12 +20,16 @@
 }
 
 .card {
-  padding: 2em;
+  padding: 1em;
+  border: solid 2px #34d3ac;
+  margin: 1em;
+  width: auto !important;
 }
 
 .cards-container {
   display: flex;
-  flex-direction: row;
-  align-items: center;
   justify-content: center;
+  flex-wrap: wrap;
+  flex-direction: row;
+  color: white;
 }
diff --git a/src/App.js b/src/App.js
index 3ebb8ea..ce5175a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -10,14 +10,14 @@ const App = () => {
   const opts = {
     width: '500',
     playerVars: { // https://developers.google.com/youtube/player_parameters
-      autoplay: 0
+      autoplay: 0,
     }
   }
 
     return (
       <div className="App">
         <header className="App-header">
-          <p>SWFL Coders Playlist</p>
+          <h3>SWFL Coders Playlist</h3>
         </header>
         <div className="cards-container">
           <div className="card">