login.jsp 3.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  3. <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
  4. <html>
  5. <head>
  6. <title>Login Page</title>
  7. <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-aFq/bzH65dt+w6FI2ooMVUpc+21e0SRygnTpmBvdBgSdnuTN7QbdgL+OapgHtvPp" crossorigin="anonymous">
  8. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha2/dist/js/bootstrap.bundle.min.js" integrity="sha384-qKXV1j0HvMUeCBQ+QVp7JcfGl760yU08IQ+GpUo5hlbpg51QRiuqHAJz8+BrxE/N" crossorigin="anonymous"></script>
  9. <style>
  10. body {
  11. background-color: #343a40;
  12. }
  13. .container {
  14. display: flex;
  15. justify-content: center;
  16. align-items: center;
  17. height: 100vh;
  18. }
  19. .login-box {
  20. width: 400px;
  21. padding: 20px;
  22. background: #fff;
  23. border-radius: 2px;
  24. border: 1px solid #000;
  25. }
  26. .login-box h3 {
  27. text-align: center;
  28. margin-bottom: 20px;
  29. }
  30. .login-box .error {
  31. padding: 15px;
  32. margin-bottom: 20px;
  33. border: 1px solid transparent;
  34. border-radius: 4px;
  35. color: #a94442;
  36. background-color: #f2dede;
  37. border-color: #ebccd1;
  38. }
  39. .login-box .msg {
  40. padding: 15px;
  41. margin-bottom: 20px;
  42. border: 1px solid transparent;
  43. border-radius: 4px;
  44. color: #31708f;
  45. background-color: #d9edf7;
  46. border-color: #bce8f1;
  47. }
  48. .login-box .register-text {
  49. text-align: center;
  50. margin-top: 10px;
  51. }
  52. </style>
  53. </head>
  54. <body onload='document.loginForm.username.focus();'>
  55. <div class="container">
  56. <div class="login-box">
  57. <h3>Login with Username and Password</h3>
  58. <c:if test="${not empty error}">
  59. <div class="error">${error}</div>
  60. </c:if>
  61. <c:if test="${not empty msg}">
  62. <div class="msg">${msg}</div>
  63. </c:if>
  64. <form name='loginForm' action="<c:url value='/login'/>" method='POST'>
  65. <div class="mb-3">
  66. <label for="inputEmail" class="form-label">Username</label>
  67. <input type="text" name='login' id="inputEmail" class="form-control" placeholder="Enter your username" required autofocus>
  68. </div>
  69. <div class="mb-3">
  70. <label for="inputPassword" class="form-label">Password</label>
  71. <input type="password" name='password' id="inputPassword" class="form-control" placeholder="Enter your password" required>
  72. </div>
  73. <input class="btn btn-primary" type="submit" value="Sign in">
  74. <input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}" />
  75. </form>
  76. <div class="register-text">
  77. Don't have an account? <a href="/register">Register</a>
  78. </div>
  79. </div>
  80. </div>
  81. </body>
  82. </html>