dsh-theme-neumorph 1.0.4 → 1.0.5

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.
Files changed (3) hide show
  1. package/README.md +2 -0
  2. package/client.js +20 -8
  3. package/package.json +1 -1
package/README.md CHANGED
@@ -38,6 +38,8 @@
38
38
  - 凡是要**加**规则的地方,锚定的都是**完整的 local 名**,而且一定用下划线夹住(`[class*="_card_"]` 而不是 `[class*="_card"]`),否则会串到 `_cardContent_x_y`、`_labelChip` 这种更长的零件上,卡片的每一块又各得一层投影。只有**排除**项才允许宽泛的片段(`button:not([class*="_row"])` 这类),因为排除范围宽一点只会少上一条浮雕,不会多毁一块界面。
39
39
  - 每个类名锚定都带 `:not([class*="__"])`:宿主是**单**下划线,别人家的 BEM 是**双**下划线,这一条挡住的正是 `panel__card`。
40
40
  - 裸标签只出现在三处:宿主的表单与代码面(`textarea`、`input`、`select`、`pre`)、可编辑文本(`[contenteditable="true"]`),以及必须同时带宿主类名的控件(`button` / `[role="button"]` / `a` + `[class*="_"]`)。`span` 不被当成文字。
41
+ - 悬在内容**之上**的控件必须不透明。主题里表面只有一个颜色,所以"透明"对躺在表面上的控件是对的,对浮在滚动正文之上的那颗"回到最新"圆钮就是错的——它的底来自 `--dsw-alias-button-floating-fill`,透明时消息会从圆钮里穿过去。`floating-fill` / `elevated-fill` 现在是表面色,`floating-hover` 与 `--dsw-alias-interactive-bg-hover-solid` 是一层浅色(后者是十处控件唯一的悬停反馈)。
42
+ - 圆形的钮不给 12px 圆角:按钮形状规则用 `host()` 锚定把"回到最新"(34px)与附件删除(18px)两颗圆盘排除在外,而不是事后改回来——按钮选择器里每个 `:not()` 都加权重,后面再写一条压不过它。
41
43
  - 不强制按钮底色。主题里所有表面是同一个颜色,透明按钮本来就与表面齐平;而宿主有些控件是**功能填充**(附件删除键的圆盘用 `--dsw-alias-button-contrast-fill`、叉号用 `--dsw-alias-label-primary-inverted`),一旦被灌成表面色,叉号就在近白底上消失了。所以按钮只加圆角与浮雕,填充留给宿主。
42
44
  - 文本会被拍平,但表单控件不会:宿主的重命名输入框类名就叫 `ymsBma_name`,它在文字规则里必须被 `:not(input):not(textarea):not(select)` 放行,否则那块输入框看起来就是一行纯文本。
43
45
  - 不是每个 token 都是"板子"。引用竖线(`--dsw-alias-markdown-citation`)、幽灵按钮的选中态(`--dsw-alias-button-ghost-active-fill`)、行内代码(`--dsw-alias-markdown-inline-code`)是宿主的**信号**,置成 `transparent` 等于把它们删掉,所以它们保留一层浅色,而不是跟其他表面一起消失。
package/client.js CHANGED
@@ -64,18 +64,22 @@ window.__ModuleLoader__.load({
64
64
  '--dsw-alias-menu-group-header-fill': FLAT,
65
65
  '--dsw-specific-bubble': FLAT,
66
66
  '--dsw-specific-bubble-highlight': FLAT,
67
- '--dsw-specific-sidebar-nav-item-active': FLAT,
67
+ '--dsw-specific-sidebar-nav-item-active': HOVER,
68
68
  '--dsw-specific-sidebar-nav-item-active-accent': FLAT,
69
69
 
70
- // ---- button fills: the same colour, relief comes from the shadow -----
71
- '--dsw-alias-button-elevated-fill': FLAT,
72
- '--dsw-alias-button-floating-fill': FLAT,
73
- '--dsw-alias-button-floating-hover': FLAT,
70
+ // ---- button fills ----------------------------------------------------
71
+ // Ghost fills vanish (the relief carries them), but a button that floats
72
+ // over content must be opaque: the "jump to latest" disc is painted from
73
+ // floating-fill, and a transparent disc lets the transcript scroll through
74
+ // it. Hover states keep a shade, or pressing feels like nothing happened.
75
+ '--dsw-alias-button-elevated-fill': SURFACE,
76
+ '--dsw-alias-button-floating-fill': SURFACE,
77
+ '--dsw-alias-button-floating-hover': HOVER,
74
78
  '--dsw-alias-button-ghost-active-fill': HOVER,
75
- '--dsw-alias-button-ghost-active-hover': FLAT,
79
+ '--dsw-alias-button-ghost-active-hover': HOVER,
76
80
  '--dsw-alias-fill-tsp-secondary': SURFACE,
77
81
  '--dsw-alias-button-contrast-fill': { light: '#3a4450', dark: '#c9d3de' },
78
- '--dsw-alias-interactive-bg-hover-solid': FLAT,
82
+ '--dsw-alias-interactive-bg-hover-solid': HOVER,
79
83
 
80
84
  // ---- code and inline panels: recessed, not tinted --------------------
81
85
  '--dsw-alias-markdown-code-block': FLAT,
@@ -239,11 +243,19 @@ body :is(${host(
239
243
  shadow under a row that spans the panel reads as a stray line, and a
240
244
  stack of them reads as alternating high and low. */
241
245
  ${BUTTON_SELECTOR} {
242
- border-radius: 12px !important;
243
246
  border-color: transparent !important;
244
247
  box-shadow: var(--qn-out-sm) !important;
245
248
  }
246
249
 
250
+ /* The shape is a rounded rectangle, except where the host draws a ring: the
251
+ jump-to-latest disc is a 34px circle and the attachment remove disc an 18px
252
+ one, and a 12px corner turns either into a small rounded square. Their own
253
+ radius is left alone instead of being restored afterwards, because a later
254
+ rule here could not out-rank this one. */
255
+ ${BUTTON_SELECTOR}:not(:is(${host('toBottom')})):not(:is(${host('remove')})) {
256
+ border-radius: 12px !important;
257
+ }
258
+
247
259
  ${BUTTON_SELECTOR}:hover:not(:disabled) {
248
260
  box-shadow: var(--qn-out) !important;
249
261
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dsh-theme-neumorph",
3
- "version": "1.0.4",
3
+ "version": "1.0.5",
4
4
  "description": "DSH 新拟态主题插件:冷灰表面、钢蓝强调、柔和阴影。",
5
5
  "license": "MIT",
6
6
  "author": "wcnmamrs",