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

Facbook fix #369

Merged
merged 1 commit into from
Jun 22, 2024
Merged
Show file tree
Hide file tree
Changes from all 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
66 changes: 66 additions & 0 deletions Front-end-Projects/Basic/Facebook-Login-Page/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
<h1 align='center'><b>💥 Facebook Login Page Clone 💥</b></h1>

<!-- -------------------------------------------------------------------------------------------------------------- -->

<h3 align='center'>Tech Stack Used 🎮</h3>


<div align='center'>

![HTML5](https://img.shields.io/badge/html5-%23E34F26.svg?style=for-the-badge&logo=html5&logoColor=white)
![Tailwind CSS](https://img.shields.io/badge/tailwindcss-%231572B6.svg?style=for-the-badge&logo=tailwindcss&logoColor=white)

</div>


![Line](https://github.com/Avdhesh-Varshney/WebMasterLog/assets/114330097/4b78510f-a941-45f8-a9d5-80ed0705e847)

<!-- -------------------------------------------------------------------------------------------------------------- -->

## :zap: Description 📃

<div>
<p>This project is a simple HTML and Tailwind CSS implementation of a Facebook Login Page clone. It aims to replicate the basic structure and styling of the popular entertaining Facebook Login Page.This project Showcases the power of HTML and Tailwind CSS.</p>
</div>

<!-- -------------------------------------------------------------------------------------------------------------- -->

## :zap: How to run it? 🕹️

<div>
<p>To run this project locally, follow these steps:

1. Fork the repository.

2. Clone the repository to your local machine:
git clone https://github.com/your-username/Facebook-Login-Page.git

3. Open the project folder in your preferred code editor, now you can view website in live.

</p>
</div>

<!-- -------------------------------------------------------------------------------------------------------------- -->

## :zap: Screenshots 📸
<!-- add the screenshot of the project (Mandatory) -->

<img src='./screenshot.webp'>

![Line](https://github.com/Avdhesh-Varshney/WebMasterLog/assets/114330097/4b78510f-a941-45f8-a9d5-80ed0705e847)

<!-- -------------------------------------------------------------------------------------------------------------- -->

<h4 align='center'>Developed By <b><i>Bhavy Zala</i></b></h4>
<p align='center'>
<a href='https://www.linkedin.com/in/bhavy-zala-59bb76241?utm_source=share&utm_campaign=share_via&utm_content=profile&utm_medium=android_app'>
<img src='https://img.shields.io/badge/linkedin-%230077B5.svg?style=for-the-badge&logo=linkedin&logoColor=white' />
</a>
<a href='https://github.com/zalabhavy'>
<img src='https://img.shields.io/badge/github-%23121011.svg?style=for-the-badge&logo=github&logoColor=white' />
</a>
</p>

<h4 align='center'>Happy Coding 🧑‍💻</h4>

<h3 align="center">Show some &nbsp;❤️&nbsp; by &nbsp;🌟&nbsp; this repository!</h3>
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions Front-end-Projects/Basic/Facebook-Login-Page/images/fb.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
28 changes: 28 additions & 0 deletions Front-end-Projects/Basic/Facebook-Login-Page/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.tailwindcss.com"></script>
<link rel="icon" type="image/x-icon" href="./images/favicon.png">
<title>Facebook - Login or Sign up</title>
</head>
<body class="bg-gray-100">
<div class="container mt-48 flex mx-auto items-center justify-center">
<div class="left mx-11">
<img src="./images/fb.svg" alt="" class="w-80">
<p class="text-xl mx-8">Facebook helps you connect and share with the people in your life.</p>
</div>
<div class="right flex flex-col bg-white p-8 rounded-xl w-1/3">
<input class="px-4 h-10 my-2 outline-blue-600 border border-1 border-gray-400 rounded-lg" type="text" placeholder="Email or Phonenumber">
<input class="px-4 h-10 my-2 outline-blue-600 border border-1 border-gray-400 rounded-lg" type="text" placeholder="Password">
<button class="bg-blue-600 hover:bg-blue-700 text-white my-2 py-1.5 rounded-md font-bold active:bg-blue-500">Login</button>
<span class="text-blue-600 text-center text-sm my-2 cursor-pointer hover:underline">Forgotten Password</span>
<hr class="my-1">
<button class="bg-green-600 hover:bg-green-700 text-white my-2 py-1.5 rounded-md font-bold px-4 w-fit mx-auto active:bg-green-500">Create New Account</button>

</div>
</div>

</body>
</html>
Binary file not shown.
4 changes: 3 additions & 1 deletion Front-end-Projects/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,9 @@
| 8 | [Spotify Clone](./Intermediate/Spotify-Clone)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
| 9 | [Apple Clone](./Intermediate/Apple-Clone )| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
| 10 | [Reddit Clone](./Intermediate/Reddit-Clone)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
11 | [Microsoft Clone](./Intermediate/Microsoft-Clone)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
| 11 | [Microsoft Clone](./Intermediate/Microsoft-Clone)| ![Intermediate](https://img.shields.io/badge/Intermediate-FFD700?style=for-the-badge) |
| 12 | [Facebook Login Page](./Basic/Facebook-Login-Page) | ![Basic](https://img.shields.io/badge/Basic-00FF00?style=for-the-badge) |




Expand Down
5 changes: 5 additions & 0 deletions database/frontend.json
Original file line number Diff line number Diff line change
Expand Up @@ -33,5 +33,10 @@
"tag": "Intermediate",
"title": "Microsoft Clone",
"description": "This project is a simple HTML and Tailwind CSS implementation of a Microsoft website clone. It aims to replicate the basic structure and styling of the popular entertaining website Microsoft. This project Showcases the power of HTML and Tailwind CSS."
},
{
"tag": "Basic",
"title": "Facebook Login Page",
"description": "This project is a simple HTML and Tailwind CSS implementation of a Facebook Login Page clone. It aims to replicate the basic structure and styling of the popular entertaining Facebook Login Page. This project Showcases the power of HTML and Tailwind CSS."
}
]