change play button to input, added an event listener for the enter key

css/title.css

@@ -35,7 +35,7 @@ h1.name {
     color: #00ffc6;
 }
 
-button.play {
+input.play {
     font-family: Baloo2, sans-serif;
     font-size: 500%;
     padding: 4px 60px;
@@ -46,7 +46,7 @@ button.play {
     transition-duration: 0.4s;
 }
 
-button.play:hover {
+input.play:hover {
     background-color: #20b13f;
     cursor: pointer;
 }

index.html

@@ -11,9 +11,7 @@
             RUNIC
         </h1>
         <input id="runic_username" class="username" placeholder="Username" maxlength="16"><br>
-        <button class="play" onclick="play()">
-            PLAY
-        </button>
+        <input type="button" class="play" onclick="play()" value="PLAY">
     </div>
     <script>
         var usernameinput = document.getElementById("runic_username");
@@ -26,6 +24,12 @@
                 window.location = "game.html";
             }
         }
+        usernameinput.addEventListener("keypress", function(event) {
+            if (event.key === "Enter") {
+            event.preventDefault();
+            play();
+        }
+});
     </script>
 </body>
 </html>