Added new: Facebook login clone (appearance only).

SixxCodes · SixxCodes · commit 85290c4b5e91 · 2025-02-12T23:32:40.000-08:00
diff --git a/Facebook LogIn Clone (Mobile)/log_in.html b/Facebook LogIn Clone (Mobile)/log_in.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <title>Facebook - log in or sign up</title>
+        <meta charset="UTF-8">
+        <link rel="stylesheet" href="log_in_styles.css"/>
+    </head>
+    <body>
+        
+        <h1>facebook</h1>
+
+        <p>Connect with friends and the world<br/>around you on Facebook.</p>
+
+        <form>
+            <input id="username" class="inside-form" type="email" name="username" placeholder="Email or phone number"/><br/>
+            <input id="password" class="inside-form" type="password" name="password" placeholder="Password"/><br/>
+            <input id="log-in" class="inside-form" type="submit" value="Log In"/><br/>
+            <a id="forgot-password" class="inside-form" href="#">Forgot password?</a><br/>
+            <input id="create-new-account" class="inside-form" type="button" value="Create New Account"/>
+        </form>
+
+        <p><b>Create a Page</b> for a celebrity, brand or business.</p>
+
+        <footer>
+            <p>Language Language Language Language Language</p>
+            <p>Language Language Language Language Language</p>
+            <p>Language Language Language Language Language</p>
+        </footer>
+
+    </body>
+</html>
diff --git a/Facebook LogIn Clone (Mobile)/log_in_styles.css b/Facebook LogIn Clone (Mobile)/log_in_styles.css
@@ -0,0 +1,65 @@
+body{
+    margin: 0;
+    text-align: center;
+    font-family: sans-serif;
+}
+
+h1{
+    color: rgb(24, 119, 242);
+    font-family: 'Helvetica Neue', Times, serif;
+}
+
+form{
+    box-shadow: 0px 5px 5px 5px rgba(0, 0, 0, 0.192);
+    margin: 30px 50px;
+    padding: 20px;
+}
+
+.inside-form{
+    margin: 5px 0px;
+    font-family: sans-serif;
+}
+
+#username{
+    width:300px;
+    padding: 7px 0px;
+}
+
+#password{
+    width:300px;
+    padding: 7px 0px;
+}
+
+#log-in{
+    background-color: rgb(24, 119, 242);
+    border: 0;
+    width: 300px;
+    padding: 7px 0px;
+    color: white;
+    font-weight: bolder;
+    border-radius: 5px;
+}
+
+#forgot-password{
+    font-size: 14px;
+    text-decoration: none;
+}
+
+#create-new-account{
+    margin-top: 40px;
+    border: 0;
+    color: white;
+    background-color: rgb(37, 156, 33);
+    width: 150px;
+    padding: 10px 0px;
+    border-radius: 3px;
+}
+
+footer{
+    position: absolute;
+    box-shadow: 0px -5px 50px 40px rgba(0, 0, 0, 0.103);
+    bottom: 0px;
+    height: 130px;
+    width: 100%;
+    color: rgb(100, 100, 100);
+}
