{% extends "layout_reg.html" %}
{% block title %}
Register
{% endblock %}
{% block main %}
<center>
<div class="soap2" style="width: 550px; height: 600px; background-color: white;">
<center><br><br>
<h4 class = "login_and_register">Create Your Account</h4><br>
<form action="/register" method="post">
<div class="mb-3">
<input autocomplete="off" autofocus class="form-control mx-auto w-auto" name="username" placeholder="Username" type="text" required>
</div>
<div class="mb-3">
<input class="form-control mx-auto w-auto" autocomplete="off" name="school" placeholder="Your School Name" type="text">
</div>
<div class="mb-3">
<input class="form-control mx-auto w-auto" autocomplete="off" name="password" placeholder="Password" type="password" required>
</div>
<div class="mb-3">
<input class="form-control mx-auto w-auto" autocomplete="off" name="confirmation" placeholder="Confirm Password" type="password" required>
</div>
<div class="help" style="color: #52734D">How you are contributing to lunchbell. Know More</div><br>
<select class="select" name="status">
<option disabled selected>Select an option</option>
<option value="1">Buyer</option>
<option value="2">Seller</option>
</select>
<br>
<br>
<div class="help" style="color: #52734D">Already have an account?<a href="login" style="text-decoration : none; color: #91C788"> Log in here.</a></div>
<br>
<button class="btn btn-primary" type="submit" style="background-color: #DDFFBC; border-color: #DDFFBC;color: #004225"><b>Register Now</b></button>
</form>
<center>
</div>
</center>
{% with messages = get_flashed_messages() %}
{% if messages %}
{% for msg in messages %}
<div class="alert alert-warning alert-dismissible fade show" role="alert">
<strong>{{ msg }}</strong>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
{% endfor %}
{% endif %}
{% endwith %}
{% endblock %}