fix: v1.5.2 — 修弹窗拖动误关 + 备注名/Token 输入框加图标
- 修拖动误关 bug:在弹窗内 mousedown 后拖到遮罩再松开 会被当作"点遮罩"关闭。改为只有 mousedown 和 click 都在 遮罩上才算关闭;弹窗内的文本选择/拖动不再误关 - 备注名输入框加 ✏️ 图标前缀、Token 输入框加 🔑 图标前缀, 输入聚焦时图标变紫色,更精致现代 - 备注名字体加粗、纯白背景,作为"主"字段视觉更突出 - Token 字段用等宽字体(像密码框该有的样子) - manifest 1.5.1 → 1.5.2
This commit is contained in:
@@ -980,6 +980,15 @@ input[readonly]{background:#f6f8fa;color:#646a73;cursor:not-allowed}
|
||||
.modal-body input[type=text]:focus,.modal-body input[type=password]:focus{border-color:#7c3aed;background:#fff;box-shadow:0 0 0 3px rgba(124,58,237,.12)}
|
||||
.modal-body input[readonly]{background:#f4f5f7;color:#374151;cursor:default;border-style:dashed}
|
||||
.modal-body input[readonly]:hover{background:#f4f5f7;border-color:#e5e8ec}
|
||||
/* 带前缀图标的输入框 */
|
||||
.mf-input{position:relative}
|
||||
.mf-input .mf-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:14px;color:#8a919e;pointer-events:none;line-height:1;transition:color .15s}
|
||||
.mf-input input{padding-left:36px}
|
||||
.mf-input input:focus+.mf-icon,.mf-input input:focus~.mf-icon{color:#7c3aed}
|
||||
.mf-input.mf-token input{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.3px}
|
||||
/* 让第一个字段(备注名)更突出一点 */
|
||||
.modal-field:first-of-type input[type=text]{font-weight:500;background:#fff}
|
||||
.modal-field:first-of-type input[type=text]:focus{background:#fff}
|
||||
.mf-info{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#f4f5f7;border:1.5px dashed #e0e3e8;border-radius:10px;color:#374151;font-size:14px}
|
||||
.mf-info .mfi-label{font-size:12px;color:#8a919e;font-weight:500;flex:none}
|
||||
.mf-info .mfi-value{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;word-break:break-all}
|
||||
@@ -1542,7 +1551,7 @@ refresh();
|
||||
<div class="modal-body">
|
||||
<div class="modal-field">
|
||||
<label class="mfl" for="addLabel">备注名</label>
|
||||
<input id="addLabel" placeholder="如:我的主账号" autocomplete="off">
|
||||
<div class="mf-input"><input id="addLabel" placeholder="如:我的主账号" autocomplete="off"><span class="mf-icon">✏️</span></div>
|
||||
</div>
|
||||
<div class="modal-field">
|
||||
<label class="mfl" for="addUser">GitHub 用户名</label>
|
||||
@@ -1551,7 +1560,7 @@ refresh();
|
||||
</div>
|
||||
<div class="modal-field">
|
||||
<label class="mfl" for="addToken">Personal Access Token</label>
|
||||
<input id="addToken" type="password" placeholder="ghp_ 开头" autocomplete="off">
|
||||
<div class="mf-input mf-token"><input id="addToken" type="password" placeholder="ghp_ 开头" autocomplete="off"><span class="mf-icon">🔑</span></div>
|
||||
<div class="mfhint">需 <code>repo</code> 权限(即可自动创建仓库并推送)</div>
|
||||
</div>
|
||||
<div class="mf-row">
|
||||
@@ -1580,7 +1589,7 @@ refresh();
|
||||
<div class="modal-body">
|
||||
<div class="modal-field">
|
||||
<label class="mfl" for="editLabel">备注名</label>
|
||||
<input id="editLabel" autocomplete="off">
|
||||
<div class="mf-input"><input id="editLabel" autocomplete="off"><span class="mf-icon">✏️</span></div>
|
||||
</div>
|
||||
<div class="modal-field">
|
||||
<label class="mfl">GitHub 用户名</label>
|
||||
@@ -1595,7 +1604,7 @@ refresh();
|
||||
<span class="dot"></span>
|
||||
<span>当前 Token:<code id="editTokenText">—</code></span>
|
||||
</div>
|
||||
<input id="editToken" type="password" placeholder="粘贴新 Token 以替换(留空则不修改)" autocomplete="off">
|
||||
<div class="mf-input mf-token"><input id="editToken" type="password" placeholder="粘贴新 Token 以替换(留空则不修改)" autocomplete="off"><span class="mf-icon">🔑</span></div>
|
||||
<div class="mfhint">留空则保留当前 Token</div>
|
||||
</div>
|
||||
<div class="mf-row">
|
||||
@@ -1611,9 +1620,13 @@ refresh();
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// 弹窗:点遮罩关闭 + ESC 关闭
|
||||
// 弹窗:点遮罩关闭 + ESC 关闭。
|
||||
// 关键:必须 mousedown 和 mouseup 都在遮罩上才算"点遮罩",避免在弹窗内
|
||||
// 拖动选中文本时松手到遮罩上被误关。
|
||||
document.querySelectorAll('.modal').forEach(m=>{
|
||||
m.addEventListener('click',e=>{ if(e.target===m) m.classList.remove('show'); });
|
||||
let downOnBackdrop=false;
|
||||
m.addEventListener('mousedown',e=>{ downOnBackdrop=(e.target===m); });
|
||||
m.addEventListener('click',e=>{ if(downOnBackdrop && e.target===m) m.classList.remove('show'); });
|
||||
});
|
||||
document.addEventListener('keydown',e=>{
|
||||
if(e.key==='Escape') document.querySelectorAll('.modal.show').forEach(m=>m.classList.remove('show'));
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
appname = GiteaHubSync
|
||||
version = 1.5.1
|
||||
version = 1.5.2
|
||||
display_name = Gitea→GitHub 同步助手
|
||||
desc = 每次推送到飞牛 Gitea 的代码,10 秒内自动镜像到 GitHub 的 7 个私有仓库。内置控制面板:自动同步开关、立即同步、仓库状态、同步日志,一键打开 Gitea。数据全部保存在 NAS 本地。
|
||||
platform = all
|
||||
|
||||
Reference in New Issue
Block a user