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"
|
@dblclick="onDblClick"
|
||||||
@keydown.tab="onTrapTab"
|
@keydown.tab="onTrapTab"
|
||||||
>
|
>
|
||||||
<!-- 顶栏(§5.1:52-56px 深色半透明):关闭 / 位置计数 / ⋯ 更多菜单 -->
|
<!-- 顶栏(§5.1:52-56px 深色半透明):关闭 / 位置计数(⋯ 菜单已按用户要求移除) -->
|
||||||
<header class="viewer-topbar" data-lightbox-chrome>
|
<header class="viewer-topbar" data-lightbox-chrome>
|
||||||
<button type="button" class="viewer-close" :aria-label="t('viewer.close')" @click="emit('close')">
|
<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">
|
<svg viewBox="0 0 24 24" aria-hidden="true" focusable="false">
|
||||||
@@ -674,7 +674,32 @@ onBeforeUnmount(() => {
|
|||||||
padding-top: env(safe-area-inset-top, 0px);
|
padding-top: env(safe-area-inset-top, 0px);
|
||||||
background: rgba(14, 18, 24, 0.72);
|
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。 */
|
/* 舞台:占剩余空间;contain 完整大图(不裁切);手势区 touch-action none。 */
|
||||||
.viewer-stage {
|
.viewer-stage {
|
||||||
|
|||||||
Reference in New Issue
Block a user