/* ============================================================================ * 提炼层样式 —— ui.zhaozimin 是真源(edu 里只有 AdmDesign 的 inline 样张,没有独立组件) * * 只放三类东西,其余一律 inline(与 v4 组件同一写法): * ① 光影:光影铁律要求阴影只从质感类取——样张里散写的 boxShadow 在此收编成类 * ② 伪类:hover / focus-visible(inline style 写不了伪类) * ③ 布局补齐:确认窗在 edu 里由 shadcn dialog.jsx 的 Tailwind 工具类定位,这里用纯 CSS 补齐, * 使 .zzm-dialog-* 脱离 Tailwind 也能 1:1 成立 * 键盘焦点一律朱色光晕 0 0 0 3px rgba(166,64,47,.2)——与 .zzm-btn:focus-visible 同源。 * [PROTOCOL]: 变更时更新此头部,然后检查 CLAUDE.md * ========================================================================== */ @keyframes zzmDialogIn { from { opacity: 0; transform: translate(-50%, -50%) scale(.96) } to { opacity: 1; transform: translate(-50%, -50%) } } /* ── 确认窗:遮罩只降亮不模糊;面板居中浮起(皮肤仍由 controls.css 的 .zzm-dialog-* 提供)── */ .zzm-v4 .zzm-dialog-overlay { position: fixed; inset: 0; z-index: 50; animation: zzmFade .2s ease both; } .zzm-v4 .zzm-dialog-panel { position: fixed; top: 50%; left: 50%; z-index: 51; display: grid; transform: translate(-50%, -50%); animation: zzmDialogIn .2s cubic-bezier(.2, .7, .2, 1) both; } .zzm-v4 .zzm-dialog-panel--inline { position: relative; top: auto; left: auto; z-index: auto; transform: none; animation: none; } .zzm-v4 .zzm-dialog-header { display: grid; gap: 8px; } .zzm-v4 .zzm-dialog-title, .zzm-v4 .zzm-dialog-description { margin: 0; } .zzm-v4 .zzm-dialog-actions { display: flex; justify-content: flex-end; } /* ── 轻提示:深墨胶囊(非交互,允许 999);阴影收编自样张 ── */ .zzm-v4 .zzm-toast { display: inline-block; background: #1D1D1B; color: #FFFFFF; font-size: 12px; padding: 9px 18px; border-radius: 999px; white-space: nowrap; box-shadow: 0 8px 24px rgba(0, 0, 0, .3); animation: zzmUp .25s ease both; } /* ── 开关:滑块落影收编成类 ── */ .zzm-v4 .zzm-switch__knob { box-shadow: 0 1px 3px rgba(0, 0, 0, .25); } .zzm-v4 .zzm-switch:disabled .zzm-switch__knob { box-shadow: 0 1px 3px rgba(0, 0, 0, .14); } /* ── 标签页:悬停提墨(同 .zzm-inklink 的灰→墨) ── */ .zzm-v4 .zzm-tab { transition: color .16s ease; } .zzm-v4 .zzm-tab:hover { color: #161616 !important; } /* ── 分页:描边格悬停加深(同 .zzm-ghostline 的 .3 描边) ── */ .zzm-v4 .zzm-page { transition: border-color .16s ease; } .zzm-v4 .zzm-page:not(:disabled):hover { border-color: rgba(0, 0, 0, .3) !important; } .zzm-v4 .zzm-page:disabled { cursor: not-allowed; } /* ── 表格表头排序键:悬停提墨 ── */ .zzm-v4 .zzm-sort { transition: color .16s ease; } .zzm-v4 .zzm-sort:hover { color: #161616 !important; } /* ── 统一键盘焦点 ── */ .zzm-v4 .zzm-switch:focus-visible, .zzm-v4 .zzm-check:focus-visible, .zzm-v4 .zzm-tab:focus-visible, .zzm-v4 .zzm-page:focus-visible, .zzm-v4 .zzm-sort:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(166, 64, 47, .2); }