diff --git a/src/main/resources/static/css/style.css b/src/main/resources/static/css/style.css new file mode 100644 index 0000000000000000000000000000000000000000..2c058cc9c27f36e6d2dab6e9ea37d3183f63af8b --- /dev/null +++ b/src/main/resources/static/css/style.css @@ -0,0 +1,65 @@ +*{ + margin: 0; + padding: 0; + box-sizing: border-box; +} +body{ + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; + background: #1f1f47; + overflow: hidden; +} +.wrapper{ + position: relative; + width: 400px; + height: 450px; + background: rgba(255, 255, 255, 0.15); + box-shadow: 0 8px 32px rgba(31, 38, 135, 0.37); + border: 1px solid rgba(255, 255, 255, 0.18); + border-radius: 20px; + display: flex; + justify-content: center; + align-items: center; +} +h2{ + color: #666; + text-align: center; + font-size: 2em; +} +.input-box{ + position: relative; + width: 220px; + margin: 30px 0; + border-bottom: 2px solid #fff; +} +.input-box label{ + position: absolute; + top: -100%; + left: 5px; + transform: translateY(); + font-size: 1em; + pointer-events: none; + color: #fff; +} +button{ + width: 100%; + height: 45px; + background: #fa709a; + border: none; + outline: none; + border-radius: 40px; + cursor: pointer; + font-size: 1em; + color: #fff; + font-weight: 400; +} +.register-link{ + text-align: center; + color: #fff; +} +.register-link a{ + color: #fff; + +} \ No newline at end of file diff --git a/src/main/resources/static/login.html b/src/main/resources/static/login.html index 566549bdf8fae810809c1a81066000687cb338f6..5a09131cc2971566dac6b87bd73cbc9b03e2a225 100644 --- a/src/main/resources/static/login.html +++ b/src/main/resources/static/login.html @@ -3,8 +3,27 @@ <head> <meta charset="UTF-8"> <title>Title</title> + <link rel="stylesheet" href="../static/css/style.css"> </head> <body> - +<div class="blob"></div> +<div class="wrapper"> + <form action=""> + <h2>Homepage</h2> + <div class="input-box"> + <input type="email" required> + <label for="">登录邮箱</label> + </div> + <div class="input-box"> + <input type="password" required> + <label for="">输入密ç </label> + </div> + + <button type="submit">log in</button> + <div class="register-link"> + <p>还没有账å·ï¼Ÿ<a href="register.html">点击注册</a></p> + </div> + </form> +</div> </body> </html> \ No newline at end of file diff --git a/src/main/resources/static/register.html b/src/main/resources/static/register.html index 566549bdf8fae810809c1a81066000687cb338f6..a4364bcb7d54c72d1fec220cd00eba68d8ec476d 100644 --- a/src/main/resources/static/register.html +++ b/src/main/resources/static/register.html @@ -3,8 +3,26 @@ <head> <meta charset="UTF-8"> <title>Title</title> + <link rel="stylesheet" href="../static/css/style.css"> </head> <body> - + <div class="blob"></div> + <div class="wrapper"> + <form action=""> + <h2>Register</h2> + <div class="input-box"> + <input type="email" required> + <label for="">登录邮箱</label> + </div> + <div class="input-box"> + <input type="password" required> + <label for="">输入密ç </label> + </div> + <div class="input-box"> + <input type="password" required> + <label for="">确认密ç </label> + </div> + + </form> </body> </html> \ No newline at end of file