Dansive Studio (HTML 5 edit)

by Daniel Hall

HTML

<!DOCTYPE html>
<html>
 <i class="bts bt-pencil"></i>Save</a> 
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-touch-fullscreen" content="yes" /><body bgcolor = "black">
<button id="replaceButton">RUN</button>
<div id="inputWords">
 <ul>
   <li>
<a style="color: green">HTML</a>
      <textarea style="font-size: 3.9em; color: LightBlue; background-color: black;" id="adj1"></textarea>
     
      </li>
      <!-- put other input fields here -->
      
      </ul>
</div>
<div id="story" style="boder: 2px black solid; background: white;">

</div>

      </body>
<script>
var replaceButton = document
   .getElementById("replaceButton");
replaceButton.addEventListener("click",replaceIt);

function replaceIt() {
    var storyDiv = document.getElementById("story");
    var adj1 = "<span class='replacement'>"+ document
   .getElementById("adj1").value + "</span>";
     /* Insert  more varible definitions here */
     var  theStory = "<h1>Result</h1>";
     theStory += "" + adj1 + "";
     /* Put the the story here, using the +=
    operator */
     storyDiv.innerHTML = theStory;
}
</script>
<style>
story {
position: fixed;
left: 0%;
	  width: 300%;
	  height: 300%;
	  top: 30%;
         background-color: white;
}
#replaceButton {
position: absolute;
width: 8%;
height: 4%;
background-color: blue;
}

#textarea {
position: absolute;
top: 20%;
width: 30%;
height: 30%;
left: 5%;
}
</style>
 <!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> --></html>

CSS

body { 
  background-color: #454455;
}