Files
  • index.html
  • script.js
  • style.css
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Morse Code Chat</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <link href="https://bootswatch.com/4/slate/bootstrap.min.css" rel="stylesheet" type="text/css">
  </head>
  <body>
      <div class="container text-center">
          <div class="jumbotron">
              <h2>Welcome To Morse Code Chat!</h2>
              <small>The best online chat room that only uses morse code!</small>
          </div>
      <h1>How does it work?</h1>
      <p>To comunicate, all you need to do is press space, and press and hold space. It's up to you to translate your message, and translate other people's messages. Don't worry, we'll provide a chart to help you understand.</p>
      <form action="new_user" method="POST">
          <div class="form-group row justify-content-around">
              <input class="form-control col-5" type="text" placeholder="Name (ex. Mr. Squiggles)" id="name-entry" name="username">
              <button type="submit" class="btn btn-primary col-5">Enter Chat</button>
      </div>
    </div>
    <script src="script.js"></script>
  </body>
</html>
result
console