zyc/video-shuoshan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 密码弹窗样式对齐 ConfirmModal 规范 (v0.9.4)
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 2m15s
Details

Browse Source 
背景 #16161e、圆角 var(--radius-card)、输入框 var(--color-bg-page)、
按钮 8px 圆角、onMouseDown 防拖拽误关、z-index 300

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
seaislee1209 2026-03-16 17:15:32 +08:00
parent b520b429c5
commit 45b7ca00d1
2 changed files with 18 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
web/src/pages/ProfilePage.module.css
View File

@ -391,23 +391,23 @@
}
}
/* Password Modal */
/* Password Modal — aligned with ConfirmModal / TeamsPage modal */
.modalOverlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.5);
background: rgba(0, 0, 0, 0.6);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
z-index: 300;
}
.modal {
background: var(--color-bg-card);
background: #16161e;
border: 1px solid var(--color-border-card);
border-radius: 12px;
border-radius: var(--radius-card);
padding: 24px;
width: 380px;
width: 400px;
max-width: 90vw;
}
@ -419,26 +419,25 @@
}
.formGroup {
margin-bottom: 14px;
margin-bottom: 16px;
}
.formLabel {
display: block;
font-size: 12px;
color: var(--color-text-secondary);
font-size: 13px;
margin-bottom: 6px;
}
.formInput {
width: 100%;
padding: 8px 12px;
background: rgba(255, 255, 255, 0.04);
background: var(--color-bg-page);
border: 1px solid var(--color-border-card);
border-radius: 6px;
border-radius: 8px;
color: var(--color-text-primary);
font-size: 13px;
font-size: 14px;
outline: none;
transition: border-color 0.2s;
box-sizing: border-box;
}
@ -454,30 +453,29 @@
.modalActions {
display: flex;
gap: 10px;
gap: 8px;
justify-content: flex-end;
margin-top: 20px;
}
.cancelBtn {
padding: 6px 16px;
padding: 8px 16px;
background: transparent;
border: 1px solid var(--color-border-card);
border-radius: 6px;
border-radius: 8px;
color: var(--color-text-secondary);
font-size: 13px;
cursor: pointer;
}
.saveBtn {
padding: 6px 16px;
padding: 8px 16px;
background: var(--color-primary);
border: none;
border-radius: 6px;
border-radius: 8px;
color: #fff;
font-size: 13px;
cursor: pointer;
transition: opacity 0.2s;
}
.saveBtn:disabled {

4
web/src/pages/ProfilePage.tsx
View File

@ -241,8 +241,8 @@ export function ProfilePage() {
</div>
{pwModalOpen && (
<div className={styles.modalOverlay} onClick={() => setPwModalOpen(false)}>
<div className={styles.modal} onClick={(e) => e.stopPropagation()}>
<div className={styles.modalOverlay} onMouseDown={(e) => { if (e.target === e.currentTarget) setPwModalOpen(false); }}>
<div className={styles.modal}>
<h3 className={styles.modalTitle}>修改密码</h3>
<div className={styles.formGroup}>
<label className={styles.formLabel}>旧密码</label>