intern_signup.html

{% extends 'base.html' %}

{% block head %}
<link rel="stylesheet" href="../static/styles/intern_signup.css">
{% endblock %}


{% block title %} Intern Sign-Up {% endblock %}

<!-- Main Body == SIGNUP -->

{% block content %}
<div class="main-body-container">
	<div class="section-heading">
		<h3>Intern Sign-Up</h3>
	</div>
	<section class="signup-form">

		<form class="row g-3" method="post">
			<div class="col-md-6 required">
				<label for="first_name" class="form-label"><strong>First name</strong></label>
				<input class="form-control" type="text" id="first_name" name="first_name" required>
			</div>
			<div class="col-md-6 required">
				<label class="form-label" for="last_name"><strong>Last name</strong></label>
				<input class="form-control" type="text" id="last_name" name="last_name" required>
			</div>
			<div class="col-md-6 required">
				<label class="form-label" for="gender"><strong>Gender</strong></label>
				<input class="form-control" list="genderOptions" id="gender" name="gender">
				<datalist id="genderOptions">
					<option value="Male"></option>
					<option value="Female"></option>
				</datalist>
			</div>
			<div class="col-md-6 required">
				<label class="form-label" for="birthday">Date of Birth</label>

				<input class="form-control" type="date" id="birthday" name="birthday" , placeholder="yyyy-mm-dd" value=""
					min="1980-01-01" max="2023-01-01" required>

			</div>
			<div class="col-md-6 required">
				<label class="form-label" for="email"><strong>Email Address</strong></label>
				<input class="form-control" type="email" autocomplete="username" id="email" name="email"
					placeholder="example@gmail.com" required>
			</div>
			<div class="col-md-6 required">
				<label class="form-label" for="phone"><strong>Phone</strong></label>
				<input class="form-control" type="tel" id="phone" name="phone" placeholder="080-12-345-678" required>
			</div>
			<div class="col-md-12 required">
				<label class="form-label" for="address"><strong>Home Address</strong></label>
				<input class="form-control" type="address" id="address" name="address" required>
			</div>

			<div class="col-md-6 required">
				<label class="form-label" for="password1"><strong>Password</strong></label>
				<input class="form-control" type="password" autocomplete="new-password" id="password1" name="password1"
					required>
			</div>
			<div class="col-md-6 required">
				<label class="form-label" for="password2"><strong>Confirm Password</strong></label>
				<input class="form-control" type="password" autocomplete="new-password" id="password2" name="password2"
					required>
			</div>
			<div class="col-12 required">
				<label class="form-label" for="schools">Choose your school</label>
				<input class="form-control" list="datalistOptions" id="school" name="school" placeholder="Type to search...">
				<datalist id="datalistOptions">
					{% for school in schools %}
					<option value="{{ school.name }}"></option>
					{% endfor %}
				</datalist>
			</div>
			<div class="col-12 required">
				<label class="form-label" for="course"><strong>Course of Study</strong></label>
				<input class="form-control" type="text" name="course" id="course" required>
			</div>
			<div class="col-12">
				<label class="form-label" for="preferred_organization"><strong>Preferred
						Organization</strong></label>
				<input class="form-control" type="text" name="preferred_organization" id="preferred_organization">
			</div>
			<hr />
			<div class="col-md-8" id="btn-container">
				<button type="submit" class="button submit-btn btn btn-success">Submit</button>
			</div>

		</form>
	</section>
</div>

{% endblock %}