Skip to content

Commit e1361ab

Browse files
MeenusiwachMeenusiwach
authored
Create final.html
1 parent e1ed78a commit e1361ab

File tree

1 file changed

+330
-0
lines changed

1 file changed

+330
-0
lines changed

‎final.html

+330
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,330 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<title>Bootstrap demo</title>
7+
<style>
8+
.body{
9+
font-display: inline-block;
10+
font-size: large;
11+
}
12+
13+
.gradient-custom-2 {
14+
/* fallback for old browsers */
15+
background: #fccb90;
16+
17+
/* Chrome 10-25, Safari 5.1-6 */
18+
background: -webkit-linear-gradient(to right, #ee7724, #d8363a, #dd3675, #b44593);
19+
20+
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
21+
background: linear-gradient(to right, #ee7724, #d8363a, #dd3675, #b44593);
22+
}
23+
24+
@media (min-width: 768px) {
25+
.gradient-form {
26+
height: 100vh !important;
27+
}
28+
}
29+
@media (min-width: 769px) {
30+
.gradient-custom-2 {
31+
border-top-right-radius: .3rem;
32+
border-bottom-right-radius: .3rem;
33+
}
34+
}
35+
36+
.footer {
37+
display: block;
38+
}
39+
40+
ment.style {
41+
width: 280px;
42+
43+
}
44+
.p-3 {
45+
padding: 1rem!important;
46+
}
47+
.flex-shrink-0 {
48+
flex-shrink: 0!important;
49+
}
50+
.flex-column {
51+
flex-direction: column!important;
52+
}
53+
.d-flex {
54+
display: flex!important;
55+
}
56+
.text-bg-dark {
57+
color: #fff!important;
58+
background-color: RGBA(33,37,41,var(--bs-bg-opacity,1))!important;
59+
}
60+
*, ::after, ::before {
61+
box-sizing: border-box;
62+
}
63+
user agent stylesheet
64+
div {
65+
display: block;
66+
}
67+
.login{
68+
display:inline-flex;
69+
}
70+
ment.style {
71+
width: 280px;
72+
}
73+
.p-3 {
74+
padding: 1rem!important;
75+
}
76+
.flex-shrink-0 {
77+
flex-shrink: 0!important;
78+
}
79+
.flex-column {
80+
flex-direction: column!important;
81+
}
82+
.d-flex {
83+
display: flex!important;
84+
}
85+
.text-bg-dark {
86+
color: #fff!important;
87+
background-color: RGBA(33,37,41,var(--bs-bg-opacity,1))!important;
88+
}
89+
*, ::after, ::before {
90+
box-sizing: border-box;
91+
}
92+
::after, ::before {
93+
box-sizing: border-box;
94+
}
95+
96+
div {
97+
display: block;
98+
}
99+
100+
101+
102+
</style>
103+
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
104+
</head>
105+
<body>
106+
<div class="body">
107+
<nav class="navbar navbar-expand-lg bg-dark navbar-dark">
108+
<div class="container-fluid">
109+
<a class="navbar-brand" href="#">CUDE</a>
110+
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
111+
<span class="navbar-toggler-icon"></span>
112+
</button>
113+
<div class="collapse navbar-collapse" id="navbarNav">
114+
<ul class="navbar-nav">
115+
<li class="nav-item">
116+
<a class="nav-link active" aria-current="page" href="final.html">Home</a>
117+
</li>
118+
<li class="nav-item">
119+
<a class="nav-link" href="index3.html">About us</a>
120+
</li>
121+
<li class="nav-item">
122+
<a class="nav-link" href="index4.html">Contact us</a>
123+
</li>
124+
125+
</ul>
126+
</div>
127+
</div>
128+
</nav>
129+
</div>
130+
<div class="login">
131+
<div class="bar">
132+
<div class="d-flex flex-column flex-shrink-0 p-3 text-bg-dark" style="width: 280px; height: 800px;">
133+
<a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
134+
<svg class="bi pe-none me-2" width="40" height="44"><use xlink:href="#bootstrap"></use></svg>
135+
<span class="fs-4">Sidebar</span>
136+
</a>
137+
<hr>
138+
<ul class="nav nav-pills flex-column mb-auto">
139+
<li class="nav-item">
140+
<a href="final.html" class="nav-link active" aria-current="page">
141+
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href=""></use></svg>
142+
Home
143+
</a>
144+
</li>
145+
<li>
146+
<a href="index6.html" class="nav-link text-white">
147+
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#speedometer2"></use></svg>
148+
Rules
149+
</a>
150+
</li>
151+
<li>
152+
<a href="team.html" class="nav-link text-white">
153+
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#table"></use></svg>
154+
Team
155+
</a>
156+
</li><ul class="nav nav-pills flex-column mb-auto">
157+
<li class="nav-item">
158+
<a href="http://www.mnnit.ac.in" class="nav-link active" aria-current="page">
159+
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#home"></use></svg>
160+
MNNIT
161+
</a>
162+
</li>
163+
<li>
164+
<a href="http://www.mnnit.ac.in/index.php/facilities/hostels" class="nav-link text-white">
165+
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#speedometer2"></use></svg>
166+
Hostel
167+
</a>
168+
</li>
169+
<li>
170+
<a href="#" class="nav-link text-white">
171+
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#table"></use></svg>
172+
173+
</a>
174+
</li>
175+
<li>
176+
<a href="#" class="nav-link text-white">
177+
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#grid"></use></svg>
178+
179+
</a>
180+
</li>
181+
<li>
182+
<a href="#" class="nav-link text-white">
183+
<svg class="bi pe-none me-2" width="16" height="16"><use xlink:href="#people-circle"></use></svg>
184+
185+
</a>
186+
</li>
187+
</ul>
188+
189+
<hr>
190+
<div class="dropdown">
191+
<a href="#" class="d-flex align-items-center text-white text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
192+
<img src="" alt="" width="32" height="32" class="rounded-circle me-2">
193+
<strong></strong>
194+
</a>
195+
<ul class="dropdown-menu dropdown-menu-dark text-small shadow">
196+
<li><a class="dropdown-item" href="#">New project...</a></li>
197+
<li><a class="dropdown-item" href="#">Settings</a></li>
198+
<li><a class="dropdown-item" href="#">Profile</a></li>
199+
<li><hr class="dropdown-divider"></li>
200+
<li><a class="dropdown-item" href="#">Sign out</a></li>
201+
</ul>
202+
</div>
203+
</div>
204+
</div>
205+
206+
<section class="h-100 gradient-form" style="background-color: #eee;">
207+
<div class="container py-5 h-100">
208+
<div class="row d-flex justify-content-center align-items-center h-100">
209+
<div class="col-xl-10">
210+
<div class="card rounded-3 text-black">
211+
<div class="row g-0">
212+
<div class="col-lg-6">
213+
<div class="card-body p-md-5 mx-md-4">
214+
215+
<div class="text-center">
216+
<img src="https://mdbcdn.b-cdn.net/img/Photos/new-templates/bootstrap-login-form/lotus.webp"
217+
style="width: 185px;" alt="logo">
218+
<h4 class="mt-1 mb-5 pb-1">We are The CAME CHANGERS Team</h4>
219+
</div>
220+
221+
<form method="post" action="final.php">
222+
<p>Please login to your account</p>
223+
224+
<div class="form-outline mb-4">
225+
<input type="email" id="form2Example11" class="form-control"
226+
name="regno1"/>
227+
<label class="form-label" for="form2Example11">Registration No</label>
228+
</div>
229+
230+
<div class="form-outline mb-4">
231+
<input type="password" id="form2Example22" class="form-control" name="password1"/>
232+
<label class="form-label" for="form2Example22">Password</label>
233+
</div>
234+
235+
<div class="text-center pt-1 mb-5 pb-1">
236+
<button class="btn btn-primary btn-block fa-lg gradient-custom-2 mb-3" type="button">Log
237+
in</button>
238+
<a class="text-muted" href="#!">Forgot password?</a>
239+
</div>
240+
241+
<div class="d-flex align-items-center justify-content-center pb-4">
242+
<p class="mb-0 me-2">Don't have an account?</p>
243+
<button type="button" class="btn btn-outline-danger"><a href="index5.html">Create new</a></button>
244+
</div>
245+
246+
</form>
247+
248+
</div>
249+
</div>
250+
<div class="col-lg-6 d-flex align-items-center gradient-custom-2">
251+
<div class="text-white px-3 py-4 p-md-5 mx-md-4">
252+
<h4 class="mb-4">CUDE Close Your Daily Entry</h4>
253+
<p class="small mb-0">
254+
Closing daily entry is a crucial part of a hosteler and CUDE makes this process easier and systematic.
255+
</p>
256+
</div>
257+
</div>
258+
</div>
259+
</div>
260+
</div>
261+
</div>
262+
263+
</section>
264+
</div>
265+
266+
267+
<footer class="bd-footer py-4 py-md-5 mt-5 bg-body-tertiary">
268+
<div class="container py-4 py-md-5 px-4 px-md-3 text-body-secondary">
269+
<div class="row">
270+
<div class="col-lg-3 mb-3">
271+
<a class="d-inline-flex align-items-center mb-2 text-body-secondary text-decoration-none" href="https://icons.getbootstrap.com/icons/c-square/" aria-label="Bootstrap">
272+
<svg xmlns="https://icons.getbootstrap.com/icons/c-square/" width="40" height="32" class="d-block me-2" viewBox="0 0 118 94" role="img"><title>CUDE</title><path fill-rule="evenodd" clip-rule="evenodd" d="M24.509 0c-6.733 0-11.715 5.893-11.492 12.284.214 6.14-.064 14.092-2.066 20.577C8.943 39.365 5.547 43.485 0 44.014v5.972c5.547.529 8.943 4.649 10.951 11.153 2.002 6.485 2.28 14.437 2.066 20.577C12.794 88.106 17.776 94 24.51 94H93.5c6.733 0 11.714-5.893 11.491-12.284-.214-6.14.064-14.092 2.066-20.577 2.009-6.504 5.396-10.624 10.943-11.153v-5.972c-5.547-.529-8.934-4.649-10.943-11.153-2.002-6.484-2.28-14.437-2.066-20.577C105.214 5.894 100.233 0 93.5 0H24.508zM80 57.863C80 66.663 73.436 72 62.543 72H44a2 2 0 01-2-2V24a2 2 0 012-2h18.437c9.083 0 15.044 4.92 15.044 12.474 0 5.302-4.01 10.049-9.119 10.88v.277C75.317 46.394 80 51.21 80 57.863zM60.521 28.34H49.948v14.934h8.905c6.884 0 10.68-2.772 10.68-7.727 0-4.643-3.264-7.207-9.012-7.207zM49.948 49.2v16.458H60.91c7.167 0 10.964-2.876 10.964-8.281 0-5.406-3.903-8.178-11.425-8.178H49.948z" fill="currentColor"></path></svg>
273+
<span class="fs-5">CUDE</span>
274+
</a>
275+
<ul class="list-unstyled small">
276+
<li class="mb-2">Designed and built by the students for the students <a href="/docs/5.3/about/team/">CUDE team</a> with the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">our contributors</a>.</li>
277+
<li class="mb-2"><a href="https://github.com/twbs/bootstrap/blob/main/LICENSE" target="_blank" rel="license noopener">MNNIT ALLHABAD</a>, docs <a href="https://creativecommons.org/licenses/by/3.0/" target="_blank" rel="license noopener">CC CLUB</a>.</li>
278+
<li class="mb-2"></li>
279+
</ul>
280+
</div>
281+
<div class="col-6 col-lg-2 offset-lg-1 mb-3">
282+
<h5>Links</h5>
283+
<ul class="list-unstyled">
284+
<li class="mb-2"><a href="final.html">Home</a></li>
285+
<li class="mb-2"><a href="index6.html">Rules</a></li>
286+
<li class="mb-2"><a href="/docs/5.3/examples/"></a></li>
287+
<li class="mb-2"><a href="https://icons.getbootstrap.com/"></a></li>
288+
<li class="mb-2"><a href="https://themes.getbootstrap.com/"></a></li>
289+
<li class="mb-2"><a href="https://blog.getbootstrap.com/"></a></li>
290+
<li class="mb-2"><a href="https://cottonbureau.com/people/bootstrap"></a></li>
291+
</ul>
292+
</div>
293+
<div class="col-6 col-lg-2 mb-3">
294+
<h5>Guides</h5>
295+
<ul class="list-unstyled">
296+
<li class="mb-2"><a href="https://www.facebook.com/groups/ccqueries">CC CLUB</a></li>
297+
<li class="mb-2"><a href="">RISHANK BARUA</a></li>
298+
<li class="mb-2"><a href="">YASH A.KABRA</a></li>
299+
<li class="mb-2"><a href="">ADITYA SHRIVASTAVA</a></li>
300+
<li class="mb-2"><a href="">VAISHNAVI</a></li>
301+
</ul>
302+
</div>
303+
<div class="col-6 col-lg-2 mb-3">
304+
<h5>TECH STACK</h5>
305+
<ul class="list-unstyled">
306+
<li class="mb-2"><a href="">HTML</a></li>
307+
<li class="mb-2"><a href="">PHP</a></li>
308+
<li class="mb-2"><a href="">BOOTSTRAP</a></li>
309+
<li class="mb-2"><a href="">CSS</a></li>
310+
<li class="mb-2"><a href="">MYSQL</a></li>
311+
</ul>
312+
</div>
313+
<!-- <div class="col-6 col-lg-2 mb-3">
314+
<h5>Community</h5>
315+
<ul class="list-unstyled">
316+
<li class="mb-2"><a href="https://github.com/twbs/bootstrap/issues">Issues</a></li>
317+
<li class="mb-2"><a href="https://github.com/twbs/bootstrap/discussions">Discussions</a></li>
318+
<li class="mb-2"><a href="https://github.com/sponsors/twbs">Corporate sponsors</a></li>
319+
<li class="mb-2"><a href="https://opencollective.com/bootstrap">Open Collective</a></li>
320+
<li class="mb-2"><a href="https://stackoverflow.com/questions/tagged/bootstrap-5">Stack Overflow</a></li>
321+
</ul>
322+
</div> -->
323+
</div>
324+
</div>
325+
</footer>
326+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
327+
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous"></script>
328+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-mQ93GR66B00ZXjt0YO5KlohRA5SY2XofN4zfuZxLkoj1gXtW8ANNCe9d5Y3eG5eD" crossorigin="anonymous"></script>
329+
</body>
330+
</html>

0 commit comments

Comments
 (0)