Last active
April 11, 2018 09:27
-
-
Save zhuqiuzhi/8ee866146999cd1955c2c8b73e5a5719 to your computer and use it in GitHub Desktop.
login page use bootstrap
This file contains hidden or 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
| body { | |
| padding-top: 40px; | |
| padding-bottom: 40px; | |
| background-color: #eee; | |
| } | |
| .form-signin { | |
| max-width: 330px; | |
| padding: 15px; | |
| margin: 0 auto; | |
| } | |
| .form-signin .form-signin-heading, | |
| .form-signin .checkbox { | |
| margin-bottom: 10px; | |
| } | |
| .form-signin .checkbox { | |
| font-weight: normal; | |
| } | |
| .form-signin .form-control { | |
| position: relative; | |
| height: auto; | |
| -webkit-box-sizing: border-box; | |
| -moz-box-sizing: border-box; | |
| box-sizing: border-box; | |
| padding: 10px; | |
| font-size: 16px; | |
| } | |
| .form-signin .form-control:focus { | |
| z-index: 2; | |
| } | |
| .form-signin input[type="email"] { | |
| margin-bottom: -1px; | |
| border-bottom-right-radius: 0; | |
| border-bottom-left-radius: 0; | |
| } | |
| .form-signin input[type="password"] { | |
| margin-bottom: 10px; | |
| border-top-left-radius: 0; | |
| border-top-right-radius: 0; | |
| } |
This file contains hidden or 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
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> | |
| <meta name="description" content=""> | |
| <meta name="author" content=""> | |
| <link rel="icon" href="favicon.ico"> | |
| <title>Login</title> | |
| <!-- Bootstrap core CSS --> | |
| <link href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet"> | |
| <link href="login.css" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <img src="logo.png" class="img-fluid rounded mx-auto d-block"> | |
| <form class="form-signin" action="/login" method="post"> | |
| <h2 class="form-signin-heading">Please sign in</h2> | |
| <label for="name" class="sr-only">LDAP Name</label> | |
| <input type="text" id="name" class="form-control" placeholder="LDAP Name" required autofocus> | |
| <label for="inputPassword" class="sr-only">Password</label> | |
| <input type="password" id="inputPassword" class="form-control" placeholder="Password" required> | |
| <div class="checkbox"> | |
| <label> | |
| <input type="checkbox" value="remember-me"> Remember me | |
| </label> | |
| </div> | |
| <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button> | |
| <input type="hidden" name="target" value="TARGET"> | |
| </form> | |
| </div> <!-- /container --> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment