Skip to content

Commit d9e051d

Browse files
aayush105aayush105
authored
Merge pull request #955 from abhas20/feature
Added Login and Signup Page for Travelling Website
2 parents b7052e4 + d44ab92 commit d9e051d

File tree

4 files changed

+187
-2
lines changed

4 files changed

+187
-2
lines changed

‎Travelling Website/auth-pages.css‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
body,
2+
html {
3+
margin: 0;
4+
padding: 0;
5+
height: 100%;
6+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
7+
Helvetica, Arial, sans-serif;
8+
box-sizing: border-box;
9+
}
10+
11+
*,
12+
*:before,
13+
*:after {
14+
box-sizing: inherit;
15+
}
16+
17+
body {
18+
background-image: url("https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&q=80");
19+
background-size: cover;
20+
background-position: center;
21+
background-repeat: no-repeat;
22+
23+
display: flex;
24+
flex-direction: column;
25+
align-items: center;
26+
justify-content: flex-start;
27+
min-height: 100vh;
28+
padding: 2rem;
29+
}
30+
31+
header {
32+
width: 100%;
33+
text-align: center;
34+
margin-bottom: 2rem;
35+
}
36+
37+
.navbar2 h1 {
38+
color: #ffffff;
39+
font-size: 2.5rem;
40+
font-weight: 700;
41+
text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6);
42+
margin: 0;
43+
}
44+
45+
.container {
46+
width: 100%;
47+
display: flex;
48+
justify-content: center;
49+
}
50+
51+
.form-box {
52+
background-color: #ffffff;
53+
padding: 2.5rem;
54+
border-radius: 16px;
55+
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
56+
width: 100%;
57+
max-width: 420px;
58+
text-align: center;
59+
}
60+
61+
.form-box h1 {
62+
font-size: 2rem;
63+
color: #333;
64+
margin-top: 0;
65+
margin-bottom: 2rem;
66+
}
67+
68+
.form {
69+
display: flex;
70+
flex-direction: column;
71+
gap: 1rem;
72+
}
73+
74+
.form input {
75+
width: 100%;
76+
padding: 14px 16px;
77+
border: 1px solid #dcdcdc;
78+
border-radius: 8px;
79+
font-size: 1rem;
80+
color: #333;
81+
}
82+
83+
.form input:focus {
84+
outline: none;
85+
border-color: #4a4a9f;
86+
box-shadow: 0 0 0 2px rgba(74, 74, 159, 0.2);
87+
}
88+
89+
.form button {
90+
background-color: #4a4a9f;
91+
color: white;
92+
padding: 14px;
93+
border: none;
94+
border-radius: 8px;
95+
font-size: 1.1rem;
96+
font-weight: 600;
97+
cursor: pointer;
98+
transition: background-color 0.3s ease;
99+
margin-top: 0.5rem;
100+
}
101+
102+
.form button:hover {
103+
background-color: #3a3a7f;
104+
}
105+
106+
.form-box p {
107+
margin-top: 1.5rem;
108+
font-size: 0.9rem;
109+
color: #555;
110+
}
111+
112+
.form-box p a {
113+
color: #1f3a5e;
114+
text-decoration: none;
115+
font-weight: 600;
116+
}
117+
118+
.form-box p a:hover {
119+
text-decoration: underline;
120+
}

‎Travelling Website/create_account.html‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
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.0">
6+
<title>Sign Up</title>
7+
<link rel="stylesheet" href="auth-pages.css">
8+
</head>
9+
<body>
10+
<header>
11+
<div class="navbar2">
12+
<h1>"Explore More, Worry Less"</h1>
13+
</div>
14+
</header>
15+
<div class="container">
16+
<div class="form-box" id="formBox">
17+
<h1>Sign Up</h1>
18+
19+
<form id="signupForm" class="form">
20+
<input type="text" placeholder="Full Name" required>
21+
<input type="email" placeholder="Email" required>
22+
<input type="password" placeholder="Password" required>
23+
<input type="password" placeholder="Confirm Password" required>
24+
<button type="submit">Sign Up</button>
25+
<p>Already have an account? <a href="./login.html" id="showLogin">Login</a></p>
26+
<a href="./index.html">Go Back to HOME</a>
27+
</form>
28+
29+
</div>
30+
</div>
31+
</body>
32+
</html>

‎Travelling Website/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,8 +36,8 @@
3636
</ul>
3737

3838
<div class="nav-actions">
39-
<a href="#" class="signin">Sign in</a>
40-
<a href="#" class="account">Create Account</a>
39+
<a href="./login.html" class="signin">Sign in</a>
40+
<a href="./create_account.html" class="account">Create Account</a>
4141
<a href="#"><i class="fa-solid fa-cart-shopping"></i></a>
4242
</div>
4343
</nav>

‎Travelling Website/login.html‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
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.0" />
6+
<title>login-form</title>
7+
</head>
8+
<link rel="stylesheet" href="auth-pages.css">
9+
10+
<body>
11+
<header>
12+
<div class="navbar2">
13+
<h1>"Explore More, Worry Less"</h1>
14+
</div>
15+
</header>
16+
<div class="container">
17+
<div class="form-box" id="formBox">
18+
<h1>Login</h1>
19+
<!-- Login Form -->
20+
<form id="loginForm" class="form active">
21+
<input type="email" placeholder="Email" required />
22+
<input type="password" placeholder="Password" required />
23+
<button type="submit">Login</button>
24+
<p>
25+
Don't have an account?
26+
<a href="./create_account.html" id="showSignup">Sign up</a>
27+
</p>
28+
<a href="./index.html">Go Back to HOME</a>
29+
</form>
30+
</div>
31+
</div>
32+
</body>
33+
</html>

0 commit comments

Comments
 (0)