Zzzz/Book-management-system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

前端

Browse Source
This commit is contained in:
Zzzz
2026-04-28 22:08:36 +08:00
parent d1f32b9d52
commit a37d37945b
7 changed files with 118 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/webapp/WEB-INF/jsp/auth/login.jsp
+1 -28
View File
@@ -13,16 +13,7 @@
<main class="auth-shell">
<section class="login-panel" aria-labelledby="login-title">
<div class="login-card-head">
<div class="login-brand-row">
<span class="login-brand-mark" aria-hidden="true">
<svg viewBox="0 0 48 48" focusable="false">
<path d="M8 11.5c0-2 1.6-3.5 3.5-3.5H22c1.5 0 2.8.6 3.8 1.6V39c-1-.8-2.3-1.2-3.8-1.2H11.5A3.5 3.5 0 0 1 8 34.3V11.5Z" fill="none" stroke="currentColor" stroke-width="3" stroke-linejoin="round"/>
<path d="M40 11.5c0-2-1.6-3.5-3.5-3.5H26c-1.5 0-2.8.6-3.8 1.6V39c1-.8 2.3-1.2 3.8-1.2h10.5a3.5 3.5 0 0 0 3.5-3.5V11.5Z" fill="none" stroke="currentColor" stroke-width="3" stroke-linejoin="round"/>
<path d="M14 15.5h7M14 22h7M27 15.5h7M27 22h7" stroke="currentColor" stroke-width="3" stroke-linecap="round"/>
</svg>
</span>
<h1 id="login-title">图书管理系统</h1>
</div>
<h1 id="login-title">图书管理系统</h1>
<p class="login-subtitle">欢迎登录图书管理平台</p>
</div>
@@ -84,24 +75,6 @@
</div>
</div>
<div class="login-role-group" role="radiogroup" aria-labelledby="login-role-label">
<span class="login-role-title" id="login-role-label">登录身份</span>
<div class="login-role-options">
<label>
<input type="radio" name="loginRole" value="administrator" checked>
<span>管理员</span>
</label>
<label>
<input type="radio" name="loginRole" value="librarian">
<span>馆员</span>
</label>
<label>
<input type="radio" name="loginRole" value="reader">
<span>读者</span>
</label>
</div>
</div>
<div class="login-options-row">
<label class="login-check">
<input type="checkbox" name="rememberUsername" value="true" data-remember-username>
src/main/webapp/static/css/app.css
+18 -91
View File
@@ -381,8 +381,8 @@ body:not(.auth-page) .dashboard-shell {
}
.login-panel {
width: min(540px, 100%);
padding: 44px 64px 56px;
width: min(500px, 100%);
padding: 42px 56px 50px;
}
.auth-page .login-panel {
@@ -394,46 +394,24 @@ body:not(.auth-page) .dashboard-shell {
.login-card-head {
display: grid;
gap: 12px;
gap: 8px;
justify-items: center;
margin-bottom: 34px;
margin-bottom: 30px;
text-align: center;
}
.login-brand-row {
display: flex;
align-items: center;
justify-content: center;
gap: 22px;
}
.login-brand-mark {
width: 58px;
height: 58px;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
color: #1372e8;
}
.login-brand-mark svg {
width: 100%;
height: 100%;
}
.login-card-head h1 {
margin: 0;
color: #0f2546;
font-size: 34px;
font-size: 32px;
font-weight: 900;
line-height: 1.14;
line-height: 1.16;
}
.login-subtitle {
margin: 0;
color: #6f7b8a;
font-size: 18px;
font-size: 17px;
line-height: 1.4;
}
@@ -469,7 +447,7 @@ h2 {
.login-form {
display: grid;
gap: 20px;
gap: 18px;
}
.login-form label,
@@ -605,34 +583,6 @@ h2 {
outline: 0;
}
.login-role-group {
min-width: 0;
display: flex;
align-items: center;
gap: 26px;
margin: 4px 0 0;
padding: 0;
border: 0;
}
.login-role-title {
flex: 0 0 auto;
padding: 0;
color: #1f2937;
font-size: 16px;
font-weight: 800;
}
.login-role-options {
min-width: 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 26px;
flex: 1 1 auto;
}
.login-role-options label,
.login-check {
display: inline-flex;
align-items: center;
@@ -644,7 +594,6 @@ h2 {
cursor: pointer;
}
.login-role-options input,
.login-check input {
width: 18px;
height: 18px;
@@ -658,7 +607,8 @@ h2 {
align-items: center;
justify-content: space-between;
gap: 16px;
margin-top: 2px;
margin-top: 0;
padding: 0 2px;
}
.forgot-password-link {
@@ -678,7 +628,7 @@ h2 {
}
.login-help-message {
margin: -10px 0 0;
margin: -8px 0 0;
padding: 9px 12px;
border: 1px solid rgba(20, 120, 200, 0.16);
border-radius: 8px;
@@ -737,16 +687,12 @@ h2 {
opacity: 0.58;
}
.login-form .button-primary {
margin-top: 12px;
}
.login-form .login-submit {
width: 100%;
min-height: 58px;
margin-top: 4px;
min-height: 56px;
margin-top: 2px;
border-radius: 8px;
font-size: 21px;
font-size: 20px;
box-shadow: 0 10px 22px rgba(20, 104, 234, 0.26);
}
@@ -1381,20 +1327,11 @@ h2 {
.login-card-head {
gap: 8px;
margin-bottom: 26px;
}
.login-brand-row {
gap: 12px;
}
.login-brand-mark {
width: 42px;
height: 42px;
margin-bottom: 24px;
}
.login-card-head h1 {
font-size: 26px;
font-size: 25px;
}
.login-subtitle {
@@ -1416,20 +1353,10 @@ h2 {
min-height: 50px;
}
.login-role-group {
align-items: flex-start;
flex-direction: column;
gap: 12px;
.login-form {
gap: 16px;
}
.login-role-options {
width: 100%;
justify-content: space-between;
gap: 10px;
flex-wrap: wrap;
}
.login-role-options label,
.login-check,
.forgot-password-link {
font-size: 14px;