Untitled

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Login Page Bootstrap</title>
  <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
  <link href="login.css" rel="stylesheet">
  <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
  <div id="login">
    <h4 class="text-center pt-5">welcome to login page</h4>
    <h1 class="text-center">regular-irregular</h1>
    <div class="container">
      <div id="login-row" class="row justify-content-center align-items-center">
      <div id="login-column" class="col-md-6">
        <div id="login-box" class="col-md-12">
          <form id="login-form" name="login-form" class="form" onsubmit="return validateForm()" method="post">
            <h3 class="text-center text-info">Login</h3>
            <div class="form-group">
              <label for="username" class="text-info">Username or email:</label><br>
              <input type="text email" name="username" id="username" class="form-control" placeholder="Enter your username or email">
            </div>
            <div class="form-group">
              <label for="password" class="text-info">Password:</label><br>
              <input type="text" name="password" id="password" class="form-control" placeholder="Enter your password">
            </div>
            <div class="form-group">
              <label for="remember-me" class="text-info"><span>Remember me</span>
                <span><input id="remember-me" name="remember-me" type="checkbox"></span>
              </label><br>
              <input type="submit" name="submit" class="btn btn-info btn-md" value="submit"><br>
            </div>
            <div id="register-link" class="text-right">
              <a href="#" class="text-info">Register here</a>
            </div>
          </form>
        </div>
      </div>
      </div>
    </div>
  </div>
  <div class="footer card-footer">
    &copy; PWEB B - Fidhia Ainun Khofifah, 2021
  </div>
  <script>
    function validateForm() {
      if (document.forms["login-form"]["username"].value == "") {
        alert("Username or email cannot be empty");
        document.forms["login-form"]["username"].focus();
        return false;
      }
      if (document.forms["login-form"]["password"].value == "") {
        alert("Password cannot be empty");
        document.forms["login-form"]["password"].focus();
        return false;
      }
    }
  </script>
</body>
</html>