💋 Sync 2026-10-16 23:55:30

This commit is contained in:
github-actions[bot] committed 2026-10-16 23:55:30 +08:00
1 parent 76f10c2a74
commit 1849cc6156
254 files changed
+25484 -8840

No files matched your search

+100
View File
@@ -0,0 +1,100 @@
# Developing Argon 3.0
[简体中文](DEVELOPMENT_ZH.md) · [README](../README.md)
## Build with OpenWrt
From an OpenWrt build tree:
```sh
cd package
git clone https://github.com/jerrykuku/luci-theme-argon.git
cd ..
make menuconfig
# LuCI → Themes → luci-theme-argon
make package/luci-theme-argon/compile V=s
```
Theme settings are included. Select the nested `compat/luci-app-argon-config` package under LuCI applications only when building the migration package. Existing translation names remain `luci-i18n-argon-config-*`.
Release CI builds IPK with the OpenWrt 23.05.5 SDK and APK v3 with the 25.12.5 SDK. Ucode templates ship as source to avoid tying packages to one runtime's bytecode format.
Translations use `PKG_PO_VERSION` to follow the theme release, including `-r<revision>` for APK. IPK translations retain a `v` prefix (for example, `v3.0.1`) so ordinary installation upgrades the broken v3.0.0 `unknown` version. Keep that prefix in future IPK releases. CI reads each translation's internal package metadata and blocks artifact upload and publication if the version is wrong.
## Source map
| Location | Responsibility |
| --- | --- |
| `less/cascade.less` | Style entry point and import order |
| `less/theme.less` | Light/dark palette and semantic color tokens |
| `less/spacing.less`, `less/shape.less` | Spacing and corner tokens |
| `less/components/` | Shared controls, tables, tabs, dialogs and appearance menu |
| `less/pages/`, `less/page-fix.less` | LuCI/plugin adaptations and their import index |
| `less/responsive.less` | Viewport adaptations |
| `htdocs/luci-static/argon/` | Compiled CSS, images, fonts and SVG icons |
| `htdocs/luci-static/resources/` | Theme settings and LuCI JavaScript modules |
| `ucode/template/themes/argon/` | Login and application templates |
| `root/` | UCI defaults, RPC services, ACLs and integration files |
| `po/` | Argon Config translations |
| `tests/` | Behavior and integration checks |
## Styles
Edit LESS sources, then regenerate the committed stylesheet with LESS 4.1.3:
```sh
npm install --global less@4.1.3
lessc less/cascade.less htdocs/luci-static/argon/css/cascade.css
```
Light and dark modes share this one stylesheet. Each `@theme-palette` row in `theme.less` defines `role: light, dark;`; one value means both modes share it. Use semantic tokens for text, surfaces, borders and states. Legacy variable aliases exist for LuCI compatibility.
Imports run from tokens and base controls through login/application layout, shared components, page adaptations, and responsive rules. Add common behavior to its component module; keep plugin selectors in `pages/`. The `page-fix.less` file is an import index.
Maintain page/card insets and section, field, control and action gaps through spacing tokens. Small screens reduce outer and card insets to `1rem`. Keep long labels wrapping and let form controls shrink to their containers. Escape native CSS `min()` expressions when LESS would evaluate them prematurely.
Corner tokens cover labels, controls, panels, cards and dialogs. Keep the inside edges of joined controls square. Avoid clipping entire cards: dropdowns and tooltips can extend beyond them. Tables handle their own final-row corners and narrow-screen layout.
Preserve native LuCI structures and interactions. Tab bars join their following content containers; section content owns its vertical spacing. Modal actions wrap or stack as space requires, and long content scrolls through the overlay. Dropdown positioning and scrolling remain controlled by LuCI. Restrict hover effects to hover-capable devices and respect reduced motion.
## Templates
LuCI's `header`, `header_login`, `out_header_login`, `sysauth` and footer entry points remain available.
| Template | Responsibility |
| --- | --- |
| `head.ut` | Validated settings, metadata, styles and conditional application resources |
| `sysauth.ut` | Login layout and shared template assembly |
| `login_background.ut` | Wallpaper selection and image/video output |
| `login_form.ut` | Authentication fields, messages and plugin content |
| `page_scripts.ut` | Scripts shared by the footer entry points |
Pass local values through the second argument of `include`. Login pages do not load application LuCI modules. Only `classic` and `centered` are accepted as `login_style`; unknown values fall back to `classic`.
## Configuration and branding
Settings stay in `/etc/config/argon`; the settings route remains `/admin/system/argon-config`. Fresh installs use local backgrounds, classic login, 10px blur and 0.5 panel opacity. Existing options survive upgrades.
New installations derive dark colors from the primary seed. Existing explicit dark colors stay custom. Dark login glass settings can inherit the light values or keep independent overrides. Switching back to automatic/inherited settings retains custom values for later use.
The header appearance menu saves only its mode through `luci.argon_appearance`. The preference is device-wide and requires Argon write access. Keep this independent from pending form settings; failed saves reconcile with the stored mode.
Uploaded branding lives in `/www/luci-static/argon/branding/`; backgrounds live in `/www/luci-static/argon/background/`. Upload/reset operations apply immediately. Branding does not replace packaged images, and both directories are included in configuration-preserving upgrade backups. The browser icon also supplies the touch icon and manifest; existing home-screen shortcuts may need to be added again.
## Menu icons
Top-level menu nodes resolve `htdocs/luci-static/argon/icon/<node-name>.svg`, independently of translated titles. Filenames are case-sensitive and accept letters, digits, underscores and hyphens. Missing icons use `default.svg`.
Use monochrome SVGs with a `viewBox` and transparent background. CSS masks supply theme and interaction colors. Shared chevrons use the same 24×24 grid and 2px round strokes. See the [icon index](../htdocs/luci-static/argon/icon/README.md) for available assets. This mechanism is separate from uploaded browser icons and login logos.
## Checks
Use Node.js 22+, Python 3, LESS 4.1.3 and a Ucode build matching the supported OpenWrt runtime:
```sh
UCODE_BIN=/path/to/ucode sh .github/scripts/check_theme.sh
```
The script checks JavaScript, shell and Ucode syntax, verifies compiled CSS against LESS, and runs the Node/Python tests. CI's Ucode build is defined in [check.yml](../.github/workflows/check.yml).
For UI changes, check the actual affected LuCI pages in light/dark modes and desktop/mobile widths, including keyboard focus, long text and reduced motion where relevant. Network and hardware behavior still needs a suitable OpenWrt environment.
+100
View File
@@ -0,0 +1,100 @@
# Argon 3.0 开发说明
[English](DEVELOPMENT.md) · [返回 README](../README_ZH.md)
## 源码构建
在 OpenWrt 构建目录中执行:
```sh
cd package
git clone https://github.com/jerrykuku/luci-theme-argon.git
cd ..
make menuconfig
# LuCI → Themes → luci-theme-argon
make package/luci-theme-argon/compile V=s
```
主题设置已内置。仅在需要构建旧插件迁移包时,在 LuCI 应用中额外选择嵌套的 `compat/luci-app-argon-config` 包。语言包继续使用 `luci-i18n-argon-config-*` 名称。
发行 CI 使用 OpenWrt 23.05.5 SDK 构建 IPK、25.12.5 SDK 构建 APK v3。Ucode 模板保留源码,避免绑定某个运行时的字节码格式。
语言包通过 `PKG_PO_VERSION` 跟随主题发行版本,APK 包含 `-r<修订号>`。IPK 语言包固定使用 `v` 前缀(如 `v3.0.1`),使已安装的 v3.0.0 `unknown` 语言包可以直接正常升级;后续版本须保留该前缀。发布前会逐个读取语言包内部元数据,版本不符时阻止上传和发布。
## 目录
| 位置 | 用途 |
| --- | --- |
| `less/cascade.less` | 样式入口及导入顺序 |
| `less/theme.less` | 亮暗配色和语义颜色 token |
| `less/spacing.less`、`less/shape.less` | 间距及圆角 |
| `less/components/` | 通用控件、表格、标签页、弹窗、外观菜单 |
| `less/pages/`、`less/page-fix.less` | LuCI / 插件适配及导入索引 |
| `less/responsive.less` | 视口适配 |
| `htdocs/luci-static/argon/` | 编译后的 CSS、图片、字体和 SVG |
| `htdocs/luci-static/resources/` | 设置页与 LuCI JavaScript 模块 |
| `ucode/template/themes/argon/` | 登录页和后台模板 |
| `root/` | UCI 默认配置、RPC、ACL 及系统集成文件 |
| `po/` | Argon Config 翻译 |
| `tests/` | 行为与集成检查 |
## 样式
修改 LESS 源码后,使用 LESS 4.1.3 重新生成并一同提交 CSS:
```sh
npm install --global less@4.1.3
lessc less/cascade.less htdocs/luci-static/argon/css/cascade.css
```
亮暗色共用一份样式。`theme.less` 中 `@theme-palette` 每行以 `角色: 亮色, 暗色;` 定义颜色;单值表示两种模式共用。文字、背景、边框和状态使用各自语义 token;旧变量别名仅用于 LuCI 兼容。
导入顺序为 token、基础控件、登录与后台布局、共享组件、页面适配、响应式规则。通用行为放入对应组件模块,插件选择器放在 `pages/`;`page-fix.less` 只维护导入索引。
页面及卡片内缩、section、字段、控件与操作间距使用统一 token;小屏外边距及卡片内缩为 `1rem`。长文案允许换行,控件可收缩到容器宽度。LESS 会提前求值的原生 CSS `min()` 表达式需转义。
圆角 token 覆盖标签、控件、面板、卡片和弹窗;组合控件的内部接缝保持直角。不要裁切整个卡片,避免截断下拉菜单与提示框;表格自行处理末行圆角和窄屏布局。
保留 LuCI 原生结构和交互:标签栏与相邻内容容器衔接,section 内容负责纵向间距;弹窗操作随空间换行或堆叠,长正文通过覆盖层滚动。下拉位置和滚动继续由 LuCI 控制。悬浮效果仅用于支持 hover 的设备,并尊重减少动画偏好。
## 模板
保留 LuCI 的 `header`、`header_login`、`out_header_login`、`sysauth` 和页脚入口。
| 模板 | 用途 |
| --- | --- |
| `head.ut` | 配置校验、元信息、样式及后台资源加载 |
| `sysauth.ut` | 登录布局和模板组装 |
| `login_background.ut` | 壁纸选择及图片 / 视频输出 |
| `login_form.ut` | 认证字段、提示和插件内容 |
| `page_scripts.ut` | 页脚共用脚本 |
通过 `include` 的第二个参数传递局部数据。登录页不加载后台 LuCI 模块。`login_style` 仅接受 `classic`、`centered`,其他值回退为 `classic`。
## 配置与品牌资源
配置保存在 `/etc/config/argon`,设置地址仍为 `/admin/system/argon-config`。首次安装采用本地背景、经典登录、10px 模糊和 0.5 透明度;升级保留已有选项。
新安装根据主色自动生成暗色配色,已有独立暗色主色保留为自定义。暗色登录面板可跟随亮色或单独配置;切回自动 / 跟随时仍保留自定义值。
顶部外观菜单通过 `luci.argon_appearance` 单独保存模式,对整个设备生效,需要 Argon 写权限。保持与未保存表单设置独立;保存失败时核对服务端已保存值。
自定义图标位于 `/www/luci-static/argon/branding/`,背景位于 `/www/luci-static/argon/background/`。上传 / 恢复立即生效,不覆盖内置文件;两个目录均纳入保留配置升级的备份。网站图标也用于 touch icon 和 manifest,已有手机桌面快捷方式可能需要重新添加。
## 菜单图标
一级菜单按节点名查找 `htdocs/luci-static/argon/icon/<节点名>.svg`,与翻译后的标题无关。文件名区分大小写,支持字母、数字、下划线和连字符;缺失时使用 `default.svg`。
使用透明背景、带 `viewBox` 的单色 SVG,CSS mask 负责主题与交互颜色。共享箭头使用 24×24 网格、2px 圆角描边。资源见 [SVG 图标索引](../htdocs/luci-static/argon/icon/README.md),与用户上传的网站图标 / 登录 Logo 独立。
## 检查
准备 Node.js 22+、Python 3、LESS 4.1.3,以及与目标 OpenWrt 运行时匹配的 Ucode:
```sh
UCODE_BIN=/path/to/ucode sh .github/scripts/check_theme.sh
```
脚本检查 JavaScript、Shell、Ucode 语法,核对 LESS 与 CSS 产物,并运行 Node / Python 测试。CI 的 Ucode 构建步骤见 [check.yml](../.github/workflows/check.yml)。
UI 改动应检查实际受影响页面的亮暗色、桌面与窄屏,以及相关的键盘焦点、长文本和减少动画场景。网络和硬件行为仍需相应 OpenWrt 环境验证。