<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>myBloog :: <%= page %></title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous" />
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css" />
  <link rel="stylesheet" href="/styles/global.css" />
</head>

<body>

  <div class="container-fluid mt-5 col-md-3 col-10 text-bg-dark p-5">
    <div class="alerts"></div>
    <div class="singin">
      <h2 class="d-flex justify-content-center">Sign In</h2>
      <br />
      <form class="signin-form">
        <div class="mb-3">
          <label for="email">Email</label>
          <input type="email" class="form-control text-bg-dark" name="email" placeholder="Email" required />
        </div>
        <div class="mb-3">
          <label for="password">Password</label>
          <input type="password" class="form-control text-bg-dark" name="password" placeholder="Password" required />
        </div>

        <button type="submit" class="btn btn-success">Log in</button>
      </form>
    </div>

    <div class="singup" style="display: none;">
      <h2 class="d-flex justify-content-center">Sign Up</h2>
      <br />
      <form class="singup-form">
        <div class="mb-3">
          <label for="username">Username</label>
          <input type="text" class="form-control text-bg-dark" name="username" placeholder="Name" required />
        </div>
        <div class="mb-3">
          <label for="email">Email</label>
          <input type="email" class="form-control text-bg-dark" name="email" placeholder="Email" required />
        </div>
        <div class="mb-3">
          <label for="password1">Password</label>
          <input type="password" class="form-control text-bg-dark" name="password1" placeholder="Password" required />
        </div>
        <div class="mb-3">
          <label for="password2">Confirm Password</label>
          <input type="password" class="form-control text-bg-dark" name="password2" placeholder="Confirm Password" required />
        </div>
        <button type="submit" class="btn btn-primary">Sign Up</button>
      </form>
    </div>
    <p class="mt-3">
      <a class="link-info sign">SignUp</a>
    </p>
  </div>
  </div>

</body>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script>
<script src="/scripts/signin.js"></script>

</html>