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:
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user