Skip to content

Commit ee9773c

Browse files
medss19Medha
medss19
and
Medha
authored
fixed the glitch of the signin page (#1321)
* fixed the glitch of the signin page * Fixed the regitser/login page along with the its appearance and working --------- Co-authored-by: Medha <[email protected]>
1 parent 219f453 commit ee9773c

File tree

2 files changed

+143
-286
lines changed

2 files changed

+143
-286
lines changed

‎login.html‎

Lines changed: 46 additions & 130 deletions
Original file line numberDiff line numberDiff line change
@@ -4,15 +4,11 @@
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<title>Register & Login</title>
7-
<!-- Link to add favicon -->
87
<link rel="shortcut icon" href="assets/recode-hive.png" type="image/x-icon">
98
<link rel="stylesheet" href="login.css" />
109
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" />
11-
12-
1310
</head>
1411
<body>
15-
1612
<div class="container">
1713
<div class="forms-container">
1814
<div class="signin-signup">
@@ -26,23 +22,29 @@ <h2 class="title">Sign in</h2>
2622
<i class="fas fa-lock toggle-password" id="toggle-password"></i>
2723
<input type="password" id="password-input" placeholder="Password" required/>
2824
</div>
29-
25+
<div class="remember-me">
26+
<input type="checkbox" id="remember-me" />
27+
<label for="remember-me">Remember Me</label>
28+
</div>
3029
<input type="submit" value="Login" class="btn solid" />
3130
<p class="social-text">Or Sign in with social platforms</p>
3231
<div class="social-media">
33-
34-
3532
<button type="button" class="github-login" id="gh-lg-btn">
36-
<img src="https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg" alt="GitHub" width="40" height="40" style="margin-left: 5px;">
33+
<img src="https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg" alt="GitHub" width="40" height="40" style="margin-left: 5px;">
3734
</button>
3835
</div>
3936
</form>
37+
4038
<form action="#" class="sign-up-form">
4139
<h2 class="title">Sign up</h2>
4240
<div class="input-field">
4341
<i class="fas fa-user"></i>
4442
<input type="text" placeholder="Username" />
4543
</div>
44+
<div class="input-field">
45+
<i class="fas fa-code-branch"></i>
46+
<input type="text" placeholder="Git Username" />
47+
</div>
4648
<div class="input-field">
4749
<i class="fas fa-envelope"></i>
4850
<input type="email" placeholder="Email" />
@@ -51,139 +53,53 @@ <h2 class="title">Sign up</h2>
5153
<i class="fas fa-lock toggle-password" id="toggle-password"></i>
5254
<input type="password" id="password-input" placeholder="Password" minlength="8" />
5355
</div>
56+
<div class="remember-me">
57+
<input type="checkbox" id="remember-me" />
58+
<label for="remember-me">Remember Me</label>
59+
</div>
5460
<input type="submit" class="btn" value="Sign up" />
5561
<p class="social-text">Or Sign up with social platforms</p>
5662
<div class="social-media">
57-
58-
<button type="button" class="github-login" id="gh-sg-btn">
59-
<img src="https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg" alt="GitHub" width="40" height="40" style="margin-left: 5px;">
63+
<button type="button" class="github-login" id="gh-sg-btn">
64+
<img src="https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg" alt="GitHub" width="40" height="40" style="margin-left: 5px;">
6065
</button>
6166
</div>
6267
</form>
6368
</div>
6469
</div>
6570

66-
<head>
67-
<meta charset="UTF-8" />
68-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
69-
<title>Register & Login</title>
70-
<!-- Link to add favicon -->
71-
<link rel="shortcut icon" href="assets/recode-hive.png" type="image/x-icon">
72-
<link rel="stylesheet" href="login.css" />
73-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" />
74-
75-
76-
</head>
77-
78-
<body>
79-
80-
<div class="container">
81-
<div class="forms-container">
82-
<div class="signin-signup">
83-
<form action="#" class="sign-in-form">
84-
<h2 class="title">Sign in</h2>
85-
<div class="input-field">
86-
<i class="fas fa-user"></i>
87-
<input type="text" placeholder="Username" />
88-
</div>
89-
<div class="input-field">
90-
<i class="fas fa-lock toggle-password" id="toggle-password"></i>
91-
<input type="password" id="password-input" placeholder="Password" required />
92-
</div>
93-
<div class="remember-me">
94-
<input type="checkbox" id="remember-me" />
95-
<label for="remember-me">Remember Me</label>
96-
</div>
97-
<input type="submit" value="Login" class="btn solid" />
98-
<p class="social-text">Or Sign in with social platforms</p>
99-
<div class="social-media">
100-
101-
102-
<a href="https://github.com/YourGitHubProfile" target="_blank">
103-
<img src="https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg" alt="GitHub"
104-
width="40" height="40" style="margin-left: 5px;">
105-
</a>
106-
</div>
107-
</form>
108-
<form action="#" class="sign-up-form">
109-
<h2 class="title">Sign up</h2>
110-
<div class="input-field">
111-
<i class="fas fa-user"></i>
112-
<input type="text" placeholder="Username" />
113-
</div>
114-
<div class="input-field">
115-
<i class="fas fa-code-branch"></i>
116-
<input type="text" placeholder="Git Username" />
117-
</div>
118-
<div class="input-field">
119-
<i class="fas fa-envelope"></i>
120-
<input type="email" placeholder="Email" />
121-
</div>
122-
<div class="input-field">
123-
<i class="fas fa-lock toggle-password" id="toggle-password"></i>
124-
<input type="password" id="password-input" placeholder="Password" minlength="8" />
125-
</div>
126-
<div class="remember-me">
127-
<input type="checkbox" id="remember-me" />
128-
<label for="remember-me">Remember Me</label>
129-
</div>
130-
<input type="submit" class="btn" value="Sign up" />
131-
<p class="social-text">Or Sign up with social platforms</p>
132-
<div class="social-media">
133-
134-
<a href="https://github.com/YourGitHubProfile" target="_blank">
135-
<img src="https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg" alt="GitHub"
136-
width="40" height="40" style="margin-left: 5px;">
137-
</a>
71+
<div class="panels-container">
72+
<a href="index.html" class="homeBtn">
73+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 20" width="30" height="30">
74+
<path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />
75+
</svg>
76+
</a>
77+
<div class="panel left-panel">
78+
<div class="content">
79+
<h3>New here ?</h3>
80+
<p>
81+
Discover new experiences and profiles with awesome-github-profiles <br>Get access to exclusive content and features. <br> Create your account.
82+
</p>
83+
<button class="btn transparent" id="sign-up-btn">
84+
Sign up
85+
</button>
13886
</div>
139-
</form>
140-
</div>
141-
</div>
142-
143-
<div class="panels-container">
144-
<a href="index.html" class="homeBtn">
145-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 20" width="30" height="30">
146-
<path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />
147-
</svg>
148-
</a>
149-
<div class="panel left-panel">
150-
<div class="content">
151-
<h3>New here ?</h3>
152-
<p>
153-
Discover new experiences and profiles with awesome-github-profiles <br>Get access to exclusive content and
154-
features. <br> Create your account.
155-
</p>
156-
<a href="index.html" class="homeBtn">
157-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 20" width="30" height="30">
158-
<path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />
159-
</svg>
160-
</a>
161-
<button class="btn transparent" id="sign-up-btn">
162-
Sign up
163-
</button>
87+
<img src="img/log.svg" class="image" alt="" />
16488
</div>
165-
<img src="img/log.svg" class="image" alt="" />
166-
</div>
167-
<div class="panel right-panel">
168-
169-
<div class="content">
170-
171-
<h3>One of us ?</h3>
172-
<p>
173-
Welcome to our community
174-
</p>
175-
<button class="btn transparent" id="sign-in-btn">
176-
Sign in
177-
</button>
178-
89+
<div class="panel right-panel">
90+
<div class="content">
91+
<h3>One of us ?</h3>
92+
<p>
93+
Welcome to our community
94+
</p>
95+
<button class="btn transparent" id="sign-in-btn">
96+
Sign in
97+
</button>
98+
</div>
99+
<img src="img/register.svg" class="image" alt="" />
179100
</div>
180-
<img src="img/register.svg" class="image" alt="" />
181101
</div>
182-
183102
</div>
184-
185-
</div>
186-
<script src="login.js"></script>
187-
</body>
188-
189-
</html>
103+
<script src="login.js"></script>
104+
</body>
105+
</html>

0 commit comments

Comments
 (0)