adds title page to html

index.html

@@ -11,7 +11,7 @@
 
 <tw-story></tw-story>
 
-<tw-storydata name="PrizePotions" startnode="11" creator="Twine" creator-version="2.3.5" ifid="C441354D-704C-4777-A367-AE1B6A18021A" zoom="1" format="Harlowe" format-version="3.1.0" options="" hidden><style role="stylesheet" id="twine-user-stylesheet" type="text/twine-css">@import url(https://fonts.googleapis.com/css?family=Comfortaa);
+<tw-storydata name="PrizePotions" startnode="16" creator="Twine" creator-version="2.3.5" ifid="C441354D-704C-4777-A367-AE1B6A18021A" zoom="1" format="Harlowe" format-version="3.1.0" options="" hidden><style role="stylesheet" id="twine-user-stylesheet" type="text/twine-css">@import url(https://fonts.googleapis.com/css?family=Comfortaa);
 
 body, tw-story
 {
@@ -46,7 +46,7 @@ tw-link.visited:hover
 }
 
 
-</style><script role="script" id="twine-user-script" type="text/twine-javascript"></script><tw-passagedata pid="1" name="Start" tags="" position="435,345" size="100,100">(text-color: &quot;black&quot;)[&quot;**Alright! Let&#39;s play a game!**&quot; They announce cheerily.]
+</style><script role="script" id="twine-user-script" type="text/twine-javascript"></script><tw-passagedata pid="1" name="Start" tags="" position="412,347" size="100,100">(text-color: &quot;black&quot;)[&quot;**Alright! Let&#39;s play a game!**&quot; They announce cheerily.]
 [&quot;Today you will be trying to win a //good potion//!&quot; The game itself it very easy. I learned it from a man named Monty Hall.&quot;]
 
 [&quot;Would you like to hear the rules?&quot;]
@@ -64,7 +64,7 @@ tw-link.visited:hover
 (if: $purplebag is &quot;bad potion&quot; and $orangebag is &quot;good potion&quot;)[(set: $greenbag to &quot;bad potion&quot;)]
 
 (set: $switched to &quot;false&quot;)
-</tw-passagedata><tw-passagedata pid="2" name="Yes! Please explain them to me." tags="" position="927,294" size="100,100">[&quot;Alright! You are going to see three bags,&quot; they gesture at the three bags in front of them.]
+</tw-passagedata><tw-passagedata pid="2" name="Yes! Please explain them to me." tags="" position="926,278" size="100,100">[&quot;Alright! You are going to see three bags,&quot; they gesture at the three bags in front of them.]
 
 [&lt;img src=&quot;https://i.imgur.com/6JYHB1y.png&quot; alt=&quot;purple bag shut&quot; height=&quot;250&quot; width=&quot;300&quot; /&gt; &lt;img src=&quot;https://i.imgur.com/cV1W71R.png&quot; alt=&quot;purple bag shut&quot; height=&quot;250&quot; width=&quot;300&quot; /&gt; &lt;img src=&quot;https://i.imgur.com/f7l3t11.png&quot; alt=&quot;purple bag shut&quot; height=&quot;250&quot; width=&quot;300&quot; /&gt;]
 
@@ -84,7 +84,7 @@ tw-link.visited:hover
 
 
 [[Yeah, let&#39;s get this started!-&gt;No, I already know how this works.]]
-[[I changed my mind. I&#39;d rather not play.-&gt;You decline.]]</tw-passagedata><tw-passagedata pid="3" name="No, I already know how this works." tags="" position="732,361" size="100,100">[Let&#39;s get started!] 
+[[I changed my mind. I&#39;d rather not play.-&gt;You decline.]]</tw-passagedata><tw-passagedata pid="3" name="No, I already know how this works." tags="" position="744,369" size="100,100">[Let&#39;s get started!] 
 [Please pick a bag!]
 
 [&lt;img src=&quot;https://i.imgur.com/6JYHB1y.png&quot; alt=&quot;purple bag shut&quot; height=&quot;250&quot; width=&quot;300&quot; /&gt; &lt;img src=&quot;https://i.imgur.com/cV1W71R.png&quot; alt=&quot;purple bag shut&quot; height=&quot;250&quot; width=&quot;300&quot; /&gt; &lt;img src=&quot;https://i.imgur.com/f7l3t11.png&quot; alt=&quot;purple bag shut&quot; height=&quot;250&quot; width=&quot;300&quot; /&gt;]
@@ -105,7 +105,7 @@ tw-link.visited:hover
 (if: $hostchoice1 is &quot;orange bag&quot; and $orangebag is &quot;good potion&quot;)[&lt;img src=&quot;https://i.imgur.com/lIbXqGr.png&quot; alt=&quot;good potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $hostchoice1 is &quot;orange bag&quot; and $orangebag is &quot;bad potion&quot;)[&lt;img src=&quot;https://i.imgur.com/BjOXUZU.png&quot; alt=&quot;bad potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $hostchoice1 is &quot;green bag&quot; and $greenbag is &quot;good potion&quot;)[&lt;img src=&quot;https://i.imgur.com/lIbXqGr.png&quot; alt=&quot;good potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $greenbag is &quot;bad potion&quot; and $hostchoice1 is &quot;green bag&quot;)[&lt;img src=&quot;https://i.imgur.com/BjOXUZU.png&quot; alt=&quot;bad potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;]
 
 (if: $continue is &quot;yes&quot;)[[On to the next question?]]
-(if: $continue is &quot;no&quot;)[[Would you like to play again?-&gt;Start]]</tw-passagedata><tw-passagedata pid="5" name="The orange bag!" tags="" position="638,571" size="100,100">(set: $playerchoice1 to &quot;orange bag&quot;)[Superb choice!]
+(if: $continue is &quot;no&quot;)[[Would you like to play again?-&gt;Start]]</tw-passagedata><tw-passagedata pid="5" name="The orange bag!" tags="" position="630,592" size="100,100">(set: $playerchoice1 to &quot;orange bag&quot;)[Superb choice!]
 
 [Well let&#39;s take a look inside the...]
 
@@ -118,7 +118,7 @@ tw-link.visited:hover
 (if: $hostchoice1 is &quot;purple bag&quot; and $purplebag is &quot;good potion&quot;)[&lt;img src=&quot;https://i.imgur.com/lIbXqGr.png&quot; alt=&quot;good potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $hostchoice1 is &quot;purple bag&quot; and $purplebag is &quot;bad potion&quot;)[&lt;img src=&quot;https://i.imgur.com/BjOXUZU.png&quot; alt=&quot;bad potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $hostchoice1 is &quot;green bag&quot; and $greenbag is &quot;good potion&quot;)[&lt;img src=&quot;https://i.imgur.com/lIbXqGr.png&quot; alt=&quot;good potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $greenbag is &quot;bad potion&quot; and $hostchoice1 is &quot;green bag&quot;)[&lt;img src=&quot;https://i.imgur.com/BjOXUZU.png&quot; alt=&quot;bad potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;]
 
 (if: $continue is &quot;yes&quot;)[[On to the next question?]]
-(if: $continue is &quot;no&quot;)[[Would you like to play again?-&gt;Start]]</tw-passagedata><tw-passagedata pid="6" name="The green bag!" tags="" position="900,634" size="100,100">(set: $playerchoice1 to &quot;green bag&quot;)[A great choice!]
+(if: $continue is &quot;no&quot;)[[Would you like to play again?-&gt;Start]]</tw-passagedata><tw-passagedata pid="6" name="The green bag!" tags="" position="890,654" size="100,100">(set: $playerchoice1 to &quot;green bag&quot;)[A great choice!]
 
 [Well let&#39;s take a look inside the...]
 
@@ -132,7 +132,7 @@ tw-link.visited:hover
 (if: $hostchoice1 is &quot;purple bag&quot; and $purplebag is &quot;good potion&quot;)[&lt;img src=&quot;https://i.imgur.com/lIbXqGr.png&quot; alt=&quot;good potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $hostchoice1 is &quot;purple bag&quot; and $purplebag is &quot;bad potion&quot;)[&lt;img src=&quot;https://i.imgur.com/BjOXUZU.png&quot; alt=&quot;bad potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $hostchoice1 is &quot;orange bag&quot; and $orangebag is &quot;good potion&quot;)[&lt;img src=&quot;https://i.imgur.com/lIbXqGr.png&quot; alt=&quot;good potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;](if: $orangebag is &quot;bad potion&quot; and $hostchoice1 is &quot;orange bag&quot;)[&lt;img src=&quot;https://i.imgur.com/BjOXUZU.png&quot; alt=&quot;bad potion&quot; height=&quot;300&quot; width=&quot;300&quot;/&gt;]
 
 (if: $continue is &quot;yes&quot;)[[On to the next question?]]
-(if: $continue is &quot;no&quot;)[[Would you like to play again?-&gt;Start]]</tw-passagedata><tw-passagedata pid="7" name="On to the next question?" tags="" position="586,777" size="100,100">Would you like to...
+(if: $continue is &quot;no&quot;)[[Would you like to play again?-&gt;Start]]</tw-passagedata><tw-passagedata pid="7" name="On to the next question?" tags="" position="536,794" size="100,100">Would you like to...
 
 [[Keep your bag?]]
 [[Switch your bag?]]</tw-passagedata><tw-passagedata pid="8" name="Keep your bag?" tags="" position="93,635" size="100,100">[They nod their head.]
@@ -165,7 +165,7 @@ tw-link.visited:hover
 [The traveling peddler comes back to town, with stories of their adventures in far away lands and fantastic wares to sell.]
 
 [[Run]]
-</tw-passagedata><tw-passagedata pid="12" name="You decline." tags="" position="562,147.5" size="100,100">[For some reason, you say //no// to playing.]
+</tw-passagedata><tw-passagedata pid="12" name="You decline." tags="" position="496,154.5" size="100,100">[For some reason, you say //no// to playing.]
 
 [The peddler stares at you for another minute, then turns to the child next to you, asking them the same question.]
 (set: $outcome to (either: &quot;wins&quot;, &quot;loses&quot;))
@@ -184,7 +184,7 @@ tw-link.visited:hover
 [You see a crowd is starting to form in the center of town around the peddler.]
 
 [[Run faster.]]
-[[Continue at your pace.]]</tw-passagedata><tw-passagedata pid="14" name="Run faster." tags="" position="302,185.5" size="100,100">[Pumping all your energy into your legs, you run as fast as you can. You just barely make it to the front of the crowd when you feel it close tightly around you.]
+[[Continue at your pace.]]</tw-passagedata><tw-passagedata pid="14" name="Run faster." tags="" position="292,177.5" size="100,100">[Pumping all your energy into your legs, you run as fast as you can. You just barely make it to the front of the crowd when you feel it close tightly around you.]
 
 [Directly in front of you is the peddler. They stare at you for a moment.]
 
@@ -217,7 +217,14 @@ tw-link.visited:hover
 [The crowd falls silent, awaiting your response.]
 
 [[You accept the offer.-&gt;Start]]
-[[You decline.]]</tw-passagedata></tw-storydata>
+[[You decline.]]</tw-passagedata><tw-passagedata pid="16" name="Title" tags="" position="114,19.5" size="100,100">#[Prize Potions!]
+
+[&lt;img src=&quot;https://i.imgur.com/lIbXqGr.png&quot; alt=&quot;good potion&quot; height=&quot;300&quot; width=&quot;300&quot; align=&quot;right&quot;/&gt;]
+
+[A Twine Adventure by: 
+Emma Atkinson]
+
+[[Play-&gt;Story Intro]] </tw-passagedata></tw-storydata>
 
 <script title="Twine engine code" data-main="harlowe">"use strict";function _defineProperty(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function _toConsumableArray(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}var _slicedToArray=function(){function e(e,t){var n=[],r=!0,i=!1,o=void 0;try{for(var a,s=e[Symbol.iterator]();!(r=(a=s.next()).done)&&(n.push(a.value),!t||n.length!==t);r=!0);}catch(e){i=!0,o=e}finally{try{!r&&s.return&&s.return()}finally{if(i)throw o}}return n}return function(t,n){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,n);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};!function(){/**
  * @license almond 0.3.3 Copyright jQuery Foundation and other contributors.