facebook--clone/index.html at main · manisha-7725/facebook--clone · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Facebook</title>
    <link rel="icon" type="image/png" href="logo.png">
</head>

<body class="bg-gray-100">

    <div class="container mt-48 flex mx-auto items-center justify-center">

        <div class="left w-1/3 mx-14">
            <img class="w-80" src="fb.svg" alt="">
            <p class=" text-3xl mx-8">Facebook helps you connent and share with the people in your life</p>
        </div>
        <div class="right flex flex-col bg-white p-8 rounded-xl w-1/4 text-lg relative">
            <input class="px-4 h-12 my-2 border  border-1 outline-blue-600 border-gray-200 rounded-lg" type="text" placeholder="Email address or phone number">
            <input  class="px-4 h-12 my-3 border border-1 outline-blue-600  border-gray-200 rounded-lg" type="password" placeholder="Email address or phone number">
            <button class="bg-blue-600 hover:bg-blue-700 text-white my-2 py-3 rounded-md font-bold text-xl">Log In</button>
            <span class="text-blue-600 text-center text-sm my-3 cursor-pointer hover:underline">Forgotten password?</span>
            <hr class="my-3">
            <button class="bg-green-600 hover:bg-green-700  text-white my-2 py-3 px-4 mx-auto rounded-md font-bold text-xl w-fit">Create New Account</button>
            <span class="absolute-bottom-10 text-sm">
                <span class="font-bold">Create a Page</span> for a celebrity brand or business.
            </span>
        </div>
    </div>
</body>

</html>