-
Notifications
You must be signed in to change notification settings - Fork 12
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into testimonial-slider
- Loading branch information
Showing
8 changed files
with
166 additions
and
20 deletions.
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,58 @@ | ||
import React, { useState } from "react"; | ||
import Link from "next/link"; | ||
import CommonLayout from "../Layouts/CommonLayout"; | ||
import menu from "../Menus/Menu"; | ||
import ActiveMenu from "./ActiveMenu"; | ||
|
||
const MobileMainHeader = () => { | ||
const [menuOpen, setMenuOpen] = useState(false); | ||
|
||
const toggleMenu = () => { | ||
setMenuOpen(!menuOpen); | ||
}; | ||
|
||
return ( | ||
<header className="py-3 shadow-md"> | ||
<CommonLayout> | ||
<div className="lg:flex justify-between items-center"> | ||
<div> | ||
<img className="w-20" src="/assets/logo.svg" alt="RealMate" /> | ||
</div> | ||
<div | ||
className="fixed top-0 right-0 h-screen w-4/5 text-right lg:flex lg:items-center lg:space-x-4 lg:pr-4 px-3 py-3"> | ||
<button | ||
className=" text-3xl focus:outline-none" | ||
onClick={toggleMenu} | ||
> | ||
{menuOpen ? "X" : "☰"} | ||
</button> | ||
<ul className={`${menuOpen ? "text-right" : "hidden" | ||
}`}> | ||
{menu.main.items.map((item, index) => ( | ||
<li key={index} onClick={toggleMenu} className="py-2"> | ||
<ActiveMenu path={item.path} menu={item.title} /> | ||
</li> | ||
))} | ||
<br className="py-2" /> | ||
<li className="py-2"> | ||
<Link href={"signin"} onClick={toggleMenu}> | ||
<span>Sign in</span> | ||
</Link> | ||
</li> | ||
<li className="py-2"> | ||
<Link href={"/register"} onClick={toggleMenu}> | ||
<span className="btn-grade-sm">Register</span> | ||
</Link> | ||
</li> | ||
</ul> | ||
{menuOpen && | ||
<div style={{ zIndex: -1, opacity: 0.9 }} className="fixed top-0 right-0 h-full w-full bg-gradient-to-l from-white from-40% to-tertiary"></div> | ||
} | ||
</div> | ||
</div> | ||
</CommonLayout> | ||
</header> | ||
); | ||
}; | ||
|
||
export default MobileMainHeader; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,80 @@ | ||
import React from 'react'; | ||
import { FaGoogle } from 'react-icons/fa'; | ||
import { FaFacebook } from 'react-icons/fa'; | ||
import { FaTwitter } from 'react-icons/fa'; | ||
|
||
const Login =() => { | ||
return( | ||
<div> | ||
<div class="font-bold text-center text-xl p-4 m-4">Welcome Back!<br/> World number #1 matrimony site</div> | ||
<div class="w-full h-screen flex items-start"> | ||
<div class="relative w-1/2 h-full flex flex-col pl-20 pb-10"> | ||
<img src="./img/couple.png" class="w-full h-full object-cover bg-[#ffc5b2] rounded-l-lg"/> | ||
</div> | ||
<div class="w-1/2 mr-20 rounded-r-lg bg-purple-50 flex flex-col p-20 justify-between items-center "> | ||
<h1 class=" text-black text-bold text-lg font-semibold max-w-[500px] items-center mx-auto"> | ||
We always love to see you | ||
</h1> | ||
|
||
<div class=" w-full flex flex-col "> | ||
|
||
<div class="w-full flex flex-col"> | ||
<input | ||
type="text" | ||
placeholder="Email/Phone" | ||
pattern="^[a-zA-Z0-9+_.-]+@[a-zA-Z0-9.-]+$|^[\+]?[0-9]{1,3}[\s]?[\(]?[0-9]{1,6}[\)]?[-\s\./0-9]*$" | ||
class="w-full px-2 text-black border-b py-2 bg-white my-2 rounded-md outline-none focus:outline-none" | ||
/> | ||
<p class="text-sm text-gray-400">*use country code before your number.</p> | ||
<input | ||
type="password" | ||
placeholder="Password" | ||
class="w-full px-2 text-black border-b py-2 bg-white rounded-md my-2 outline-none focus:outline-none"/> | ||
</div> | ||
|
||
<div class="w-full flex items-center justify-between"> | ||
<div class="w-full flex items-center"> | ||
<input type="checkbox" class="w-4 h-4 mr-2"/> | ||
<p class="text-sm"> | ||
Remember me | ||
</p> | ||
|
||
</div> | ||
<button class="text-sm text-pink-400 font-semibold underline underline-offset-2 cursor-pointer whitespace-nowrap"> | ||
Forget password? | ||
</button> | ||
</div> | ||
<div class=" my-3 w-full flex flex col"> | ||
<button class=" w-full bg-pink-600 font-semibold my-2 rounded-md py-2 text-center flex items-center justify-center text-white"> | ||
Login Now | ||
</button> | ||
</div> | ||
<div class="flex justify-center"> | ||
<p class=" text-black/80 text-normal"> | ||
or Login with | ||
</p> | ||
</div> | ||
<button class=" font-semibold w-full bg-white my-2 rounded-md py-2 text-center flex items-center justify-center text-black "> | ||
<FaGoogle className="mr-2" />Signin With Google | ||
</button> | ||
|
||
<button class=" font-semibold w-full bg-white rounded-md my-2 py-2 text-center flex items-center justify-center text-black "> | ||
<FaTwitter className="mr-2" />Signin With twitter | ||
</button> | ||
<button class=" font-semibold w-full bg-white rounded-md my-2 py-2 text-center flex items-center justify-center text-black"> | ||
<FaFacebook className="mr-2" />Signin With facebook | ||
</button> | ||
</div> | ||
|
||
<div class="w-full flex my-4 items-center justify-center"> | ||
<p class="text-sm font-normal text-black"> | ||
Don't have a account? <span class="text-pink-400 font-semibold underline underline-offset-2 cursor-pointer"> Create Account </span> | ||
</p> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
); | ||
}; | ||
|
||
export default Login; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,7 @@ | ||
.btn-grade{ | ||
.btn-grade { | ||
@apply bg-gradient-to-b from-primary to-btngrad px-5 py-1 rounded-md text-white; | ||
} | ||
|
||
.btn-grade-sm { | ||
@apply bg-gradient-to-b from-primary to-btngrad px-1 py-1 rounded-md text-white; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters