From 0bd29f3dd310ede6a8581c509d0788b2a385b5cc Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Wed, 15 Jul 2020 17:43:59 -0500
Subject: [PATCH 1/9] first half with vowels running

---
 main.js | 36 ++++++++++++++++++++++++++++++++++--
 1 file changed, 34 insertions(+), 2 deletions(-)

diff --git a/main.js b/main.js
index 1c92f304..32854c6d 100644
--- a/main.js
+++ b/main.js
@@ -12,14 +12,46 @@ const rl = readline.createInterface({
 
 
 const pigLatin = (word) => {
+  let finalWord = "" ;
+  let cleanWord = word.toLowerCase().trim()
+  let vowels = ['a', 'e', 'i', 'o', 'u'] ;
+   if (vowels.indexOf(cleanWord[0]) > -1) {
+     finalWord = cleanWord + "yay";
+     return finalWord;
+   } 
+  //  else {
+  //    let firstWord = word.match(/[aeiou]/g) || 0;
+  //    let vowel = word.indexOf(firstWord[0]);
+  //    finalWord = word.substring(vowel) + word.substring(0,vowel) + "ay";
+  //    return finalWord ;
+   
 
-  // Your code here
+  // {
+  //  let finalWord = word.match(/[a,e,i,o,u]/g) 
+ 
 
-}
+console.log(pigLatin('anana')) 
+
+   
+
+// if word begins with consonant
+// list the vowels: a, e, i, o, u **
+// run through string until we find the first vowel
+// identify index position, store and use
+// store sound before vowel in a variable (bucket)
+
+// splice out 'y' (first sound)
+// concat/push 'y' (first sound) to end
+
+//  concat 'ay' to the end
+
+  }
 
 // the first function called in the program to get an input from the user
 // to run the function use the command: node main.js
 // to close it ctrl + C
+
+
 const getPrompt = () => {
   rl.question('word ', (answer) => {
     console.log( pigLatin(answer) );

From 7007210b3e4b7d4ad16e09cc4374c48a79a35f62 Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Wed, 15 Jul 2020 18:31:48 -0500
Subject: [PATCH 2/9] finished it baby

---
 main.js | 33 +++++++++++++++------------------
 1 file changed, 15 insertions(+), 18 deletions(-)

diff --git a/main.js b/main.js
index 32854c6d..940f6dc2 100644
--- a/main.js
+++ b/main.js
@@ -11,26 +11,23 @@ const rl = readline.createInterface({
 });
 
 
+
 const pigLatin = (word) => {
-  let finalWord = "" ;
+  let vowels = ['a', 'e', 'i', 'o', 'u'];
+  let finalWord = "";
   let cleanWord = word.toLowerCase().trim()
-  let vowels = ['a', 'e', 'i', 'o', 'u'] ;
-   if (vowels.indexOf(cleanWord[0]) > -1) {
-     finalWord = cleanWord + "yay";
-     return finalWord;
-   } 
-  //  else {
-  //    let firstWord = word.match(/[aeiou]/g) || 0;
-  //    let vowel = word.indexOf(firstWord[0]);
-  //    finalWord = word.substring(vowel) + word.substring(0,vowel) + "ay";
-  //    return finalWord ;
-   
-
-  // {
-  //  let finalWord = word.match(/[a,e,i,o,u]/g) 
- 
+  if (vowels.indexOf(cleanWord[0]) > -1) {
+      finalWord = cleanWord + "yay";
+      return finalWord;
+  } else {
+      let firstMatch = cleanWord.match(/[aeiou]/g) || 0;
+      let vowel = cleanWord.indexOf(firstMatch[0]);
+      finalWord = cleanWord.substring(vowel) + cleanWord.substring(0, vowel) + "ay";
+      return finalWord;
+  }
+}
 
-console.log(pigLatin('anana')) 
+console.log(pigLatin('Blabama'))
 
    
 
@@ -45,7 +42,7 @@ console.log(pigLatin('anana'))
 
 //  concat 'ay' to the end
 
-  }
+
 
 // the first function called in the program to get an input from the user
 // to run the function use the command: node main.js

From 29155e903b3d831291655dfd0a1062fb21e32d3f Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Wed, 15 Jul 2020 18:48:15 -0500
Subject: [PATCH 3/9] some comments

---
 main.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/main.js b/main.js
index 940f6dc2..beb00e12 100644
--- a/main.js
+++ b/main.js
@@ -20,14 +20,15 @@ const pigLatin = (word) => {
       finalWord = cleanWord + "yay";
       return finalWord;
   } else {
+    // we used a regex BOOM
       let firstMatch = cleanWord.match(/[aeiou]/g) || 0;
-      let vowel = cleanWord.indexOf(firstMatch[0]);
-      finalWord = cleanWord.substring(vowel) + cleanWord.substring(0, vowel) + "ay";
+      let vowelIndex = cleanWord.indexOf(firstMatch[0]);
+      finalWord = cleanWord.substring(vowelIndex) + cleanWord.substring(0, vowelIndex) + "ay";
       return finalWord;
   }
 }
 
-console.log(pigLatin('Blabama'))
+console.log(pigLatin('Alabama'))
 
    
 

From cd4d2db4bb77c118710a17e89f3d50138a4f937a Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Mon, 20 Jul 2020 17:59:23 -0500
Subject: [PATCH 4/9] created html element in javascript

---
 dom-main.js | 31 +++++++++++++++++++++++++++++++
 index.html  | 10 ++++++----
 2 files changed, 37 insertions(+), 4 deletions(-)
 create mode 100644 dom-main.js

diff --git a/dom-main.js b/dom-main.js
new file mode 100644
index 00000000..7d27e716
--- /dev/null
+++ b/dom-main.js
@@ -0,0 +1,31 @@
+let value = "";
+
+const storeString = (valA) => {
+    value = valA
+   }
+ 
+const displayTranslation = (translatedWord) => {
+    var newDiv = document.createElement("P");              
+    newDiv.innerText = (translatedWord);               
+    document.body.appendChild(newDiv);
+}
+
+const pigLatin = () => {
+    let vowels = ['a', 'e', 'i', 'o', 'u'];
+    let finalWord = "";
+    let cleanWord = value.toLowerCase().trim()
+    if (vowels.indexOf(cleanWord[0]) > -1) {
+        finalWord = cleanWord + "yay";
+        return displayTranslation(finalWord)
+    } else {
+        let firstMatch = cleanWord.match(/[aeiou]/g) || 0;
+        let vowelIndex = cleanWord.indexOf(firstMatch[0]);
+        finalWord = cleanWord.substring(vowelIndex) + cleanWord.substring(0, vowelIndex) + "ay";
+        return displayTranslation(finalWord)
+    }
+  }
+  
+
+
+  
+//   console.log(pigLatin('Alabama'))
\ No newline at end of file
diff --git a/index.html b/index.html
index 8f536de8..fffe2999 100644
--- a/index.html
+++ b/index.html
@@ -2,14 +2,16 @@
 <html>
   <head>
     <meta charset="utf-8">
-    <title></title>
-    <script src="main.js"></script>
+    <title>Pig Latin</title>
   </head>
   <body>
-    <h1>Hello World!</h1>
+    <h1>Let's do Pig Latin Stuff!</h1>
     <hr/>
     <div id="display-element"></div>
-    <button onclick="displayDate()">Click Me</button>
+    <input type="text" id="stringInput" value="" placeholder="Type a word!" oninput="storeString(this.value)"></input>
+    <button onclick="pigLatin()">get piggy!</button>
+    <!-- <div id="results"></div> -->
     <hr/>
+    <script src="dom-main.js"></script>
   </body>
 </html>

From b537846ccf8ee02497df0ceb9d6ba5874db2686c Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Mon, 20 Jul 2020 22:24:29 -0500
Subject: [PATCH 5/9] word reset

---
 dom-main.js | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/dom-main.js b/dom-main.js
index 7d27e716..5de89b87 100644
--- a/dom-main.js
+++ b/dom-main.js
@@ -4,11 +4,23 @@ const storeString = (valA) => {
     value = valA
    }
  
+// const displayTranslation = (translatedWord) => {
+//     var newDiv = document.createElement("P");              
+//     newDiv.innerText = (translatedWord);               
+//     document.body.appendChild(newDiv);
+// }
+
 const displayTranslation = (translatedWord) => {
-    var newDiv = document.createElement("P");              
-    newDiv.innerText = (translatedWord);               
+    var newDiv = document.createElement("P");
+    newDiv.innerText = (translatedWord);
+    newDiv.id = "pigLatinResult";
     document.body.appendChild(newDiv);
-}
+    
+    //replace previous word upon new button click
+    let previousWord = document.getElementById("pigLatinResult");
+    let parentDiv = previousWord.parentNode;
+    parentDiv.replaceChild(newDiv, previousWord);
+    }
 
 const pigLatin = () => {
     let vowels = ['a', 'e', 'i', 'o', 'u'];

From e7612cf410f0223e170057e743ea5c75e38561ca Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Wed, 16 Dec 2020 18:15:17 -0600
Subject: [PATCH 6/9] pig latin touch up

---
 index.html   | 59 +++++++++++++++++++++++++++++++++++++++-------------
 package.json |  3 ++-
 prettierrc   |  0
 3 files changed, 46 insertions(+), 16 deletions(-)
 create mode 100644 prettierrc

diff --git a/index.html b/index.html
index fffe2999..10ca8d3f 100644
--- a/index.html
+++ b/index.html
@@ -1,17 +1,46 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <meta charset="utf-8">
-    <title>Pig Latin</title>
-  </head>
-  <body>
-    <h1>Let's do Pig Latin Stuff!</h1>
-    <hr/>
-    <div id="display-element"></div>
-    <input type="text" id="stringInput" value="" placeholder="Type a word!" oninput="storeString(this.value)"></input>
-    <button onclick="pigLatin()">get piggy!</button>
-    <!-- <div id="results"></div> -->
-    <hr/>
-    <script src="dom-main.js"></script>
-  </body>
-</html>
+
+<head>
+  <meta charset="utf-8">
+  <!-- CSS only -->
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet"
+    integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
+  <link rel="preconnect" href="https://fonts.gstatic.com">
+  <link href="https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap" rel="stylesheet">
+  <title>Pig Latin</title>
+  <style>
+    body {
+      background-color: linen;
+      font-family: 'Playfair Display', serif;
+    }
+
+    p {
+      font-size: 50px;
+    }
+  </style>
+</head>
+
+<body style="text-align: center; background-color: #88A078;">
+  <div class="card" style="width: 30rem; border-radius: 5px;">
+    <img
+      src="https://images.unsplash.com/photo-1580682777666-24a7b3024e24?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1650&q=80"
+      class="card-img-top" alt="...">
+    <div class="card-body">
+      <h1>Pig Latinator</h1>
+      <h5 class="card-text">Pig Latin is not actually a language but a language game used to speak “in code.” Pig Latin
+        words are formed by altering
+        words in English.</h5>
+      <hr />
+      <div id="display-element"></div>
+      <input class="input-group-text" id="inputGroup-sizing-default" style="width: 450px;" id="stringInput" value=""
+        placeholder="Type in a word!" oninput="storeString(this.value)"></input>
+      <br>
+      <button type="button" style="width: 200px;" class="btn btn-outline-info" onclick="pigLatin()">Translate</button>
+    </div>
+  </div>
+  <script src="dom-main.js"></script>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/package.json b/package.json
index 3afb478f..66aebab9 100644
--- a/package.json
+++ b/package.json
@@ -27,6 +27,7 @@
     "jsdom": "^11.6.2",
     "mocha": "^5.0.0",
     "postcss-html": "^0.34.0",
-    "stylelint": "^7.13.0"
+    "stylelint": "^7.13.0",
+    "tailwindcss": "^2.0.2"
   }
 }
