C22

English · Deutsch

### 一个可复用、与框架无关的布局与设计系统。 它的核心是纯 CSS（设计 tokens、布局原语、页面外壳、原生 popovers）以及少量 的 JavaScript —— 可用于任何技术栈。在此之上是一个**可选的** Jinja 宏层，适用于 Python/Jinja 应用。其目标是只需构建一次页面或仪表板，从而不再重复解决 相同的布局问题 —— 溢出、间距、对比度、响应式破坏。 ## 它是什么 - **中立的核心：** `c22/static/css` 和 `c22/static/js`。不依赖任何 框架，在运行时不获取任何 CDN 或追踪器。任何应用 —— 静态站点、PHP、Node、 Python —— 都可以嵌入这些文件。 - **可选的 Jinja 层：** `c22/macros` 包含页面外壳和组件宏，供 已经使用 Jinja 渲染的应用使用。不强制任何人使用它们。 - **基于 tokens 的主题化：** 设计通过 CSS 自定义属性来区分，因此多个站点可以 共享一个核心，但看起来截然不同。 ## 状态 早期阶段。这是仓库骨架 —— 强化的 CI、共享的规范工具包、包结构 以及 `static_path()` / `macros_path()` 辅助函数。**设计资源本身尚未 包含在内；**它们将在布局基础确定后跟进。请勿在生产环境中依赖它。 ## 使用说明 Python/Jinja 应用安装该包并挂载资源： ``` from c22 import static_path from fastapi.staticfiles import StaticFiles app.mount("/c22", StaticFiles(directory=static_path()), name="c22") ``` 其他技术栈直接从 `c22/static/` 获取文件（或从发布版的 tarball 中获取）—— 不需要 Python。 ## 开发 ``` git config core.hooksPath .githooks # once per clone ./scripts/check.sh # tests + hygiene, run before every push ``` 测试套件在设计上是可重复的：运行两次，都是绿色（通过）。请参阅 [CONTRIBUTING](CONTRIBUTING.md)。 ## 许可证 MIT —— 请参阅 [LICENSE](LICENSE)。 ## 致谢 图标：Origami Bird PNG Image by Iconjam - flaticon.com

标签：CSS, Jinja, Python, UI组件, Web前端, 数据可视化, 无后门, 设计系统, 逆向工具