<script src="/portfolio/php/login.php"></script>
<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="/portfolio/css/startPage.css">
    <link rel="stylesheet" href="/portfolio/css/logIn.css">
  </head>

  <body>

<h2>Modal Log In Form</h2>

<button onclick="document.getElementById('id01').style.display='block'" class="beforebtn" style="width:auto;">Log In</button>

<div id="id01" class="modal">
  <span onclick="document.getElementById('id01').style.display='none'" class="close" title="Close Modal">&times;</span>
  <?php if ($is_invalid): ?>
    <em>Invalid log in</em>
  <?php endif; ?>
  <form method="post" class="modal-content" action="/portfolio/php/database.php">
    <script src="/portfolio/php/login.php"></script>
    <div class="container">
      <h1>Log In</h1>
      <p>Please fill in this form to create an account.</p>
      <hr>

      <label for="name"><b>Name</b></label>
      <input type="text" placeholder="Enter Name" id="name" name="name" required>

      <label for="email"><b>Email</b></label>
      <input type="text" placeholder="Enter Email"  id="email" name="email" required>

      <label for="psw"><b>Password</b></label>
      <input type="password" placeholder="Enter Password" id="password" name="psw" required>

      <label>
        <input type="checkbox" checked="checked" name="remember" style="margin-bottom:15px"> Remember me
      </label>

      <div class="clearfix">
        <button type="button" onclick="document.getElementById('id01').style.display='none'" class="cancelbtn">Cancel</button>
        <button type="submit" class="loginbtn">Log In</button> 
        <a href="/portfolio/html/modal_signup.html">Sign Up</a>
      </div>
    </div>
  </form>
</div>

<script src="/portfolio/js/logIn.js">
</script>

</body>
</html>
