mirror of
https://github.com/EstrellaXD/Auto_Bangumi.git
synced 2026-10-28 19:25:55 +08:00
bf1c8db08c
- 清单 [[plugin.ui]]：五个挂载点、ab-plugin- 元素名与 web/ 入口校验
- GET /plugins/ui 列出已启用插件的挂载点；GET /plugins/{id}/web/{path} 提供静态资源（防路径穿越、JS MIME、需登录）
- SPA 文档加 CSP script-src 'self'，内联深色模式脚本移到 theme-init.js
- webui/packages/plugin-ui：AbHost 类型、--ab-* 主题变量、Vite 库模式模板
- 设计文档第 0 节记录第一部分的调整
68 lines
2.3 KiB
CSS
68 lines
2.3 KiB
CSS
/*
|
||
* 插件组件的主题变量：在 Shadow DOM 内引入（见 template/src/index.ts）。
|
||
* --ab-* 是对插件稳定的名字，取宿主当前的设计令牌（webui/src/style/var.scss），
|
||
* CSS 变量会穿过 Shadow DOM 继承，深浅色切换自动生效。括号中的浅色值只在
|
||
* 宿主之外单独预览组件时使用。
|
||
*/
|
||
:host {
|
||
--ab-color-primary: var(--color-primary, #6c4ab6);
|
||
--ab-color-primary-hover: var(--color-primary-hover, #563a92);
|
||
--ab-color-primary-light: var(--color-primary-light, #e8def8);
|
||
--ab-color-primary-alpha: var(--color-primary-alpha, rgba(108, 74, 182, 0.2));
|
||
--ab-color-accent: var(--color-accent, #f97316);
|
||
--ab-color-success: var(--color-success, #22c55e);
|
||
--ab-color-danger: var(--color-danger, #ef4444);
|
||
--ab-color-warning: var(--color-warning, #f59e0b);
|
||
|
||
--ab-color-bg: var(--color-bg, #fafafa);
|
||
--ab-color-surface: var(--color-surface, #ffffff);
|
||
--ab-color-surface-hover: var(--color-surface-hover, #f5f5f5);
|
||
--ab-color-surface-2: var(--color-surface-2, #f1f4f8);
|
||
|
||
--ab-color-text: var(--color-text, #1e293b);
|
||
--ab-color-text-secondary: var(--color-text-secondary, #64748b);
|
||
--ab-color-text-muted: var(--color-text-muted, #94a3b8);
|
||
|
||
--ab-color-border: var(--color-border, #e2e8f0);
|
||
--ab-color-border-hover: var(--color-border-hover, #cbd5e1);
|
||
|
||
--ab-radius-sm: var(--radius-sm, 4px);
|
||
--ab-radius-md: var(--radius-md, 8px);
|
||
--ab-radius-lg: var(--radius-lg, 12px);
|
||
--ab-radius-full: var(--radius-full, 9999px);
|
||
|
||
--ab-shadow-sm: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.05));
|
||
--ab-shadow-md: var(
|
||
--shadow-md,
|
||
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
||
0 2px 4px -2px rgba(0, 0, 0, 0.1)
|
||
);
|
||
|
||
--ab-transition-fast: var(--transition-fast, 150ms ease-out);
|
||
--ab-transition-normal: var(--transition-normal, 200ms ease-out);
|
||
|
||
--ab-font-family: var(
|
||
--font-family,
|
||
'Inter',
|
||
-apple-system,
|
||
'Noto Sans SC',
|
||
'Microsoft YaHei',
|
||
system-ui,
|
||
sans-serif
|
||
);
|
||
--ab-font-mono: var(
|
||
--font-mono,
|
||
ui-monospace,
|
||
'SF Mono',
|
||
SFMono-Regular,
|
||
Menlo,
|
||
Consolas,
|
||
monospace
|
||
);
|
||
|
||
/* 基础样式：字体与颜色本会从宿主继承，这里写明是为了单独预览时一致 */
|
||
display: block;
|
||
font-family: var(--ab-font-family);
|
||
color: var(--ab-color-text);
|
||
}
|