@dsh-tom/dsh-css 0.1.2 → 0.1.3

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/README.md CHANGED
@@ -21,7 +21,7 @@ npm publish --access public --registry=https://registry.npmjs.org/
21
21
  打开 **插件 → 添加插件 → 安装第三方插件**,在“包名或地址”输入:
22
22
 
23
23
  ```text
24
- D:\product\dsh-css\dsh-tom-dsh-css-0.1.2.tgz
24
+ D:\product\dsh-css\dsh-tom-dsh-css-0.1.3.tgz
25
25
  ```
26
26
 
27
27
  安装并启用,然后完全退出并重新打开 dsh。
@@ -31,7 +31,7 @@ D:\product\dsh-css\dsh-tom-dsh-css-0.1.2.tgz
31
31
  包发布到 npmjs 后,先卸载已安装的旧版,再打开 **插件 → 添加插件 → 安装第三方插件**,输入:
32
32
 
33
33
  ```text
34
- @dsh-tom/dsh-css@0.1.2
34
+ @dsh-tom/dsh-css@0.1.3
35
35
  ```
36
36
 
37
37
  选择 **安装源 → npm 官方源**,安装并启用,然后完全退出并重新打开 dsh。
package/dist/client.js CHANGED
@@ -3,7 +3,7 @@ window.__ModuleLoader__.load({
3
3
  id: "@dsh-tom/dsh-css",
4
4
  factory: (require) => {
5
5
  const { createElement } = require('react');
6
- const css = "/* 深色模式配色,保留内置文字、边框和语法高亮颜色。 */\nhtml body[data-ds-dark-theme] {\n /* 区域 1:左侧会话列表;Windows 标题栏在下方单独设置。原 RGB(27, 27, 28)。 */\n --dsw-specific-sidebar-fill: rgb(36, 37, 33) !important;\n\n /* 区域 2:会话标题、正文以及应用基础背景。原 RGB(21, 21, 23)。 */\n --dsw-alias-bg-base: rgb(39, 40, 34) !important;\n\n /* 区域 3:主输入框。原 RGB(44, 44, 46)。 */\n --dsw-specific-input-major: rgb(66, 67, 61) !important;\n\n /* 会话内代码块及使用同一语义变量的输出区域。原 RGB(27, 27, 28)。 */\n --dsw-alias-markdown-code-block: rgb(55, 56, 50) !important;\n}\n\n/* 标题栏及原生窗口按钮共享此颜色,会话列表继续使用原来的背景。 */\nhtml[data-windows-titlebar] body[data-ds-dark-theme] {\n --dsw-specific-sidebar-fill: rgb(32, 32, 32) !important;\n\n & .BynINW_sidebarCol {\n --dsw-specific-sidebar-fill: rgb(36, 37, 33) !important;\n }\n}\n\n/* Windows 桌面版展开侧栏:左侧图标栏 + 右侧标题、会话列表。\n * 类名对应 DSH 0.2.1-rc.2;折叠侧栏继续使用宿主布局。\n * 复用品牌、新会话、面板和账户按钮,不改变原有点击事件。\n */\nhtml[data-windows-titlebar] body[data-ds-dark-theme] ._2H3hWW_root:not(._2H3hWW_collapsed) {\n --dsh-css-rail-width: 52px;\n display: grid;\n grid-template-columns: var(--dsh-css-rail-width) minmax(0, 1fr);\n grid-template-rows: 52px auto auto minmax(0, 1fr);\n padding: 0;\n position: relative;\n\n &::before {\n content: \"\";\n position: absolute;\n inset: 0 auto 0 0;\n width: var(--dsh-css-rail-width);\n background: rgb(32, 32, 32);\n pointer-events: none;\n }\n\n & ._2H3hWW_logoRow {\n grid-area: 1 / 2;\n height: 52px;\n margin: 0;\n padding: 0 16px;\n justify-content: flex-start;\n }\n\n & ._2H3hWW_logoRow::after {\n content: \"DeepSeek\";\n color: var(--dsw-alias-label-primary);\n font: 600 18px / 24px var(--dsw-font-family);\n letter-spacing: 0;\n }\n\n /* 原品牌按钮仍打开新会话,以首页图标呈现。 */\n & ._2H3hWW_brand {\n position: absolute;\n top: 8px;\n left: 8px;\n width: 36px;\n height: 36px;\n padding: 0;\n border-radius: 8px;\n justify-content: center;\n background: var(--dsw-alias-interactive-bg-hover);\n overflow: visible;\n }\n\n & ._2H3hWW_brandIdentity {\n display: none;\n }\n\n & ._2H3hWW_brand::before {\n content: \"\";\n width: 18px;\n height: 18px;\n background: currentColor;\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 2 10v3h2v7a2 2 0 0 0 2 2h4v-7h4v7h4a2 2 0 0 0 2-2v-7h2v-3Z'/%3E%3C/svg%3E\") center / contain no-repeat;\n }\n\n &:has(._2H3hWW_panelActive) ._2H3hWW_brand {\n background: transparent;\n }\n\n & ._2H3hWW_newSession {\n grid-area: 2 / 2;\n align-self: start;\n z-index: 1;\n height: 36px;\n margin: 0 8px;\n padding: 0 8px;\n border: none;\n border-radius: 8px;\n background: transparent;\n font-weight: 400;\n justify-content: flex-start;\n }\n\n & ._2H3hWW_newSessionContent {\n width: 100%;\n justify-content: flex-start;\n gap: 8px;\n }\n\n & ._2H3hWW_newSessionContent > svg {\n display: none;\n }\n\n & ._2H3hWW_newSessionContent::before {\n content: \"\";\n flex: none;\n width: 14px;\n height: 14px;\n background: currentColor;\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4H5a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2h13a2 2 0 0 0 2-2v-7M16 3a2.1 2.1 0 0 1 3 3L9 16l-4 1 1-4Z'/%3E%3C/svg%3E\") center / contain no-repeat;\n }\n\n & ._2H3hWW_panelList {\n grid-area: 2 / 1;\n position: relative;\n align-self: start;\n gap: 8px;\n margin: 0;\n padding: 0 8px;\n }\n\n & ._2H3hWW_panelRow {\n position: relative;\n justify-content: center;\n width: 36px;\n height: 36px;\n margin: 0;\n padding: 0;\n border-radius: 8px;\n color: var(--dsw-alias-label-tertiary);\n }\n\n & ._2H3hWW_panelTitle {\n display: none;\n }\n\n & ._2H3hWW_panelGlyph > svg {\n width: 18px;\n height: 18px;\n }\n\n & ._2H3hWW_panelActive {\n color: var(--dsw-alias-label-primary);\n }\n\n /* 列表与导航共用网格行,顶部留出新会话按钮的位置。 */\n & ._2H3hWW_regionArea {\n grid-area: 2 / 2 / -1 / 3;\n margin: 0;\n padding: 44px 0 0 12px;\n }\n\n & ._2H3hWW_footArea {\n grid-area: 4 / 1;\n position: relative;\n align-self: end;\n gap: 8px;\n padding: 8px;\n }\n\n & ._2H3hWW_footerActions:empty {\n display: none;\n }\n\n /* 左下角设置按钮沿用账户菜单,设置、登录等入口仍由宿主提供。 */\n & .ET65mq_trigger {\n position: relative;\n justify-content: center;\n width: 36px;\n height: 36px;\n padding: 0;\n border-radius: 8px;\n color: var(--dsw-alias-label-tertiary);\n }\n\n & .ET65mq_trigger > * {\n display: none;\n }\n\n & .ET65mq_trigger::before {\n content: \"\";\n width: 18px;\n height: 18px;\n background: currentColor;\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 3-.5 2-2 1-2-.5-2 3.5L4.5 10v3L3 14l2 3.5 2-.5 2 1 .5 3h5l.5-3 2-1 2 .5 2-3.5-1.5-1v-3L21 9l-2-3.5-2 .5-2-1-.5-2Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E\") center / contain no-repeat;\n }\n\n /* 同一元素也显示等待状态,只隐藏普通的相对时间。 */\n & .hIlkoa_sessionRow > .hIlkoa_time:not([aria-hidden=\"true\"]) {\n display: none;\n }\n\n & :is(._2H3hWW_brand, ._2H3hWW_newSession, .ET65mq_trigger):hover {\n background: var(--dsw-alias-interactive-bg-hover);\n }\n\n & :is(._2H3hWW_brand, ._2H3hWW_newSession, .ET65mq_trigger):focus-visible {\n outline: var(--dsw-focus-ring-width) solid var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary));\n outline-offset: -2px;\n }\n\n /* 展开状态下宿主禁用了面板 Tooltip,为纯图标入口补上名称。 */\n & :is(._2H3hWW_panelRow, .ET65mq_trigger):is(:hover, :focus-visible)::after {\n content: attr(aria-label);\n position: absolute;\n z-index: 40;\n left: 44px;\n top: 50%;\n transform: translateY(-50%);\n padding: 4px 8px;\n border: 1px solid var(--dsw-alias-border-l3);\n border-radius: 6px;\n background: var(--dsw-alias-bg-layer-1);\n color: var(--dsw-alias-label-primary);\n font: 12px / 20px var(--dsw-font-family);\n white-space: nowrap;\n pointer-events: none;\n }\n\n & .ET65mq_trigger:is(:hover, :focus-visible)::after {\n content: \"设置\";\n }\n}\n\n/* 悬浮卡片由宿主通过 portal 挂在侧栏外。 */\n.dsh-css-project {\n display: none;\n}\n\nhtml[data-windows-titlebar] body[data-ds-dark-theme] .dsh-css-project {\n display: flex;\n align-items: center;\n gap: 6px;\n color: var(--dsw-alias-label-secondary);\n font-size: 12px;\n line-height: 20px;\n\n & svg {\n flex: none;\n }\n\n & span {\n overflow-wrap: anywhere;\n }\n}\n";
6
+ const css = "/* 深色模式配色,保留内置文字、边框和语法高亮颜色。 */\nhtml body[data-ds-dark-theme] {\n /* 区域 1:左侧会话列表;Windows 标题栏在下方单独设置。原 RGB(27, 27, 28)。 */\n --dsw-specific-sidebar-fill: rgb(36, 37, 33) !important;\n\n /* 区域 2:会话标题、正文以及应用基础背景。原 RGB(21, 21, 23)。 */\n --dsw-alias-bg-base: rgb(39, 40, 34) !important;\n\n /* 区域 3:主输入框。原 RGB(44, 44, 46)。 */\n --dsw-specific-input-major: rgb(66, 67, 61) !important;\n\n /* 会话内代码块及使用同一语义变量的输出区域。原 RGB(27, 27, 28)。 */\n --dsw-alias-markdown-code-block: rgb(55, 56, 50) !important;\n}\n\n/* 标题栏及原生窗口按钮共享此颜色,会话列表继续使用原来的背景。 */\nhtml[data-windows-titlebar] body[data-ds-dark-theme] {\n --dsw-specific-sidebar-fill: rgb(32, 32, 32) !important;\n\n & .BynINW_sidebarCol {\n --dsw-specific-sidebar-fill: rgb(36, 37, 33) !important;\n }\n\n /* 主内容面板左上角改为直角。 */\n & .BynINW_centerCol {\n border-top-left-radius: 0;\n }\n}\n\n/* Windows 桌面版展开侧栏:左侧图标栏 + 右侧标题、会话列表。\n * 类名对应 DSH 0.2.1-rc.2;折叠侧栏继续使用宿主布局。\n * 复用品牌、新会话、面板和账户按钮,不改变原有点击事件。\n */\nhtml[data-windows-titlebar] body[data-ds-dark-theme] ._2H3hWW_root:not(._2H3hWW_collapsed) {\n --dsh-css-rail-width: 52px;\n display: grid;\n grid-template-columns: var(--dsh-css-rail-width) minmax(0, 1fr);\n grid-template-rows: 52px auto auto minmax(0, 1fr);\n padding: 0;\n position: relative;\n\n &::before {\n content: \"\";\n position: absolute;\n inset: 0 auto 0 0;\n width: var(--dsh-css-rail-width);\n background: rgb(32, 32, 32);\n pointer-events: none;\n }\n\n & ._2H3hWW_logoRow {\n grid-area: 1 / 2;\n height: 52px;\n margin: 0;\n padding: 0 16px;\n justify-content: flex-start;\n }\n\n & ._2H3hWW_logoRow::after {\n content: \"DeepSeek\";\n color: var(--dsw-alias-label-primary);\n font: 600 18px / 24px var(--dsw-font-family);\n letter-spacing: 0;\n }\n\n /* 原品牌按钮仍打开新会话,以首页图标呈现。 */\n & ._2H3hWW_brand {\n position: absolute;\n top: 8px;\n left: 8px;\n width: 36px;\n height: 36px;\n padding: 0;\n border-radius: 8px;\n justify-content: center;\n background: var(--dsw-alias-interactive-bg-hover);\n overflow: visible;\n }\n\n & ._2H3hWW_brandIdentity {\n display: none;\n }\n\n & ._2H3hWW_brand::before {\n content: \"\";\n width: 18px;\n height: 18px;\n background: currentColor;\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 2 10v3h2v7a2 2 0 0 0 2 2h4v-7h4v7h4a2 2 0 0 0 2-2v-7h2v-3Z'/%3E%3C/svg%3E\") center / contain no-repeat;\n }\n\n &:has(._2H3hWW_panelActive) ._2H3hWW_brand {\n background: transparent;\n }\n\n & ._2H3hWW_newSession {\n grid-area: 2 / 2;\n align-self: start;\n z-index: 1;\n height: 36px;\n margin: 0 8px;\n padding: 0 8px;\n border: none;\n border-radius: 8px;\n background: transparent;\n font-weight: 400;\n justify-content: flex-start;\n }\n\n & ._2H3hWW_newSessionContent {\n width: 100%;\n justify-content: flex-start;\n gap: 8px;\n }\n\n & ._2H3hWW_newSessionContent > svg {\n display: none;\n }\n\n & ._2H3hWW_newSessionContent::before {\n content: \"\";\n flex: none;\n width: 14px;\n height: 14px;\n background: currentColor;\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4H5a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2h13a2 2 0 0 0 2-2v-7M16 3a2.1 2.1 0 0 1 3 3L9 16l-4 1 1-4Z'/%3E%3C/svg%3E\") center / contain no-repeat;\n }\n\n & ._2H3hWW_panelList {\n grid-area: 2 / 1;\n position: relative;\n align-self: start;\n gap: 8px;\n margin: 0;\n padding: 0 8px;\n }\n\n & ._2H3hWW_panelRow {\n position: relative;\n justify-content: center;\n width: 36px;\n height: 36px;\n margin: 0;\n padding: 0;\n border-radius: 8px;\n color: var(--dsw-alias-label-tertiary);\n }\n\n & ._2H3hWW_panelTitle {\n display: none;\n }\n\n & ._2H3hWW_panelGlyph > svg {\n width: 18px;\n height: 18px;\n }\n\n & ._2H3hWW_panelActive {\n color: var(--dsw-alias-label-primary);\n }\n\n /* 列表与导航共用网格行,顶部留出新会话按钮的位置。 */\n & ._2H3hWW_regionArea {\n grid-area: 2 / 2 / -1 / 3;\n margin: 0;\n padding: 44px 0 0 12px;\n }\n\n & ._2H3hWW_footArea {\n grid-area: 4 / 1;\n position: relative;\n align-self: end;\n gap: 8px;\n padding: 8px;\n }\n\n & ._2H3hWW_footerActions:empty {\n display: none;\n }\n\n /* 左下角设置按钮沿用账户菜单,设置、登录等入口仍由宿主提供。 */\n & .ET65mq_trigger {\n position: relative;\n justify-content: center;\n width: 36px;\n height: 36px;\n padding: 0;\n border-radius: 8px;\n color: var(--dsw-alias-label-tertiary);\n }\n\n & .ET65mq_trigger > * {\n display: none;\n }\n\n & .ET65mq_trigger::before {\n content: \"\";\n width: 18px;\n height: 18px;\n background: currentColor;\n mask: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 3-.5 2-2 1-2-.5-2 3.5L4.5 10v3L3 14l2 3.5 2-.5 2 1 .5 3h5l.5-3 2-1 2 .5 2-3.5-1.5-1v-3L21 9l-2-3.5-2 .5-2-1-.5-2Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E\") center / contain no-repeat;\n }\n\n /* 同一元素也显示等待状态,只隐藏普通的相对时间。 */\n & .hIlkoa_sessionRow > .hIlkoa_time:not([aria-hidden=\"true\"]) {\n display: none;\n }\n\n & :is(._2H3hWW_brand, ._2H3hWW_newSession, .ET65mq_trigger):hover {\n background: var(--dsw-alias-interactive-bg-hover);\n }\n\n & :is(._2H3hWW_brand, ._2H3hWW_newSession, .ET65mq_trigger):focus-visible {\n outline: var(--dsw-focus-ring-width) solid var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary));\n outline-offset: -2px;\n }\n\n /* 展开状态下宿主禁用了面板 Tooltip,为纯图标入口补上名称。 */\n & :is(._2H3hWW_panelRow, .ET65mq_trigger):is(:hover, :focus-visible)::after {\n content: attr(aria-label);\n position: absolute;\n z-index: 40;\n left: 44px;\n top: 50%;\n transform: translateY(-50%);\n padding: 4px 8px;\n border: 1px solid var(--dsw-alias-border-l3);\n border-radius: 6px;\n background: var(--dsw-alias-bg-layer-1);\n color: var(--dsw-alias-label-primary);\n font: 12px / 20px var(--dsw-font-family);\n white-space: nowrap;\n pointer-events: none;\n }\n\n & .ET65mq_trigger:is(:hover, :focus-visible)::after {\n content: \"设置\";\n }\n}\n\n/* 悬浮卡片由宿主通过 portal 挂在侧栏外。 */\n.dsh-css-project {\n display: none;\n}\n\nhtml[data-windows-titlebar] body[data-ds-dark-theme] .dsh-css-project {\n display: flex;\n align-items: center;\n gap: 6px;\n color: var(--dsw-alias-label-secondary);\n font-size: 12px;\n line-height: 20px;\n\n & svg {\n flex: none;\n }\n\n & span {\n overflow-wrap: anywhere;\n }\n}\n";
7
7
  const inject = ['slots', 'sessions', 'workspaces', 'layout'];
8
8
 
9
9
  // createElement 和 css 由构建入口注入,React 复用宿主提供的模块。
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dsh-tom/dsh-css",
3
- "version": "0.1.2",
3
+ "version": "0.1.3",
4
4
  "description": "为 DeepSeek Harness 深色界面调整侧边栏、会话、输入框和代码块的背景颜色。",
5
5
  "type": "module",
6
6
  "main": "./index.js",
package/theme.css CHANGED
@@ -20,6 +20,11 @@ html[data-windows-titlebar] body[data-ds-dark-theme] {
20
20
  & .BynINW_sidebarCol {
21
21
  --dsw-specific-sidebar-fill: rgb(36, 37, 33) !important;
22
22
  }
23
+
24
+ /* 主内容面板左上角改为直角。 */
25
+ & .BynINW_centerCol {
26
+ border-top-left-radius: 0;
27
+ }
23
28
  }
24
29
 
25
30
  /* Windows 桌面版展开侧栏:左侧图标栏 + 右侧标题、会话列表。