Skip to content

Commit

Permalink
LoginSignupPageDone
Browse files Browse the repository at this point in the history
  • Loading branch information
dhyaneshsiddhartha15 committed May 13, 2024
1 parent 1151eca commit 9784dad
Show file tree
Hide file tree
Showing 3 changed files with 141 additions and 10 deletions.
4 changes: 4 additions & 0 deletions frontend/src/Pages/Landing-Page.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,15 @@ import MeetingCards from "../Components/Pages/Landing-Page/MeetingCards";
import OurTeam from "../Components/Pages/Landing-Page/OurTeam";
import JoinRoom from "./JoinRoom-Page";
import HeroSection from "../Components/Pages/Landing-Page/HeroSection";
import SignIn from "./SignIn-Page";
import SignUp from "./SignUp-Page";

export const LandingPage = () => {
return (
<div>
<HeroSection />
<SignIn/>
<SignUp/>
<JoinRoom />
<MeetingCards />
<HeroSection />
Expand Down
74 changes: 68 additions & 6 deletions frontend/src/Pages/SignIn-Page.jsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,72 @@
import React from "react";
import loginImage from '../../assets/Home-Page-Assets/CuriousConnect.png';

// please call the signin component which is available in "/frontend/src/Components/common/SignIn.jsx"

// this is root page
const SignInPage = () => {
return <div>SignInPage</div>;
const SignIn = () => {
return (
<div className="flex justify-center w-full h-full ">
<div
className="md:w-full bg-cover bg-blue-700 sm:block hidden"
style={{
backgroundImage: `url(${loginImage})`,
}}
></div>
<div className="flex bg-white rounded-lg shadow-lg border w-[2000px] h-[630px] ">


<div className=" w-full mt-40 p-8 lg:w-1/2 ">


<div class="flex flex-col items-center">
<p className="text-2xl text-gray-600 md:text-right lg:text-right sm:text-center font-bold">Sign in With</p>

<p className="text-s text-gray-600 md:text-right md:ml-28 lg:text-right sm:text-center p-1">
Not have an account yet? <span className="text-black-700 font-bold ">Sign In</span>
</p>
<button
className="bg-purple-700 text-white lg:ml-44 md:ml-52 w-full border border-solid max-w-xs font-bold shadow-sm rounded-lg py-3 flex items-center justify-center transition-all duration-300 ease-in-out focus:outline-none hover:shadow focus:shadow-sm focus:shadow-outline">
<div class="bg-white p-2 rounded-full">

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" className="w-6 h-6">
<path fill="none" d="M0 0h24v24H0V0z"/>
<path fill="#282828" d="M21.3 6H2.7C1.78 6 1 6.78 1 7.7v8.6c0 .92.78 1.7 1.7 1.7h18.6c.92 0 1.7-.78 1.7-1.7V7.7c0-.92-.78-1.7-1.7-1.7zm.7 10c0 .38-.32.7-.7.7H2.7c-.38 0-.7-.32-.7-.7V7.7c0-.38.32-.7.7-.7h18.6c.38 0 .7.32.7.7v8.6z"/>
<path fill="#282828" d="M12 11.58l8.19-6.56c.34-.27.81-.27 1.15 0 .39.31.4.85.02 1.18L13.15 12l8.25 6.59c.38.32.37.87-.02 1.18-.16.13-.36.19-.55.19-.22 0-.43-.08-.6-.24L12 13.58l-7.19 5.75c-.17.14-.38.22-.6.22-.19 0-.39-.06-.55-.19-.39-.31-.4-.85-.02-1.18L10.85 12l-8.25-6.59c-.38-.32-.37-.87.02-1.18.34-.27.81-.27 1.15 0L12 11.58z"/>
</svg>
</div>
<span class="ml-4">
Continue with E-mail
</span>
</button>
</div>

<div class="flex flex-col items-center ">
<button
className=" lg:ml-44 md:ml-52 w-full border border-dashed max-w-xs font-bold shadow-sm rounded-lg py-3 bg-white text-gray-800 flex items-center justify-center transition-all duration-300 ease-in-out focus:outline-none hover:shadow focus:shadow-sm focus:shadow-outline">
<div class="bg-white p-2 rounded-full">
<svg class="w-4" viewBox="0 0 533.5 544.3">
<path
d="M533.5 278.4c0-18.5-1.5-37.1-4.7-55.3H272.1v104.8h147c-6.1 33.8-25.7 63.7-54.4 82.7v68h87.7c51.5-47.4 81.1-117.4 81.1-200.2z"
fill="#4285f4" />
<path
d="M272.1 544.3c73.4 0 135.3-24.1 180.4-65.7l-87.7-68c-24.4 16.6-55.9 26-92.6 26-71 0-131.2-47.9-152.8-112.3H28.9v70.1c46.2 91.9 140.3 149.9 243.2 149.9z"
fill="#34a853" />
<path
d="M119.3 324.3c-11.4-33.8-11.4-70.4 0-104.2V150H28.9c-38.6 76.9-38.6 167.5 0 244.4l90.4-70.1z"
fill="#fbbc04" />
<path
d="M272.1 107.7c38.8-.6 76.3 14 104.4 40.8l77.7-77.7C405 24.6 339.7-.8 272.1 0 169.2 0 75.1 58 28.9 150l90.4 70.1c21.5-64.5 81.8-112.4 152.8-112.4z"
fill="#ea4335" />
</svg>
</div>
<span class="ml-4">
Sign In with Google
</span>
</button>
</div>

</div>
</div>
</div>
);
};

export default SignInPage;
export default SignIn;
73 changes: 69 additions & 4 deletions frontend/src/Pages/SignUp-Page.jsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,72 @@
import React from "react";
import loginImage from '../../assets/Home-Page-Assets/CuriousConnect.png';

const SignUpPage = () => {
return <div>SignUp-Page</div>;
};

export default SignUpPage;
const SignUp = () => {
return (
<div className="flex justify-center w-full h-full ">
<div
className="md:w-full bg-cover bg-blue-700 sm:block hidden"
style={{
backgroundImage: `url(${loginImage})`,
}}
></div>
<div className="flex bg-white rounded-lg shadow-lg border w-[2000px] h-[630px] ">


<div className=" w-full mt-40 p-8 lg:w-1/2 ">


<div class="flex flex-col items-center">
<p className="text-2xl text-gray-600 md:text-right lg:text-right sm:text-center font-bold">Sign Up With</p>

<p className="text-s text-gray-600 md:text-right md:ml-28 lg:text-right sm:text-center p-1">
Not have an account yet? <span className="text-black-700 font-bold ">Sign Up</span>
</p>
<button
className="bg-purple-700 text-white lg:ml-44 md:ml-52 w-full border border-solid max-w-xs font-bold shadow-sm rounded-lg py-3 flex items-center justify-center transition-all duration-300 ease-in-out focus:outline-none hover:shadow focus:shadow-sm focus:shadow-outline">
<div class="bg-white p-2 rounded-full">

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" className="w-6 h-6">
<path fill="none" d="M0 0h24v24H0V0z"/>
<path fill="#282828" d="M21.3 6H2.7C1.78 6 1 6.78 1 7.7v8.6c0 .92.78 1.7 1.7 1.7h18.6c.92 0 1.7-.78 1.7-1.7V7.7c0-.92-.78-1.7-1.7-1.7zm.7 10c0 .38-.32.7-.7.7H2.7c-.38 0-.7-.32-.7-.7V7.7c0-.38.32-.7.7-.7h18.6c.38 0 .7.32.7.7v8.6z"/>
<path fill="#282828" d="M12 11.58l8.19-6.56c.34-.27.81-.27 1.15 0 .39.31.4.85.02 1.18L13.15 12l8.25 6.59c.38.32.37.87-.02 1.18-.16.13-.36.19-.55.19-.22 0-.43-.08-.6-.24L12 13.58l-7.19 5.75c-.17.14-.38.22-.6.22-.19 0-.39-.06-.55-.19-.39-.31-.4-.85-.02-1.18L10.85 12l-8.25-6.59c-.38-.32-.37-.87.02-1.18.34-.27.81-.27 1.15 0L12 11.58z"/>
</svg>
</div>
<span class="ml-4">
Continue with E-mail
</span>
</button>
</div>

<div class="flex flex-col items-center ">
<button
className=" lg:ml-44 md:ml-52 w-full border border-dashed max-w-xs font-bold shadow-sm rounded-lg py-3 bg-white text-gray-800 flex items-center justify-center transition-all duration-300 ease-in-out focus:outline-none hover:shadow focus:shadow-sm focus:shadow-outline">
<div class="bg-white p-2 rounded-full">
<svg class="w-4" viewBox="0 0 533.5 544.3">
<path
d="M533.5 278.4c0-18.5-1.5-37.1-4.7-55.3H272.1v104.8h147c-6.1 33.8-25.7 63.7-54.4 82.7v68h87.7c51.5-47.4 81.1-117.4 81.1-200.2z"
fill="#4285f4" />
<path
d="M272.1 544.3c73.4 0 135.3-24.1 180.4-65.7l-87.7-68c-24.4 16.6-55.9 26-92.6 26-71 0-131.2-47.9-152.8-112.3H28.9v70.1c46.2 91.9 140.3 149.9 243.2 149.9z"
fill="#34a853" />
<path
d="M119.3 324.3c-11.4-33.8-11.4-70.4 0-104.2V150H28.9c-38.6 76.9-38.6 167.5 0 244.4l90.4-70.1z"
fill="#fbbc04" />
<path
d="M272.1 107.7c38.8-.6 76.3 14 104.4 40.8l77.7-77.7C405 24.6 339.7-.8 272.1 0 169.2 0 75.1 58 28.9 150l90.4 70.1c21.5-64.5 81.8-112.4 152.8-112.4z"
fill="#ea4335" />
</svg>
</div>
<span class="ml-4">
Sign In with Google
</span>
</button>
</div>

</div>
</div>
</div>
);
};
export default SignUp;

0 comments on commit 9784dad

Please sign in to comment.