diff --git a/prettierrc b/prettierrc
new file mode 100644
index 00000000..e69de29b

From e0b7afa66980bd42d852065320b81a225db1e05d Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Wed, 16 Dec 2020 18:19:36 -0600
Subject: [PATCH 7/9] prettier

---
 prettierrc => .prettierrc |  0
 dom-main.js               | 62 +++++++++++++++++++--------------------
 index.html                |  5 ++++
 3 files changed, 36 insertions(+), 31 deletions(-)
 rename prettierrc => .prettierrc (100%)

diff --git a/prettierrc b/.prettierrc
similarity index 100%
rename from prettierrc
rename to .prettierrc
diff --git a/dom-main.js b/dom-main.js
index 5de89b87..00bfe707 100644
--- a/dom-main.js
+++ b/dom-main.js
@@ -1,43 +1,43 @@
 let value = "";
 
 const storeString = (valA) => {
-    value = valA
-   }
- 
+  value = valA;
+};
+
 // const displayTranslation = (translatedWord) => {
-//     var newDiv = document.createElement("P");              
-//     newDiv.innerText = (translatedWord);               
+//     var newDiv = document.createElement("P");
+//     newDiv.innerText = (translatedWord);
 //     document.body.appendChild(newDiv);
 // }
 
 const displayTranslation = (translatedWord) => {
-    var newDiv = document.createElement("P");
-    newDiv.innerText = (translatedWord);
-    newDiv.id = "pigLatinResult";
-    document.body.appendChild(newDiv);
-    
-    //replace previous word upon new button click
-    let previousWord = document.getElementById("pigLatinResult");
-    let parentDiv = previousWord.parentNode;
-    parentDiv.replaceChild(newDiv, previousWord);
-    }
+  var newDiv = document.createElement("P");
+  newDiv.innerText = translatedWord;
+  newDiv.id = "pigLatinResult";
+  document.body.appendChild(newDiv);
+
+  //replace previous word upon new button click
+  let previousWord = document.getElementById("pigLatinResult");
+  let parentDiv = previousWord.parentNode;
+  parentDiv.replaceChild(newDiv, previousWord);
+};
 
 const pigLatin = () => {
-    let vowels = ['a', 'e', 'i', 'o', 'u'];
-    let finalWord = "";
-    let cleanWord = value.toLowerCase().trim()
-    if (vowels.indexOf(cleanWord[0]) > -1) {
-        finalWord = cleanWord + "yay";
-        return displayTranslation(finalWord)
-    } else {
-        let firstMatch = cleanWord.match(/[aeiou]/g) || 0;
-        let vowelIndex = cleanWord.indexOf(firstMatch[0]);
-        finalWord = cleanWord.substring(vowelIndex) + cleanWord.substring(0, vowelIndex) + "ay";
-        return displayTranslation(finalWord)
-    }
+  let vowels = ["a", "e", "i", "o", "u"];
+  let finalWord = "";
+  let cleanWord = value.toLowerCase().trim();
+  if (vowels.indexOf(cleanWord[0]) > -1) {
+    finalWord = cleanWord + "yay";
+    return displayTranslation(finalWord);
+  } else {
+    let firstMatch = cleanWord.match(/[aeiou]/g) || 0;
+    let vowelIndex = cleanWord.indexOf(firstMatch[0]);
+    finalWord =
+      cleanWord.substring(vowelIndex) +
+      cleanWord.substring(0, vowelIndex) +
+      "ay";
+    return displayTranslation(finalWord);
   }
-  
-
+};
 
