fix(viewer): restore lightbox close button styles orphaned by menu removal (transparent bg, white X icon, hover/focus)

Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
浅念
2026-09-23 13:48:03 +08:00
parent f2cd26e523
commit 85146be7ef
+27 -2
View File
@@ -516,7 +516,7 @@ onBeforeUnmount(() => {
@dblclick="onDblClick"
@keydown.tab="onTrapTab"
>
<!-- 顶栏(§5.1:52-56px 深色半透明):关闭 / 位置计数 / ⋯ 更多菜单 -->
<!-- 顶栏(§5.1:52-56px 深色半透明):关闭 / 位置计数(⋯ 菜单已按用户要求移除) -->
<header class="viewer-topbar" data-lightbox-chrome>
<button type="button" class="viewer-close" :aria-label="t('viewer.close')" @click="emit('close')">
<svg viewBox="0 0 24 24" aria-hidden="true" focusable="false">
@@ -674,7 +674,32 @@ onBeforeUnmount(() => {
padding-top: env(safe-area-inset-top, 0px);
background: rgba(14, 18, 24, 0.72);
}
.viewer-close,
.viewer-close {
display: inline-flex;
align-items: center;
justify-content: center;
width: var(--viewer-touch-target, 44px);
height: var(--viewer-touch-target, 44px);
border: none;
border-radius: 50%;
background: transparent;
color: #ffffff;
cursor: pointer;
}
.viewer-close:hover {
background: rgba(255, 255, 255, 0.1);
}
.viewer-close:focus-visible {
outline: 2px solid var(--viewer-primary, #1a73e8);
}
.viewer-close svg {
width: 22px;
height: 22px;
fill: none;
stroke: currentColor;
stroke-width: 2;
stroke-linecap: round;
}
/* 舞台:占剩余空间;contain 完整大图(不裁切);手势区 touch-action none。 */
.viewer-stage {