jme9
72 lines
2.2 KiB
HTML
72 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
|
<title>Form</title>
|
|
<link rel="stylesheet" href="styles.css" />
|
|
<script defer src="form.js"></script>
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<h1>Website Under Construction :(</h1>
|
|
<form action="/submit" class="form-container">
|
|
<h2>Sign Up Form</h2>
|
|
<h3>Fill in the form below.</h3>
|
|
|
|
<div class="form-group">
|
|
<label for="name">Name:</label>
|
|
<input type="text" id="name" name="name" />
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="uname">Username:</label>
|
|
<input type="text" id="uname" name="uname" />
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="email">Email:</label>
|
|
<input type="email" id="email" name="email" />
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="pword">Password:</label>
|
|
<input type="password" id="pword" name="pword" />
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="dob">Date of birth:</label>
|
|
<input type="date" id="dob" name="dob" />
|
|
</div>
|
|
|
|
<fieldset class="pronoun-group">
|
|
<legend>Preferred Pronouns</legend>
|
|
<label class="radio-label"
|
|
><input type="radio" name="pronouns" value="she-her" />
|
|
She/Her</label
|
|
>
|
|
<br />
|
|
<label class="radio-label"
|
|
><input type="radio" name="pronouns" value="he-him" /> He/Him</label
|
|
>
|
|
<br />
|
|
<label class="radio-label"
|
|
><input type="radio" name="pronouns" value="they-them" />
|
|
They/Them</label
|
|
>
|
|
<br />
|
|
<label class="radio-label"
|
|
><input type="radio" name="pronouns" value="no-preference" /> I
|
|
prefer not to say</label
|
|
>
|
|
</fieldset>
|
|
|
|
<div class="form-actions">
|
|
<button type="submit">Submit</button>
|
|
<button type="reset">Reset</button>
|
|
</div>
|
|
</form>
|
|
</main>
|
|
</body>
|
|
</html> |