-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.html
117 lines (96 loc) · 4.92 KB
/
app.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>College Form</title>
<link rel="stylesheet" href="./Libraries/bootstrap.min.css">
<link rel="stylesheet" href="./style.css">
<script src="./Libraries/jquery-3.6.3.min.js"></script>
</head>
<body>
<!-- Alerts Display -->
<div class="alert alert-primary text-center position-fixed w-100 d-none z-3" role="alert" id="signIn">
A simple primary alert—check it out!
</div>
<div class="alert bg-alert text-center position-fixed w-100 d-none z-3" role="alert" id="warn">
A simple danger alert—check it out!
</div>
<!--Alerts -->
<!-- Navbar Started -->
<header>
<div class="nav-customx pt-5">
<i class="fa-solid fa-circle-exclamation"></i>
<center>
<div class="bg-custom w-50 rounded-5 text-light p-3">
<h1 class="fs">
Registration form
</h1>
</div>
</center>
</div>
</header>
<!-- Navbar Ended -->
<main>
<div class="container">
<div
class="bg-custom pt-4 container offset-lg-2 col-lg-8 mt-4 border border-2 border-dark-subtle shadow-lg rounded-3">
<form name="regForm" id="regForm">
<div class="form-floating mb-3 mt-2">
<input type="text" class="form-control" id="fullName" placeholder="Enter your Name">
<label for="fullName">Full name</label>
</div>
<div class="form-floating mb-3 mt-2">
<input type="text" class="form-control" id="emailId" placeholder="Enter your Email">
<label for="emailId">Email</label>
</div>
<div class="form-floating mb-3 mt-2">
<input type="password" class="form-control" id="pwd" placeholder="Enter your password">
<label for="pwd">Password</label>
</div>
<div class="form-floating mb-3 mt-2">
<input type="password" class="form-control" id="confirmPwd" placeholder="Enter your password">
<label for="confirmPwd">Confirm Password</label>
</div>
<div class="form-floating mb-3 mt-2 ">
<label for="pwd" class="custom-label">+91</label>
<input type="text" class="offset-1 form-control w-50" id="contactNumber"
placeholder="Enter your contact number">
<label for="contactNumber" class="offset-1 ">Contact Number</label>
</div>
<div class="form-floating mb-3 mt-2">
<input type="text" class="form-control" id="address" placeholder="Enter your address">
<label for="address">Address</label>
</div>
<div class="mt-2 mb-3 mx-3 d-flex">
<label class="form-label text-light"> Select Gender</label>
<input type="radio" class="btn-check" name="gender" id="male" autocomplete="off" >
<label class="mx-2 btn btn-outline-light" for="male">Male</label>
<input type="radio" class="btn-check" name="gender" id="female" autocomplete="off">
<label class="mx-2 btn btn-outline-light" for="female">Female</label>
<input type="radio" class="btn-check" name="gender" id="other" autocomplete="off">
<label class="mx-2 btn btn-outline-light" for="other">Other</label>
<!-- Options for cities -->
<div class="ms-5">
<select class="form-select" aria-label="Default select example" >
<option selected>Select City</option>
<option value="nanded">Nanded</option>
<option value="hydrabad">Hydrabad</option>
<option value="pune">Pune</option>
<option value="mumbai">Mumbai</option>
<option value="nagpur">Nagpur</option>
</select>
</div>
</div>
<div class="row mt-3 mb-4 p-3">
<button type="button" class="btn-custom" id="submitButton">Submit</button>
</div>
</form>
</div>
</div>
</main>
<script src="./Libraries/bootstrap.bundle.min.js"></script>
<script src="./index.js"></script>
</body>
</html>