Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enhancement: login page #446 #450

Merged
merged 4 commits into from
Nov 6, 2024
Merged
Show file tree
Hide file tree
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
76 changes: 36 additions & 40 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -260,17 +260,17 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
</a>
</td>
<td align="center">
<a href="https://github.com/haseebzaki-07">
<img src="https://avatars.githubusercontent.com/u/147314463?v=4" width="100;" alt="haseebzaki-07"/>
<a href="https://github.com/jainaryan04">
<img src="https://avatars.githubusercontent.com/u/138214350?v=4" width="100;" alt="jainaryan04"/>
<br />
<sub><b>Haseeb Zaki</b></sub>
<sub><b>Aryan Ramesh Jain</b></sub>
Comment on lines +263 to +266
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

LGTM on contributor updates, but please check for duplicates.

The contributor updates look good, but there are duplicate entries for some contributors:

  • Sajal Batra appears twice
  • PavanTeja2005 appears twice
  • Sourabh Singh Rawat appears twice

Please remove the duplicate entries to maintain a clean contributors list.

Also applies to: 270-273, 293-296, 300-303, 365-368, 374-377, 388-414, 488-493

</a>
</td>
<td align="center">
<a href="https://github.com/jainaryan04">
<img src="https://avatars.githubusercontent.com/u/138214350?v=4" width="100;" alt="jainaryan04"/>
<a href="https://github.com/haseebzaki-07">
<img src="https://avatars.githubusercontent.com/u/147314463?v=4" width="100;" alt="haseebzaki-07"/>
<br />
<sub><b>Aryan Ramesh Jain</b></sub>
<sub><b>Haseeb Zaki</b></sub>
</a>
</td>
<td align="center">
Expand All @@ -290,17 +290,17 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
</a>
</td>
<td align="center">
<a href="https://github.com/tejasbenibagde">
<img src="https://avatars.githubusercontent.com/u/124677750?v=4" width="100;" alt="tejasbenibagde"/>
<a href="https://github.com/itznayan">
<img src="https://avatars.githubusercontent.com/u/136584376?v=4" width="100;" alt="itznayan"/>
<br />
<sub><b>Tejas Benibagde</b></sub>
<sub><b>Mahera Nayan</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/itznayan">
<img src="https://avatars.githubusercontent.com/u/136584376?v=4" width="100;" alt="itznayan"/>
<a href="https://github.com/tejasbenibagde">
<img src="https://avatars.githubusercontent.com/u/124677750?v=4" width="100;" alt="tejasbenibagde"/>
<br />
<sub><b>Mahera Nayan</b></sub>
<sub><b>Tejas Benibagde</b></sub>
</a>
</td>
<td align="center">
Expand Down Expand Up @@ -362,19 +362,19 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
</a>
</td>
<td align="center">
<a href="https://github.com/CoderFleet">
<img src="https://avatars.githubusercontent.com/u/87255169?v=4" width="100;" alt="CoderFleet"/>
<a href="https://github.com/PavanTeja2005">
<img src="https://avatars.githubusercontent.com/u/98730339?v=4" width="100;" alt="PavanTeja2005"/>
<br />
<sub><b>Rudransh Pratap Singh</b></sub>
<sub><b>PavanTeja2005</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/Jay-1409">
<img src="https://avatars.githubusercontent.com/u/166749819?v=4" width="100;" alt="Jay-1409"/>
<a href="https://github.com/sajalbatra">
<img src="https://avatars.githubusercontent.com/u/125984550?v=4" width="100;" alt="sajalbatra"/>
<br />
<sub><b>Jay shah</b></sub>
<sub><b>Sajal Batra</b></sub>
</a>
</td>
<td align="center">
Expand All @@ -385,6 +385,8 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
</a>
</td>
<td align="center">
<a href="https://github.com/Jay-1409">
<img src="https://avatars.githubusercontent.com/u/166749819?v=4" width="100;" alt="Jay-1409"/>
<a href="https://github.com/Sourabh782">
<img src="https://avatars.githubusercontent.com/u/103349890?v=4" width="100;" alt="Sourabh782"/>
<br />
Expand All @@ -409,7 +411,7 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
<a href="https://github.com/PavanTeja2005">
<img src="https://avatars.githubusercontent.com/u/98730339?v=4" width="100;" alt="PavanTeja2005"/>
<br />
<sub><b>PavanTeja2005</b></sub>
<sub><b>Jay shah</b></sub>
</a>
</td>
</tr>
Expand All @@ -428,27 +430,15 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
<sub><b>Navneet Dadhich</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/AE-Hertz">
<img src="https://avatars.githubusercontent.com/u/93651229?v=4" width="100;" alt="AE-Hertz"/>
<br />
<sub><b>Abhinandan</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/lade6501">
<img src="https://avatars.githubusercontent.com/u/83055827?v=4" width="100;" alt="lade6501"/>
<br />
<sub><b>Vishal Lade</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/AnushkaChouhan25">
<img src="https://avatars.githubusercontent.com/u/157525924?v=4" width="100;" alt="AnushkaChouhan25"/>
<br />
<sub><b>Anushka Chouhan</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/REHAN-18">
<img src="https://avatars.githubusercontent.com/u/143922855?v=4" width="100;" alt="REHAN-18"/>
Expand Down Expand Up @@ -492,6 +482,15 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
<br />
<sub><b>Sushree Manaswini Biswal</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/Sourabh782">
<img src="https://avatars.githubusercontent.com/u/103349890?v=4" width="100;" alt="Sourabh782"/>
<br />
<sub><b>Sourabh Singh Rawat</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/Shiva-Bajpai">
Expand Down Expand Up @@ -537,6 +536,8 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
<sub><b>Ayush Yadav</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/smog-root">
<img src="https://avatars.githubusercontent.com/u/181578777?v=4" width="100;" alt="smog-root"/>
Expand Down Expand Up @@ -581,6 +582,8 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
<sub><b>Sapna Kul</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/Nikhil0-3">
<img src="https://avatars.githubusercontent.com/u/149102391?v=4" width="100;" alt="Nikhil0-3"/>
Expand Down Expand Up @@ -611,13 +614,6 @@ We extend our heartfelt gratitude to all the amazing contributors who have made
<sub><b>Jai Dhingra</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/IkkiOcean">
<img src="https://avatars.githubusercontent.com/u/76002919?v=4" width="100;" alt="IkkiOcean"/>
<br />
<sub><b>Vivek Prakash</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/harjasae2001">
<img src="https://avatars.githubusercontent.com/u/83627055?v=4" width="100;" alt="harjasae2001"/>
Expand Down
Binary file added frontend/src/assets/login-opt.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion frontend/src/components/Pages/EmailVerify.jsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Link, useNavigate } from 'react-router-dom';
import photo from '../../assets/login.png';
import photo from '../../assets/login-opt.png';
import React, { useState } from 'react';
import { message } from 'antd';

