style(static): 注册页图形验证码统一为 code-box 布局
- register.html 图形验证码改用 .code-box 行内布局,与邮箱验证码对齐 - theme.css 新增可复用 .captcha-img 类,替代内联样式 - README 功能列表补充表单组件说明
This commit is contained in:
1 parent
eb506e5cbf
commit
f003b4dfaa
3 files changed
+17
-5
No files matched your search
@@ -78,6 +78,7 @@ static :9200 (Flask + CORS)
|
|||||||
- 文件浏览:目录导航、面包屑、实时搜索(`/` 或 `Ctrl+F`)、文件统计
|
- 文件浏览:目录导航、面包屑、实时搜索(`/` 或 `Ctrl+F`)、文件统计
|
||||||
- 流媒体:视频(MP4/WebM/OGG/AVI/MOV/MKV)与音频(MP3/WAV/OGG/FLAC/AAC/M4A)在线播放,支持进度拖动
|
- 流媒体:视频(MP4/WebM/OGG/AVI/MOV/MKV)与音频(MP3/WAV/OGG/FLAC/AAC/M4A)在线播放,支持进度拖动
|
||||||
- 深色模式:`css/theme.css` 统一主题,自动适配系统偏好
|
- 深色模式:`css/theme.css` 统一主题,自动适配系统偏好
|
||||||
|
- 表单组件:注册页图形/邮箱验证码统一 `.code-box` 行内布局(文字标签 + 输入框 + 控件同排,窄屏自动换行),验证码图片样式复用 `theme.css` 的 `.captcha-img` 类
|
||||||
- 路径遍历防护:`safe_path_join` 限制访问范围在 `directory.root` 内
|
- 路径遍历防护:`safe_path_join` 限制访问范围在 `directory.root` 内
|
||||||
- Nuitka 编译:可打包为独立二进制 `fsys.bin`(`sys.frozen` 检测 + BASE_DIR 锚定)
|
- Nuitka 编译:可打包为独立二进制 `fsys.bin`(`sys.frozen` 检测 + BASE_DIR 锚定)
|
||||||
- 安全头注入:`security_middleware.py` 为所有响应注入 CSP、X-Frame-Options 等安全头
|
- 安全头注入:`security_middleware.py` 为所有响应注入 CSP、X-Frame-Options 等安全头
|
||||||
|
|||||||
@@ -190,6 +190,18 @@ input[type="button"]:disabled {
|
|||||||
}
|
}
|
||||||
.code-box input[type="text"] { width: auto; flex: 1; min-width: 100px; display: inline-block; }
|
.code-box input[type="text"] { width: auto; flex: 1; min-width: 100px; display: inline-block; }
|
||||||
.code-box input[type="button"] { white-space: nowrap; }
|
.code-box input[type="button"] { white-space: nowrap; }
|
||||||
|
/* 图形验证码图片(register 图形/邮箱验证码同排布局) */
|
||||||
|
.code-box .captcha-img {
|
||||||
|
width: 120px;
|
||||||
|
height: 38px;
|
||||||
|
flex: none;
|
||||||
|
cursor: pointer;
|
||||||
|
border: 1.5px solid var(--border);
|
||||||
|
border-radius: 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
object-fit: cover;
|
||||||
|
background: var(--bg);
|
||||||
|
}
|
||||||
|
|
||||||
/* ===== Validation Tips ===== */
|
/* ===== Validation Tips ===== */
|
||||||
.tip-red { color: var(--error); font-size: 0.78rem; }
|
.tip-red { color: var(--error); font-size: 0.78rem; }
|
||||||
|
|||||||
@@ -14,12 +14,11 @@
|
|||||||
<label>邮箱号:</label>
|
<label>邮箱号:</label>
|
||||||
<input type="email" id="regemail" placeholder="请输入邮箱号">
|
<input type="email" id="regemail" placeholder="请输入邮箱号">
|
||||||
<span id="emlTip"></span>
|
<span id="emlTip"></span>
|
||||||
<label>图形验证码:</label>
|
<div class="code-box">图形验证码:
|
||||||
<div style="display:flex;align-items:center;gap:8px">
|
<input type="text" id="captchaAnswer" placeholder="请输入图形验证码" maxlength="4" autocomplete="off">
|
||||||
<input type="text" id="captchaAnswer" placeholder="请输入图形验证码" maxlength="4" autocomplete="off" style="flex:1;min-width:0;width:auto">
|
<img id="captchaImg" class="captcha-img" alt="加载中…" title="点击刷新验证码">
|
||||||
<img id="captchaImg" alt="加载中…" title="点击刷新验证码" style="width:120px;height:38px;flex:none;cursor:pointer;border:1.5px solid var(--border);border-radius:10px;box-sizing:border-box">
|
|
||||||
</div>
|
|
||||||
<span id="captchaTip"></span>
|
<span id="captchaTip"></span>
|
||||||
|
</div>
|
||||||
<div class="code-box">邮箱验证码:
|
<div class="code-box">邮箱验证码:
|
||||||
<input type="text" id="code" placeholder="请输入6位验证码" inputmode="numeric" maxlength="6">
|
<input type="text" id="code" placeholder="请输入6位验证码" inputmode="numeric" maxlength="6">
|
||||||
<input type="button" id="getCode" value="获取验证码">
|
<input type="button" id="getCode" value="获取验证码">
|
||||||
|
|||||||
Reference in new issue
Block a user