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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>OpenCall</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
</head>

<body>
    <!-- OpenCall registration page -->

    <!-- if error, display at the top as a banner -->
    <% if (typeof error=="string" ) { %>
        <div class="alert alert-danger alert-dismissible fade show m-2" role="alert">
            <strong>
                <%= error %>
            </strong>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
        <% } %>


            <div class="container register-container">
                <div class="row">
                    <div class="col-md-6 mx-auto my-5">
                        <h3 class="m-2">Register</h3>
                        <form method="POST">
                            <div class="form-group">
                                <input type="email" class="form-control m-2" placeholder="Your Email" value=""
                                    name="email" />
                            </div>
                            <!-- fname, lname -->
                            <div class="form-group">
                                <input type="text" class="form-control m-2" placeholder="Your First Name" value=""
                                    name="fname" />
                            </div>
                            <div class="form-group">
                                <input type="text" class="form-control m-2" placeholder="Your Last Name" value=""
                                    name="lname" />
                            </div>
                            <div class="form-group">
                                <input type="password" class="form-control m-2" placeholder="Your Password" value=""
                                    name="password" />
                            </div>
                            <div class="form-group">
                                <input type="submit" class="btnSubmit m-2 btn btn-primary" value="Register" />
                            </div>
                        </form>
                    </div>
                </div>
                <!-- Bootstrap 5 and jquery -->
                <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"
                    integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm"
                    crossorigin="anonymous"></script>
                <script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
</body>

</html>