MediaWiki:Gadget-UnihanTooltips.css
注意：在发布之后，您可能需要清除浏览器缓存才能看到所作出的更改的影响。
- Firefox或Safari：按住Shift的同时单击刷新，或按Ctrl-F5或Ctrl-R（Mac为⌘-R）
- Google Chrome：按Ctrl-Shift-R（Mac为⌘-Shift-R）
- Edge：按住Ctrl的同时单击刷新，或按Ctrl-F5。
/* 主工具提示容器：优化渲染、适配多场景，无性能与兼容问题 */
.unihantooltip {
/* 核心变量：多层回退，适配MediaWiki变量体系迭代 */
--tooltip-border: var(--background-color-border, var(--border-color-base, #a2a9b1));
--tooltip-bg: var(--background-color-interactive-subtle, var(--bg-default, #f8f9fa));
--tooltip-text: var(--text-color-base, #333);
--tooltip-arrow-inner: var(--border-color-muted, var(--bg-default, #f7f7f7));
position: absolute;
list-style: none;
padding: 0;
margin: 0;
z-index: 10000; /* 高于MediaWiki原生UI层级，避免遮挡 */
opacity: 0;
font-size: 0.875rem; /* 相对单位，适配字体缩放 */
pointer-events: none; /* 未显示时不干扰底层交互 */
/* 平滑过渡：仅必要属性，避免过度渲染 */
transition: opacity 0.15s ease;
/* 优化初始渲染：1.43+支持，未显示时不参与布局计算 */
content-visibility: hidden;
/* 适配深色模式：原生识别系统/站点主题 */
color-scheme: light dark;
}
/* 弹窗显示状态：同步启用渲染、交互、透明度 */
.unihantooltip.is-visible {
opacity: 1;
content-visibility: visible;
pointer-events: auto;
}
/* 内容区域：精准控制，无溢出与继承干扰 */
.unihantooltip > li:first-child {
border: 2px solid var(--tooltip-border);
max-width: 260px; /* 限制宽度，避免过宽 */
padding: 10px 8px 13px;
margin: 0;
background-color: var(--tooltip-bg);
color: var(--tooltip-text);
box-shadow: 2px 4px 2px rgba(0, 0, 0, 0.3); /* 基础阴影，不冗余 */
pointer-events: auto;
position: relative; /* 为设置图标绝对定位提供基准 */
}
/* 内容区链接：优化交互，无继承冲突 */
.unihantooltip > li:first-child a {
color: inherit;
text-decoration: underline;
text-underline-offset: 2px; /* 1.43+支持，提升可读性 */
text-decoration-thickness: 1px;
transition: text-decoration-color 0.15s ease;
border: none; /* 避免继承内容区边框 */
padding: 0; /* 清除默认内边距 */
margin: 0; /* 清除默认外边距 */
}
.unihantooltip > li:first-child a:hover {
text-decoration-color: var(--tooltip-border);
}
/* 箭头主体：逻辑属性适配多语言，无定位偏差 */
.unihantooltip > li:last-child {
margin-inline-start: 0; /* 适配RTL语言 */
margin-block-start: -2px; /* 与内容区无缝衔接 */
padding: 0;
height: 0; /* 清除占位高度 */
width: 0; /* 清除占位宽度 */
border: none; /* 清除默认边框 */
border-block-start: 12px solid var(--tooltip-border); /* 箭头方向 */
border-inline-end: 7px solid transparent;
border-inline-start: 7px solid transparent;
position: relative;
filter: drop-shadow(0 1px 0 rgba(0,0,0,0.05)); /* 优化边缘锯齿 */
}
/* 箭头内部填充：精准对齐，无错位 */
.unihantooltip > li:last-child::after {
content: '';
border: none; /* 清除默认边框 */
border-block-start: 8px solid var(--tooltip-arrow-inner);
border-inline-end: 5px solid transparent;
border-inline-start: 5px solid transparent;
position: absolute;
inset-block-start: -11px; /* 向上偏移1px，与箭头主体对齐 */
inset-inline-start: -5px; /* 向左偏移5px，水平居中 */
}
/* 翻转状态：修正定位，无逻辑冲突 */
.unihantooltip.UHflipped {
padding-block-start: 0; /* 清除冗余内边距 */
}
.unihantooltip.UHflipped > li:last-child {
border-block-start: none; /* 清除原箭头方向 */
border-block-end: 12px solid var(--tooltip-border); /* 翻转后箭头方向 */
margin-block-start: 2px; /* 与内容区无缝衔接 */
}
.unihantooltip.UHflipped > li:last-child::after {
border-block-start: none; /* 清除原填充方向 */
border-block-end: 8px solid var(--tooltip-arrow-inner); /* 翻转后填充方向 */
inset-block-start: 3px; /* 向下偏移3px，与翻转箭头对齐 */
}
/* 设置图标：无溢出，显示正常 */
.UHsettings {
--settings-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23666' d='M12 15.5A3.5 3.5 0 0 1 8.5 12 3.5 3.5 0 0 1 12 8.5a3.5 3.5 0 0 1 3.5 3.5 3.5 3.5 0 0 1-3.5 3.5m7.43-2.53c.04-.32.07-.64.07-.97 0-.33-.03-.66-.07-1l2.11-1.63c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.31-.61-.22l-2.49 1c-.52-.39-1.06-.73-1.69-.98l-.37-2.65A.506.506 0 0 0 14 2h-4c-.25 0-.46.18-.5.42l-.37 2.65c-.63.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.5 0-.61.22l-2 3.46c-.13.22-.07.49.12.64L4.57 11c-.04.34-.07.67-.07 1 0 .33.03.65.07.97l-2.11 1.66c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1.01c.52.4 1.06.74 1.69.99l.37 2.65c.04.24.25.42.5.42h4c.25 0 .46-.18.5-.42l.37-2.65c.63-.26 1.17-.59 1.69-.99l2.49 1.01c.22.08.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.66z'/%3E%3C/svg%3E");
position: absolute;
inset-block-start: 8px; /* 上内边距8px，不溢出 */
inset-inline-end: 8px; /* 右内边距8px，不溢出 */
width: 16px;
aspect-ratio: 1; /* 1.43+支持，确保正方形 */
cursor: pointer;
background-image: var(--settings-icon);
background-size: contain;
background-repeat: no-repeat; /* 避免重复显示 */
background-position: center; /* 居中显示 */
opacity: 0.6;
transition: opacity 0.15s ease, transform 0.15s ease;
pointer-events: auto; /* 允许点击交互 */
}
/* 图标hover效果：无变形，反馈清晰 */
.UHsettings:hover {
opacity: 1;
transform: scale(1.1); /* 微缩放，不夸张 */
}
/* 目标元素：无文字挤压，高亮明显 */
.UHTarget {
border: 2px solid var(--tooltip-border);
cursor: help; /* 提示可交互 */
transition: border-color 0.15s ease, box-shadow 0.15s ease;
padding: 0 2px; /* 左右内边距，避免边框挤压文字 */
margin: 0; /* 清除默认外边距 */
}
/* 目标元素hover：无突兀效果 */
.UHTarget:hover {
border-color: var(--tooltip-border);
box-shadow: 0 0 0 1px rgba(162, 169, 177, 0.5); /* 弱阴影，提升辨识度 */
}
/* 嵌套li：无继承干扰，排版正常 */
.client-js .unihantooltip li li {
border: none;
box-shadow: none;
height: auto;
width: auto;
margin: 0; /* 清除居中margin，避免错位 */
padding: 0;
position: static; /* 清除定位，正常流排版 */
font-size: inherit; /* 继承父级字体大小 */
color: inherit; /* 继承父级文字颜色 */
}
/* 深色模式：对比度合理，无显示异常 */
@media (prefers-color-scheme: dark) {
.unihantooltip {
--tooltip-border: var(--background-color-border, #54595d);
--tooltip-bg: var(--background-color-interactive-subtle, #202122);
--tooltip-text: var(--text-color-base, #eaecf0); /* 高对比度，易读 */
--tooltip-arrow-inner: var(--border-color-muted, #202122);
--tooltip-shadow: 2px 4px 2px rgba(0, 0, 0, 0.8); /* 加深阴影，提升层次 */
}
.UHTarget {
border-color: #54595d;
box-shadow: 0 0 0 1px rgba(84, 89, 93, 0.5);
}
.UHsettings {
--settings-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23eaecf0' d='M12 15.5A3.5 3.5 0 0 1 8.5 12 3.5 3.5 0 0 1 12 8.5a3.5 3.5 0 0 1 3.5 3.5 3.5 3.5 0 0 1-3.5 3.5m7.43-2.53c.04-.32.07-.64.07-.97 0-.33-.03-.66-.07-1l2.11-1.63c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.31-.61-.22l-2.49 1c-.52-.39-1.06-.73-1.69-.98l-.37-2.65A.506.506 0 0 0 14 2h-4c-.25 0-.46.18-.5.42l-.37 2.65c-.63.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.5 0-.61.22l-2 3.46c-.13.22-.07.49.12.64L4.57 11c-.04.34-.07.67-.07 1 0 .33.03.65.07.97l-2.11 1.66c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1.01c.52.4 1.06.74 1.69.99l.37 2.65c.04.24.25.42.5.42h4c.25 0 .46-.18.5-.42l.37-2.65c.63-.26 1.17-.59 1.69-.99l2.49 1.01c.22.08.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.66z'/%3E%3C/svg%3E");
}
}