Expand Down
19 changes: 10 additions & 9 deletions frontend/src/components/Pages/Login.jsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react';
import photo from '../../assets/login.png';
import photo from '../../assets/login-opt.png';
import { Link, useNavigate } from 'react-router-dom';
import { message } from 'antd';
import Cookies from 'js-cookie';
Expand Down Expand Up @@ -55,28 +55,29 @@ const Login = () => {
}, []);

return (
<div className="w-screen h-screen dark:bg-black flex items-center justify-center lg:pt-10 px-4">
<div className="w-screen h-screen pt-10 flex flex-col lg:flex-row items-center justify-center lg:space-x-10 px-4 dark:bg-black">
{/* Background Image */}
<img
src={photo}
alt="login"
loading="lazy"
className="absolute w-3/4 lg:w-auto lg:opacity-100 opacity-10 object-cover"
className="w-3/4 max-w-xs lg:max-w-2xl lg:w-1/2 object-contain mb-6 lg:mb-0"
Comment on lines +66 to +72
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Enhance image loading and responsiveness.

While the current implementation addresses overflow issues, consider these improvements:

 <img
   src={photo}
   alt="login"
   loading="lazy"
-  className="w-3/4 max-w-xs lg:max-w-2xl lg:w-1/2 object-contain mb-6 lg:mb-0"
+  className="w-3/4 max-w-xs lg:max-w-2xl lg:w-1/2 object-contain mb-6 lg:mb-0 aspect-auto"
+  onError={(e) => {
+    e.target.onerror = null;
+    e.target.src = 'fallback-image.png';
+  }}
 />

Committable suggestion skipped: line range outside the PR's diff.

/>

{/* Login Form */}
<form
onSubmit={handleSubmit}
className="z-10 p-8 lg:p-16 bg-[#f1e9dc] dark:bg-amber-800 dark:text-white flex flex-col gap-6 rounded-lg border-2 border-black shadow-[4px_4px_0px_0px_black] w-full max-w-md lg:max-w-xl"
className="z-10 p-8 lg:p-16 bg-[#f1e9dc] dark:bg-amber-800 dark:text-white flex flex-col gap-6 rounded-lg border-2 border-black shadow-[4px_4px_0px_0px_black] w-full max-w-md lg:max-w-lg"
>
<div className="text-[#323232] dark:text-white font-black text-4xl lg:text-7xl mb-2">
<div className="text-[#323232] dark:text-white font-black text-3xl lg:text-5xl mb-2">
Welcome,
<span className="block text-[#666] dark:text-gray-400 font-semibold text-lg lg:text-2xl mt-1">
Log in to continue
</span>
</div>

<input
className="w-full h-12 rounded-md border-2 border-black bg-beige shadow-[4px_4px_0px_0px_black] text-[15px] font-semibold text-[#323232] p-2.5 focus:outline-none focus:border-[#2d8cf0] placeholder-[#666]"
className="w-full h-12 rounded-md border-2 border-black bg-beige shadow-[4px_4px_0px_0px_black] dark:shadow-[4px_4px_0px_0px_grey] text-[15px] font-semibold text-[#323232] p-2.5 focus:outline-none focus:border-[#2d8cf0] placeholder-[#666] dark:bg-slate-800 dark:placeholder-white"
name="email"
placeholder="Email"
type="email"
Expand All @@ -85,7 +86,7 @@ const Login = () => {

<div className="relative w-full">
<input
className="w-full h-12 rounded-md border-2 border-black bg-beige shadow-[4px_4px_0px_0px_black] text-[15px] font-semibold text-[#323232] p-2.5 focus:outline-none focus:border-[#2d8cf0] placeholder-[#666]"
className="w-full h-12 rounded-md border-2 border-black bg-beige shadow-[4px_4px_0px_0px_black] dark:shadow-[4px_4px_0px_0px_grey] text-[15px] font-semibold text-[#323232] p-2.5 focus:outline-none focus:border-[#2d8cf0] placeholder-[#666] dark:bg-slate-800 dark:placeholder-white"
name="password"
placeholder="Password"
type={hidden ? 'password' : 'text'}
Expand Down Expand Up @@ -134,7 +135,7 @@ const Login = () => {
>
<button
type="button"
className="w-full h-12 rounded-md border-2 dark:text-white border-black bg-beige shadow-[4px_4px_0px_0px_black] text-[17px] font-semibold text-[#323232] transition active:translate-x-[3px] active:translate-y-[3px]"
className="w-full h-12 rounded-md border-2 dark:text-white border-black bg-beige shadow-[4px_4px_0px_0px_black] dark:shadow-[4px_4px_0px_0px_grey] text-[17px] font-semibold text-[#323232] transition active:translate-x-[3px] active:translate-y-[3px]"
>
Sign in with Google
</button>
Expand All @@ -144,7 +145,7 @@ const Login = () => {

<button
type="submit"
className="w-full h-12 rounded-md dark:text-white border-2 border-black bg-beige shadow-[4px_4px_0px_0px_black] text-[17px] font-semibold text-[#323232] transition active:translate-x-[3px] active:translate-y-[3px]"
className="w-full h-12 rounded-md dark:text-white border-2 border-black bg-beige shadow-[4px_4px_0px_0px_black] dark:shadow-[4px_4px_0px_0px_grey] text-[17px] font-semibold text-[#323232] transition active:translate-x-[3px] active:translate-y-[3px]"
>
{isLoading ? 'Loading...' : 'Let’s Log you in →'}
</button>
Expand Down
Loading
Loading