-  
-//   console.log(pigLatin('Alabama'))
\ No newline at end of file
+//   console.log(pigLatin('Alabama'))
diff --git a/index.html b/index.html
index 10ca8d3f..416db760 100644
--- a/index.html
+++ b/index.html
@@ -13,10 +13,15 @@
     body {
       background-color: linen;
       font-family: 'Playfair Display', serif;
+      margin: auto;
+      width: 50%;
+      padding: 10px;
     }
 
     p {
       font-size: 50px;
+      background-color: white;
+      border: 2px solid #88A078;
     }
   </style>
 </head>

From 577d22dde06cc5c4931e9fb178ce78f8591312fd Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Wed, 16 Dec 2020 18:27:55 -0600
Subject: [PATCH 8/9] styled this little game a bit

---
 index.html | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index 416db760..f53295ec 100644
--- a/index.html
+++ b/index.html
@@ -11,7 +11,6 @@
   <title>Pig Latin</title>
   <style>
     body {
-      background-color: linen;
       font-family: 'Playfair Display', serif;
       margin: auto;
       width: 50%;
@@ -19,9 +18,15 @@
     }
 
     p {
-      font-size: 50px;
+      font-size: 30px;
       background-color: white;
-      border: 2px solid #88A078;
+      border: 3px solid #12CAF0;
+      position: absolute;
+      top: 30%;
+      left: 47%;
+      transform: translate(-50%, -50%);
+      padding: 15px;
+      border-radius: 5px;
     }
   </style>
 </head>
@@ -32,7 +37,7 @@
       src="https://images.unsplash.com/photo-1580682777666-24a7b3024e24?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1650&q=80"
       class="card-img-top" alt="...">
     <div class="card-body">
-      <h1>Pig Latinator</h1>
+      <h1>Pig Latin-ator</h1>
       <h5 class="card-text">Pig Latin is not actually a language but a language game used to speak “in code.” Pig Latin
         words are formed by altering
         words in English.</h5>

From 05e941b1eda33535c410872d9cb074d28c0052bc Mon Sep 17 00:00:00 2001
From: destinyfsetzer <54375774+destinyfsetzer@users.noreply.github.com>
Date: Wed, 16 Dec 2020 18:30:28 -0600
Subject: [PATCH 9/9] pig latin ftw

---
 index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/index.html b/index.html
index f53295ec..698378cf 100644
--- a/index.html
+++ b/index.html
@@ -14,7 +14,7 @@
       font-family: 'Playfair Display', serif;
       margin: auto;
       width: 50%;
-      padding: 10px;
+      padding: 20px;
     }
 
     p {