{% extends 'base.html' %}
{% block content %}
    <h1 style="text-decoration: underline;">Sign up to make a account</h1>
    <form action="/submit-form" method="POST" class="signup">
    <label for="username">Username:</label>
    <input type="text" id="username" name="username" required><br><br>

    <label for="email">Email:</label>
    <input type="email" id="email" name="email" required><br><br>

    <label for="password">Password:</label>
    <input type="password" id="password" name="password" required><br><br>

    <button type="submit" class="submitbutton" style="font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; border-color: gray; border-radius: 4px; border-width: 4px;">Create account</button>

    {% if success_message %}
        <p style="color: green; margin-top: 15px; font-weight: bold;">
            {{ success_message }}
        </p>
    {% endif %}

    {% if user_taken %}
        <p style="color: rgb(128, 0, 0); margin-top: 15px; font-weight: bold;">
            {{ user_taken }}
        </p>
    {% endif %}

    {% if email_taken %}
        <p style="color: rgb(128, 0, 0); margin-top: 15px; font-weight: bold;">
            {{ email_taken }}
        </p>
    {% endif %}

    {% if error %}
        <p style="color: rgb(128, 0, 0); margin-top: 15px; font-weight: bold;">
            {{ error }}
        </p>
    {% endif %}

    </form>

{% endblock %}