dsh-theme-palette 1.6.0 → 1.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +43 -0
- package/README-es.md +123 -82
- package/README-hi.md +123 -82
- package/README-pt.md +123 -82
- package/README-zh.md +125 -83
- package/README.md +124 -83
- package/client.js +650 -93
- package/docs/DESIGN.md +14 -0
- package/package.json +6 -1
package/README-pt.md
CHANGED
|
@@ -1,91 +1,132 @@
|
|
|
1
|
-
# dsh-theme-palette
|
|
2
|
-
|
|
3
|
-
[English](README.md) · [中文](README-zh.md) · [Español](README-es.md) · [Português](README-pt.md) · [हिन्दी](README-hi.md)
|
|
4
|
-
|
|
5
|
-
Paleta de tema para o DeepSeek Harness (web e desktop): **4 paletas × claro/escuro**, dois eixos independentes.
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
*Render estático na largura real do painel (564 px de conteúdo).*
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
- **
|
|
28
|
-
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
#
|
|
38
|
-
|
|
1
|
+
# dsh-theme-palette
|
|
2
|
+
|
|
3
|
+
[English](README.md) · [中文](README-zh.md) · [Español](README-es.md) · [Português](README-pt.md) · [हिन्दी](README-hi.md)
|
|
4
|
+
|
|
5
|
+
Paleta de tema para o DeepSeek Harness (web e desktop): **4 paletas × claro/escuro**, dois eixos independentes.
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
*Render estático na largura real do painel (564 px de conteúdo).*
|
|
10
|
+
|
|
11
|
+
| Escuro | Paleta personalizada | Alto contraste |
|
|
12
|
+
|---|---|---|
|
|
13
|
+
|  |  |  |
|
|
14
|
+
|
|
15
|
+
## Compatibility
|
|
16
|
+
|
|
17
|
+
| Superfície | Estado |
|
|
18
|
+
|---|---|
|
|
19
|
+
| Cliente DSH desktop / web | 0.2.x |
|
|
20
|
+
| Node.js | ≥ 20 |
|
|
21
|
+
| Alterações no código do host | nenhuma |
|
|
22
|
+
|
|
23
|
+
O plugin apenas empilha tokens de cor via `ctx.theme.overrideTokens`; não registra um tema, não altera o host e não toca na preferência de aparência.
|
|
24
|
+
|
|
25
|
+
## What it does
|
|
26
|
+
|
|
27
|
+
- **4 paletas** — Mono, Areia quente, Índigo, Musgo — cada uma adaptada de forma independente ao claro e ao escuro;
|
|
28
|
+
- a escala é **recalculada** por completo: reconstrução OKLCH → croma por papel → **limite de gamut sRGB** → contraste resolvido sobre superfícies reais;
|
|
29
|
+
- mais de 27.000 referências de token: texto, secundário, terciário, legendas, links, barras laterais, cartões, balão do usuário, botão primário, barras de rolagem, interruptores, títulos/negrito de Markdown, blocos de código;
|
|
30
|
+
- ajustável: intensidade do texto (3), profundidade da barra lateral (3), painel direito (2), ênfase de Markdown, barras de rolagem, cor dos interruptores;
|
|
31
|
+
- **autorrecuperação**: se o host descartar a camada de override, a paleta é reaplicada;
|
|
32
|
+
- interface em 简体中文 / 繁體中文 / English / 日本語 (segue o idioma do host e pode ser fixada).
|
|
33
|
+
|
|
34
|
+
## Install
|
|
35
|
+
|
|
36
|
+
```bash
|
|
37
|
+
# via npm
|
|
38
|
+
cd ~/.dsh/profiles/desktop
|
|
39
|
+
pnpm add dsh-theme-palette
|
|
40
|
+
|
|
41
|
+
# ou uma versão específica
|
|
42
|
+
pnpm add dsh-theme-palette@1.4.3
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
A partir do tarball do release do GitHub:
|
|
46
|
+
|
|
47
|
+
```bash
|
|
48
|
+
pnpm add "https://github.com/zuoyunlai/dsh-theme-palette/releases/download/v1.4.3/dsh-theme-palette-1.4.3.tgz"
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
Depois **reinicie a interface**: um processo em execução mantém o módulo antigo. Abra em avatar → Configurações → **Color theme**.
|
|
52
|
+
|
|
53
|
+
## Configuration
|
|
54
|
+
|
|
55
|
+
| Item | Opções |
|
|
56
|
+
|---|---|
|
|
57
|
+
| Paleta | Mono · Areia quente · Índigo · Musgo (as miniaturas seguem claro/escuro) |
|
|
58
|
+
| Intensidade | Suave / Padrão / Forte — quanto o texto segue a paleta |
|
|
59
|
+
| Superfícies | Barra lateral (Mais clara / Igual / Mais escura), painel direito (Igual à barra / Seguir a tela) |
|
|
60
|
+
| Mais opções | Idioma, ênfase de Markdown, barras de rolagem, interruptores |
|
|
61
|
+
|
|
62
|
+
Cada escolha aplica na hora e fica em `localStorage`. Claro/escuro continua no controle «Aparência» do host.
|
|
63
|
+
|
|
64
|
+
## Palette engine
|
|
65
|
+
|
|
66
|
+
```
|
|
67
|
+
OKLCH(L, C, matiz) ──► limite de gamut (busca binária em C) ──► hex sRGB
|
|
68
|
+
▲
|
|
69
|
+
└── croma por papel × intensidade, depois contraste sobre {tela, cartão, barra, sobreposição}
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
- os aliases semânticos mantêm cadeias `var(--dsw-static-neutral-bluish-NN)`, então tudo que segue um token segue a paleta;
|
|
73
|
+
- superfícies claras usam os passos 00–300, as escuras 800–950;
|
|
74
|
+
- os pisos de texto são exigidos na construção: corpo ≥ 12, secundário ≥ 6.1, terciário/link ≥ 4.6, texto na barra lateral ≥ 7, texto no balão ≥ 7;
|
|
75
|
+
- `node palette-dev.mjs` verifica 432 combinações.
|
|
76
|
+
|
|
77
|
+
Notas de design, critério por componente e tabelas de contraste em [docs/DESIGN.md](docs/DESIGN.md). Histórico: [CHANGELOG.md](CHANGELOG.md).
|
|
78
|
+
|
|
79
|
+
## Development
|
|
80
|
+
|
|
81
|
+
```bash
|
|
82
|
+
node palette-dev.mjs # relatório de tokens de todas as paletas
|
|
83
|
+
node tools/sheet.mjs # painel de paletas → tools/sheet.html
|
|
84
|
+
node tools/shoot-sheet.mjs # captura do painel (Chrome headless)
|
|
85
|
+
node tools/compare.mjs --dir tools/out/<run> # comparar com a linha de base
|
|
86
|
+
node tools/preview-settings.mjs --lang en # renderizar a página de ajustes
|
|
87
|
+
node tools/release.mjs --dry # pré-checagem de release
|
|
88
|
+
node tools/release.mjs --tag # publicar no npm + tag
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
A regressão visual tem duas camadas: o painel de paletas (sem autenticação) e a janela real do desktop via CDP (`tools/shoot-desktop.mjs`, requer `--remote-debugging-port`). Veja [tools/README.md](tools/README.md).
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
## Pitfalls we hit
|
|
95
|
+
|
|
96
|
+
As cinco mais surpreendentes da auditoria da 1.7.0 — cada uma foi encontrada por um teste, não olhando capturas.
|
|
97
|
+
|
|
98
|
+
- **Um acento branco gerava um link branco** (1.13:1). O solucionador de contraste andava só numa direção, afastando-se do fundo, então um acento mais claro que o fundo continuava indo para o branco.
|
|
99
|
+
- **Escolher uma cor mudava a página mas não o painel.** O componente inscrevia-se no id da paleta, que não muda quando a cor muda; o React comparou os snapshots, viu que não havia diferença e pulou o re-render.
|
|
100
|
+
- **Compartilhar uma configuração não compartilhava as cores.** O código curto carregava os modos mas não as três cores personalizadas, então importar em outra máquina informava sucesso e mantinha os valores locais.
|
|
101
|
+
- **Superfícies modulares escuras têm um teto.** Mesmo o branco puro chega a apenas ~10.99:1 na superfície mais profunda, então a meta de 12:1 (15:1 em alto contraste) é fisicamente inalcançável ali. Ajustamos ao máximo alcançável e rotulamos.
|
|
102
|
+
- **Um seletor que achávamos morto estava vivo.** A auditoria inicialmente o reportou como quebrado; o teste de contrato contra o CSS publicado provou o contrário. O achado estava errado, não o código.
|
|
103
|
+
|
|
104
|
+
## Sharing
|
|
105
|
+
|
|
106
|
+
Toda a configuração — incluindo as três cores personalizadas — viaja num código curto. Cole na caixa de importação e clique em Pré-visualizar para ver exatamente o que mudará antes de aplicar:
|
|
107
|
+
|
|
108
|
+
```text
|
|
109
|
+
dshs1.eyJ2IjoxLCJwIjoiY3VzdG9tIiwicyI6ImRlZXAiLCJ0IjoidGludGVkIiwiciI6InNpZGViYXIiLCJjIjoidGludGVkIiwiayI6ImFjY2VudCIsIm0iOiJvbiIsImgiOiJvZmYiLCJsIjoiemgtQ04iLCJ4Ijp7ImJnIjoiI2Y1ZWZlNiIsInRleHQiOiIjMWQxYTE3IiwiYWNjZW50IjoiIzNmNjZhMyJ9fQ
|
|
39
110
|
```
|
|
40
111
|
|
|
41
|
-
|
|
112
|
+
Este exemplo real decodifica para:
|
|
42
113
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
Depois **reinicie a interface**: um processo em execução mantém o módulo antigo. Abra em avatar → Configurações → **Color theme**.
|
|
48
|
-
|
|
49
|
-
## Configuration
|
|
114
|
+
- paleta: custom · barra lateral: deep · texto: tinted · painel direito: sidebar
|
|
115
|
+
- scrollbar: tinted · controles: accent · Markdown: on · alto contraste: off · idioma: zh-CN
|
|
116
|
+
- três cores: `#f5efe6` (fundo) · `#1d1a17` (texto) · `#3f66a3` (acento)
|
|
50
117
|
|
|
51
|
-
|
|
52
|
-
|---|---|
|
|
53
|
-
| Paleta | Mono · Areia quente · Índigo · Musgo (as miniaturas seguem claro/escuro) |
|
|
54
|
-
| Intensidade | Suave / Padrão / Forte — quanto o texto segue a paleta |
|
|
55
|
-
| Superfícies | Barra lateral (Mais clara / Igual / Mais escura), painel direito (Igual à barra / Seguir a tela) |
|
|
56
|
-
| Mais opções | Idioma, ênfase de Markdown, barras de rolagem, interruptores |
|
|
118
|
+
O código é gerado pelo codificador de produção e auto-verificado ida e volta antes de entrar neste README — nunca é escrito à mão.
|
|
57
119
|
|
|
58
|
-
|
|
120
|
+
## Trade-offs
|
|
59
121
|
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
```
|
|
63
|
-
OKLCH(L, C, matiz) ──► limite de gamut (busca binária em C) ──► hex sRGB
|
|
64
|
-
▲
|
|
65
|
-
└── croma por papel × intensidade, depois contraste sobre {tela, cartão, barra, sobreposição}
|
|
66
|
-
```
|
|
67
|
-
|
|
68
|
-
- os aliases semânticos mantêm cadeias `var(--dsw-static-neutral-bluish-NN)`, então tudo que segue um token segue a paleta;
|
|
69
|
-
- superfícies claras usam os passos 00–300, as escuras 800–950;
|
|
70
|
-
- os pisos de texto são exigidos na construção: corpo ≥ 12, secundário ≥ 6.1, terciário/link ≥ 4.6, texto na barra lateral ≥ 7, texto no balão ≥ 7;
|
|
71
|
-
- `node palette-dev.mjs` verifica 432 combinações.
|
|
72
|
-
|
|
73
|
-
Notas de design, critério por componente e tabelas de contraste em [docs/DESIGN.md](docs/DESIGN.md). Histórico: [CHANGELOG.md](CHANGELOG.md).
|
|
74
|
-
|
|
75
|
-
## Development
|
|
76
|
-
|
|
77
|
-
```bash
|
|
78
|
-
node palette-dev.mjs # relatório de tokens de todas as paletas
|
|
79
|
-
node tools/sheet.mjs # painel de paletas → tools/sheet.html
|
|
80
|
-
node tools/shoot-sheet.mjs # captura do painel (Chrome headless)
|
|
81
|
-
node tools/compare.mjs --dir tools/out/<run> # comparar com a linha de base
|
|
82
|
-
node tools/preview-settings.mjs --lang en # renderizar a página de ajustes
|
|
83
|
-
node tools/release.mjs --dry # pré-checagem de release
|
|
84
|
-
node tools/release.mjs --tag # publicar no npm + tag
|
|
85
|
-
```
|
|
122
|
+
Outros plugins de tema aqui entregam vidro, papéis de parede e animação. Decidimos não fazer isso:
|
|
86
123
|
|
|
87
|
-
|
|
124
|
+
- **Sem vidro nem papel de parede.** Essa corrida se ganha com capturas; preferimos competir com provas.
|
|
125
|
+
- **Sem mercado de temas nem geração de cor por IA.** Ambos introduzem cores que não podemos garantir; o solucionador de contraste é o ativo.
|
|
126
|
+
- **Sem mais paletas.** Quatro predefinições mais um gerador de três cores supera dez escolhidas à mão; volume não é a vantagem.
|
|
127
|
+
- **Sem promessas de "proteção ocular".** Reportamos razões medidas nas superfícies onde o texto realmente cai e dizemos "limitado pela superfície" quando é tudo o que existe.
|
|
88
128
|
|
|
89
|
-
## License
|
|
90
129
|
|
|
91
|
-
|
|
130
|
+
## License
|
|
131
|
+
|
|
132
|
+
MIT © 2026 Zuoyunlai
|
package/README-zh.md
CHANGED
|
@@ -1,92 +1,134 @@
|
|
|
1
|
-
# dsh-theme-palette
|
|
2
|
-
|
|
3
|
-
[English](README.md) · [中文](README-zh.md) · [Español](README-es.md) · [Português](README-pt.md) · [हिन्दी](README-hi.md)
|
|
4
|
-
|
|
5
|
-
DeepSeek Harness（Web / 桌面）的主题配色插件：**4 套配色 × 明暗两模式**，两个轴互相独立。
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
*上图按真机面板宽度（内容区 564 px）静态渲染。*
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
-
|
|
28
|
-
-
|
|
29
|
-
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
1
|
+
# dsh-theme-palette
|
|
2
|
+
|
|
3
|
+
[English](README.md) · [中文](README-zh.md) · [Español](README-es.md) · [Português](README-pt.md) · [हिन्दी](README-hi.md)
|
|
4
|
+
|
|
5
|
+
DeepSeek Harness（Web / 桌面）的主题配色插件：**4 套配色 × 明暗两模式**，两个轴互相独立。
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
*上图按真机面板宽度（内容区 564 px）静态渲染。*
|
|
10
|
+
|
|
11
|
+
| 深色 | 自定义面板 | 高对比 |
|
|
12
|
+
|---|---|---|
|
|
13
|
+
|  |  |  |
|
|
14
|
+
|
|
15
|
+
## Compatibility
|
|
16
|
+
|
|
17
|
+
| 项目 | 状态 |
|
|
18
|
+
|---|---|
|
|
19
|
+
| DSH 桌面 / Web 客户端 | 0.2.x |
|
|
20
|
+
| Node.js | ≥ 20 |
|
|
21
|
+
| 对宿主源码的改动 | 无 |
|
|
22
|
+
|
|
23
|
+
插件只用 `ctx.theme.overrideTokens` 叠一层颜色 token：不注册主题、不改宿主、不动「外观」偏好。
|
|
24
|
+
|
|
25
|
+
## What it does
|
|
26
|
+
|
|
27
|
+
- **4 套配色** —— 黑白 / 暖砂 / 靛蓝 / 苔绿，各自独立适配明暗两侧；
|
|
28
|
+
- 色阶**整体重算**而不是替换：OKLCH 重建 → 角色化色度 → **sRGB 色域钳位** → 在真实承载面上求解对比度；
|
|
29
|
+
- 覆盖 27,000+ 处 token 引用：正文、次级、三级、注释、链接、侧栏、卡片、主人气泡、主按钮、滚动条、开关、Markdown 标题/加粗、代码块；
|
|
30
|
+
- 可调：文字着色三档、侧栏三档、右栏两档、Markdown 强调、滚动条、开关配色；
|
|
31
|
+
- **自定义配色**（给 底色/文字/强调 三色，文字色相也参与派生；过亮/过暗的强调色会归一化）、**配置导入导出**（`dshs1.` 短码含三色）、**高对比**档、4 种界面语言；
|
|
32
|
+
- **自愈**：宿主丢弃 override 层时自动重放；
|
|
33
|
+
- 高对比的 15:1 以浅色卡层/深色 950 为承诺面；深色模块面 800 受表面亮度限制，报表会标“表面上限”。
|
|
34
|
+
- 界面支持 简体中文 / 繁體中文 / English / 日本語（跟随宿主，也可手选）。
|
|
35
|
+
|
|
36
|
+
## Install
|
|
37
|
+
|
|
38
|
+
```bash
|
|
39
|
+
# 从 npm
|
|
40
|
+
cd ~/.dsh/profiles/desktop
|
|
41
|
+
pnpm add dsh-theme-palette
|
|
42
|
+
|
|
43
|
+
# 或指定版本
|
|
44
|
+
pnpm add dsh-theme-palette@1.4.3
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
从 GitHub Release 的 tarball：
|
|
48
|
+
|
|
49
|
+
```bash
|
|
50
|
+
pnpm add "https://github.com/zuoyunlai/dsh-theme-palette/releases/download/v1.4.3/dsh-theme-palette-1.4.3.tgz"
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
装完**必须重启 GUI**（运行中的进程仍持旧模块）。入口：左下角头像 → **设置** → 「**主题色**」。
|
|
54
|
+
|
|
55
|
+
## Configuration
|
|
56
|
+
|
|
57
|
+
| 项 | 选项 |
|
|
58
|
+
|---|---|
|
|
59
|
+
| 配色 | 黑白 · 暖砂 · 靛蓝 · 苔绿（卡片缩略图跟随明暗） |
|
|
60
|
+
| 强度 | 静 / 标准 / 浓 —— 正文与强调的着色程度 |
|
|
61
|
+
| 面板表面 | 左侧栏（更浅 / 同色 / 更深）、右侧栏（同左栏 / 跟随画布） |
|
|
62
|
+
| 更多选项 | 语言、Markdown 强调、滚动条、开关 / 勾选 |
|
|
63
|
+
|
|
64
|
+
选择即时生效并存在 `localStorage`；明暗仍由宿主「外观」控制。
|
|
65
|
+
|
|
66
|
+
## Palette engine
|
|
67
|
+
|
|
68
|
+
```
|
|
69
|
+
OKLCH(L, C, hue) ──► 色域钳位（对 C 二分） ──► sRGB hex
|
|
70
|
+
▲
|
|
71
|
+
└── 角色色度 × 强度，再在 {画布, 卡层, 侧栏, 悬浮层} 上求解对比度
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
- 语义别名保留 `var(--dsw-static-neutral-bluish-NN)` 引用链，跟 token 的元素就跟着配色走；
|
|
75
|
+
- 浅色面用色阶 00–300，深色面用 800–950；
|
|
76
|
+
- 文字下限在构建期强制：正文 ≥ 12、次级 ≥ 6.2、三级/链接 ≥ 4.62、侧栏内 ≥ 7、气泡内 ≥ 7；深色模块面按可达上限钳位并标注；
|
|
77
|
+
- `node palette-dev.mjs` 跑标准档承载面报表，`--hc` 跑高对比档；硬失败时退出码 1。
|
|
78
|
+
|
|
79
|
+
逐组件设计取舍与对比度表见 [docs/DESIGN.md](docs/DESIGN.md)，版本记录见 [CHANGELOG.md](CHANGELOG.md)。
|
|
80
|
+
|
|
81
|
+
## Development
|
|
82
|
+
|
|
83
|
+
```bash
|
|
84
|
+
node palette-dev.mjs # 全部配色的 token 报表
|
|
85
|
+
node tools/sheet.mjs # 配色看板 → tools/sheet.html
|
|
86
|
+
node tools/shoot-sheet.mjs # 无头 Chrome 截看板
|
|
87
|
+
node tools/compare.mjs --dir tools/out/<run> # 与基线比
|
|
88
|
+
node tools/preview-settings.mjs --lang en # 渲染设置页
|
|
89
|
+
node tools/release.mjs --dry # 发版预检
|
|
90
|
+
node tools/release.mjs --tag # 发 npm + 打 tag
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
截图回归分两层：配色看板（免登录）与桌面真机窗口（`tools/shoot-desktop.mjs`，需要 `--remote-debugging-port`）。见 [tools/README.md](tools/README.md)。
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
## Pitfalls we hit
|
|
97
|
+
|
|
98
|
+
1.7.0 审计里最反直觉的五条——每一条都是测试逼出来的，不是看截图看出来的。
|
|
99
|
+
|
|
100
|
+
- **纯白强调色会生成纯白链接**（1.13:1）。对比度求解器原本只朝"远离背景"的单一方向走，强调色比背景还亮时只会一路推向白色。
|
|
101
|
+
- **取了色，整页变了，面板没变。** 组件订阅的是配色 id，而取色不会改变它——React 比较快照发现没变，直接跳过重渲染。
|
|
102
|
+
- **分享了配置，没分享颜色。** 短码带了各项模式，但没带自定义三色，换台机器导入提示成功，用的仍是本机旧值。
|
|
103
|
+
- **深色模块面有硬上限。** 即使纯白，在最深的模块面上也只有约 10.99:1，12:1（高对比 15:1）物理上不可达。现在按该面可达上限钳位并标注"表面受限"，而不是默默不达标。
|
|
104
|
+
- **一个我们以为失效的选择器其实活着。** 审计最初判定 `_markdown_` 相关选择器已失效；契约测试对着实际构建 CSS 证明它还在——错的是结论，不是代码。
|
|
105
|
+
|
|
106
|
+
## Sharing
|
|
107
|
+
|
|
108
|
+
所有设置——包括自定义三色——都装进一条短码。粘到导入框点「预览」，先看到将覆盖什么，再确认应用：
|
|
109
|
+
|
|
110
|
+
```text
|
|
111
|
+
dshs1.eyJ2IjoxLCJwIjoiY3VzdG9tIiwicyI6ImRlZXAiLCJ0IjoidGludGVkIiwiciI6InNpZGViYXIiLCJjIjoidGludGVkIiwiayI6ImFjY2VudCIsIm0iOiJvbiIsImgiOiJvZmYiLCJsIjoiemgtQ04iLCJ4Ijp7ImJnIjoiI2Y1ZWZlNiIsInRleHQiOiIjMWQxYTE3IiwiYWNjZW50IjoiIzNmNjZhMyJ9fQ
|
|
40
112
|
```
|
|
41
113
|
|
|
42
|
-
|
|
114
|
+
这条真实示例解码后是：
|
|
43
115
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
装完**必须重启 GUI**（运行中的进程仍持旧模块）。入口：左下角头像 → **设置** → 「**主题色**」。
|
|
49
|
-
|
|
50
|
-
## Configuration
|
|
116
|
+
- 配色：自定义 · 侧栏：更深 · 文字：标准 · 右栏：同左栏
|
|
117
|
+
- 滚动条：跟随 · 控件：主题色 · Markdown 强调：开 · 高对比：关 · 语言：zh-CN
|
|
118
|
+
- 三色：`#f5efe6`（底色）· `#1d1a17`（文字）· `#3f66a3`（强调）
|
|
51
119
|
|
|
52
|
-
|
|
53
|
-
|---|---|
|
|
54
|
-
| 配色 | 黑白 · 暖砂 · 靛蓝 · 苔绿（卡片缩略图跟随明暗） |
|
|
55
|
-
| 强度 | 静 / 标准 / 浓 —— 正文与强调的着色程度 |
|
|
56
|
-
| 面板表面 | 左侧栏（更浅 / 同色 / 更深）、右侧栏（同左栏 / 跟随画布） |
|
|
57
|
-
| 更多选项 | 语言、Markdown 强调、滚动条、开关 / 勾选 |
|
|
120
|
+
短码由生产编码器生成、经解码往返自检后才写进本文档——从不手写。
|
|
58
121
|
|
|
59
|
-
|
|
122
|
+
## Trade-offs
|
|
60
123
|
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
```
|
|
64
|
-
OKLCH(L, C, hue) ──► 色域钳位（对 C 二分） ──► sRGB hex
|
|
65
|
-
▲
|
|
66
|
-
└── 角色色度 × 强度，再在 {画布, 卡层, 侧栏, 悬浮层} 上求解对比度
|
|
67
|
-
```
|
|
68
|
-
|
|
69
|
-
- 语义别名保留 `var(--dsw-static-neutral-bluish-NN)` 引用链，跟 token 的元素就跟着配色走；
|
|
70
|
-
- 浅色面用色阶 00–300，深色面用 800–950；
|
|
71
|
-
- 文字下限在构建期强制：正文 ≥ 12、次级 ≥ 6.1、三级/链接 ≥ 4.6、侧栏内 ≥ 7、气泡内 ≥ 7；
|
|
72
|
-
- `node palette-dev.mjs` 跑 432 组配置。
|
|
73
|
-
|
|
74
|
-
逐组件设计取舍与对比度表见 [docs/DESIGN.md](docs/DESIGN.md)，版本记录见 [CHANGELOG.md](CHANGELOG.md)。
|
|
75
|
-
|
|
76
|
-
## Development
|
|
77
|
-
|
|
78
|
-
```bash
|
|
79
|
-
node palette-dev.mjs # 全部配色的 token 报表
|
|
80
|
-
node tools/sheet.mjs # 配色看板 → tools/sheet.html
|
|
81
|
-
node tools/shoot-sheet.mjs # 无头 Chrome 截看板
|
|
82
|
-
node tools/compare.mjs --dir tools/out/<run> # 与基线比
|
|
83
|
-
node tools/preview-settings.mjs --lang en # 渲染设置页
|
|
84
|
-
node tools/release.mjs --dry # 发版预检
|
|
85
|
-
node tools/release.mjs --tag # 发 npm + 打 tag
|
|
86
|
-
```
|
|
124
|
+
这个生态里别的主题插件做玻璃、壁纸、动效。我们刻意不做：
|
|
87
125
|
|
|
88
|
-
|
|
126
|
+
- **不做玻璃与壁纸。** 那条赛道靠截图竞争，我们更愿意靠证据竞争。
|
|
127
|
+
- **不做主题市场，也不做 AI 生色。** 两者都会引入我们无法保证的颜色；对比度求解器是资产，往里喂不可预测的输入等于自毁。
|
|
128
|
+
- **不再堆配色。** 4 套预设 + 三色生成，强过手挑十套；数量不是护城河。
|
|
129
|
+
- **不做护眼宣称。** 我们只报文字真实落在的承载面上的实测对比度，到顶就写"表面受限"，不做医学声明。
|
|
89
130
|
|
|
90
|
-
## License
|
|
91
131
|
|
|
92
|
-
|
|
132
|
+
## License
|
|
133
|
+
|
|
134
|
+
MIT © 2026 Zuoyunlai
|