This repository was archived by the owner on Apr 10, 2026. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
141 lines (118 loc) · 5.71 KB
/
Copy pathindex.html
File metadata and controls
141 lines (118 loc) · 5.71 KB
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
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet"
href="https://unicons.iconscout.com/release/v4.0.0/css/line.css">
<link rel="stylesheet" href="css/style.css">
<title>Glassmorphic Responisve Form Design</title>
</head>
<body>
<!-- Background decorative blobs -->
<div class="background-blobs">
<div class="blob blob-1"></div>
<div class="blob blob-2"></div>
<div class="blob blob-3"></div>
</div>
<div class="container">
<div class="forms">
<!-- Login Form -->
<div class="form login">
<span class="title">Login</span>
<form action="#">
<div class="input-field">
<input type="email" placeholder="Enter your email"
required>
<i class="uil uil-envelope icon"></i>
</div>
<div class="input-field">
<input type="password" class="password"
placeholder="Enter your password" required>
<i class="uil uil-lock icon"></i>
<i class="uil uil-eye-slash showHidePw"></i>
</div>
<div class="checkbox-text">
<div class="checkbox-content">
<input type="checkbox" id="logCheck">
<label for="logCheck" class="text">Remember me</label>
</div>
<a href="#" class="text forgot-link">Forgot password?</a>
</div>
<div class="input-field button">
<input type="submit" value="Login">
</div>
</form>
<div class="login-signup">
<span class="text">Not a member?
<a href="#" class="text signup-link">Signup Now</a>
</span>
</div>
</div>
<!-- Registration Form -->
<div class="form signup">
<span class="title">Registration</span>
<form action="#">
<div class="input-field">
<input type="text" placeholder="Enter your name"
required>
<i class="uil uil-user icon"></i>
</div>
<div class="input-field">
<input type="email" placeholder="Enter your email"
required>
<i class="uil uil-envelope icon"></i>
</div>
<div class="input-field">
<input type="password" class="password"
placeholder="Create a password" required>
<i class="uil uil-lock icon"></i>
</div>
<div class="input-field">
<input type="password" class="password"
placeholder="Confirm a password" required>
<i class="uil uil-lock icon"></i>
<i class="uil uil-eye-slash showHidePw"></i>
</div>
<div class="checkbox-text">
<div class="checkbox-content">
<input type="checkbox" id="termCon">
<label for="termCon" class="text">I accepted all
terms and conditions</label>
</div>
</div>
<div class="input-field button">
<input type="submit" value="Signup">
</div>
</form>
<div class="login-signup">
<span class="text">Already a member?
<a href="#" class="text login-link">Login Now</a>
</span>
</div>
</div>
<!-- Forgot Password Form -->
<div class="form forgot">
<span class="title">Forgot Password</span>
<p class="text subtitle">Enter your email and we'll send you a link to reset your password.</p>
<form action="#">
<div class="input-field">
<input type="email" placeholder="Enter your email"
required>
<i class="uil uil-envelope icon"></i>
</div>
<div class="input-field button">
<input type="submit" value="Send Link">
</div>
</form>
<div class="login-signup">
<span class="text">Remember your password?
<a href="#" class="text login-link">Login Now</a>
</span>
</div>
</div>
</div>
</div>
<script src="js/script.js"></script>
</body>
</html>