iter: b01 新增 tooltip 悬浮提示组件

- packages/skin/ui/src/tooltip.ts:包裹式 API tooltip(props, trigger),hover/focus 150ms 延迟出场,移出/失焦/Esc 收起
- types.ts 增 TooltipProps;index.ts 导出;ui.css 增气泡样式(纯 --ua-* 令牌 + 出入场过渡 + reduced-motion 兜底)
- ua.manifest.json / llms-full.txt / .ua/index.json / llms.txt 同步;demo 增 sec-tooltip 区块
- backlog b01 置 done,iterations.log 留痕
This commit is contained in:
HIsheR
2026-10-23 15:34:23 +08:00
parent e9165ead18
commit a57577a995
13 changed files with 228 additions and 12 deletions
+34
View File
@@ -613,6 +613,39 @@
box-shadow: 0 0 0 3px color-mix(in srgb, var(--ua-color-accent) 18%, transparent);
}
/* —— 悬浮提示 —— */
.ua-tip-wrap {
position: relative;
display: inline-flex;
}
.ua-tip {
position: absolute;
left: 50%;
z-index: 30;
max-width: 220px;
padding: var(--ua-space-1) var(--ua-space-2);
border-radius: var(--ua-radius-sm);
background: var(--ua-color-text);
color: var(--ua-color-bg);
font-size: var(--ua-font-size-sm);
line-height: 1.5;
pointer-events: none;
opacity: 0;
transition: opacity 0.16s ease-out, transform 0.16s ease-out;
}
.ua-tip-top {
bottom: calc(100% + 6px);
transform: translateX(-50%) translateY(3px);
}
.ua-tip-bottom {
top: calc(100% + 6px);
transform: translateX(-50%) translateY(-3px);
}
.ua-tip.ua-open {
opacity: 1;
transform: translateX(-50%) translateY(0);
}
/* —— 无障碍:用户偏好减少动效时关闭全部动画 —— */
@media (prefers-reduced-motion: reduce) {
.ua-btn,
@@ -630,6 +663,7 @@
.ua-progress-fill,
.ua-progress-fill::after,
.ua-alert,
.ua-tip,
.ua-form-error,
.ua-modal,
.ua-modal-overlay {