diff --git a/index.html b/index.html
index 77832ae..244729b 100644
--- a/index.html
+++ b/index.html
@@ -2,15 +2,18 @@
+
-
- output:
+ Enter number of pancakes to stack
+
+ Poof! 🍳
+
diff --git a/script.js b/script.js
index 6582e0d..f2dd22e 100644
--- a/script.js
+++ b/script.js
@@ -1,11 +1,27 @@
console.log("hello script js");
+var number;
+var count = "0";
+var pancake = "🥞";
+var clearPancake = " ";
var inputHappened = function(currentInput){
console.log( currentInput );
- display( "WOW SOMETHING HAPPENED" );
+ //create a p tag with id of addPancake
+ var addPancake = document.createElement("p");
+ number = parseInt(currentInput);
+ document.querySelector("#input").value = "";
+ for(count = 0; count < number; count++){
+ clearPancake = clearPancake + pancake;
+ }
+ console.log(clearPancake);
+ //append pancake to document body
+ addPancake.innerHTML = clearPancake;
+ document.getElementById("output").appendChild(addPancake);
+ clearPancake = " ";
};
-var display = function(stuffToDisplay){
- // your DOM manipulation code here
-
-};
+function myFunction() {
+ var stackedPancake = document.getElementById("output");
+ stackedPancake.remove();
+}
+
diff --git a/style.css b/style.css
index 282077b..cf46d3f 100644
--- a/style.css
+++ b/style.css
@@ -1,11 +1,30 @@
.starter{
- font-size:30px;
- padding:10px;
- display:block;
- margin:40px;
- border:3px solid blue;
+ font-size: 15px;
+ padding: 15px;
+ display: block;
+ margin: 40px;
+ border: 2px solid #0f80ff;
+ border-radius: 4px;
+}
+
+body {
+ font-size: 15px;
+ font-family: 'Varela Round', sans-serif;
+ text-indent: 40px;
}
#output{
- background-color:pink;
+ font-size: 30px;
+ padding: 5px;
+ border: none;
}
+
+.throwPancake{
+ font-family: 'Varela Round', sans-serif;
+ position: absolute;
+ top: 170px;
+ left: 180px;
+ background-color: #ffffff;
+ border-radius: 4px;
+ height: 25px;
+}
\ No newline at end of file