feat(ui): give skill rows the module page's browse dialect by jackwener · Pull Request #2494 · apache/maka

jackwener · 2026-08-08T08:16:54Z

task #163 波 1。owner 反馈技能页「太素了」。

为什么：不是缺装饰，是没跟上隔壁

技能行和 MCP 行是同一种东西——可浏览的实体——但只有一边被打扮成实体。技能行是全 app 唯一用裸图标字形的浏览行，而数据里现成的分类、工具数在送进行的路上被丢掉了。

四处改动，零新增颜色

1 · 图标底共享化。.maka-mcp-market-icon 从 mcp.css 提升为 module-shell.css 的 .maka-module-market-icon，技能行采用。染色边界规则原样带走——这是当初真正花了心思的部分：带彩色官方 logo 的 tile 主动放弃染底、走安静中性板，因为 logo 已经提供了识别，再染底会和图标打架。技能无 logo，恒走中性板。共享这个类，是为了两个模块页从此不会漂成两套图标语言。

2 · 元数据回填，并且放在前面。 分类与 declaredTools.length 本来就在数据里。追加在描述末尾是错的：技能描述是给模型看的长 prose，一截断最先丢的就是元数据，需要分类的行恰恰一个都看不到。现在是「3 个工具 · 描述」。

3 · 内置按分类分组，每组一个 List 带自己的 header——结构才是浏览面变"富"的方式，找"能写文档的"的人需要的是标题。双守卫：只有一个分类时标题是纯开销；搜索时用户已经说了要什么，再按标题拆散反而埋掉命中。分组态下行内不再带分类（组标题已经说了）。

4 · 8 处手写图标尺寸 → 3 个角色常量，数值不变。

页头原本只数已安装，让一个另外两个 tab 都是目录的页面看起来空空如也；现在也数可安装（两个目录去重）。

怎么验证的

@maka/ui251 passed / 0 failed
skills 与 mcp 两个 e2e 都通过 —— MCP 的类名被指向了共享类，所以专门跑了它
typecheck / lint / format / build 全绿
视觉两态截图已过审

已知遗留（不在本 PR，已批准单开）

长描述没有省略号、被面板右缘直接切掉——改动前就存在，非本次引入。根因：Astryx Item 只对字符串 description 做截断，包 span 反而关掉它；真正的问题在 ModulePage 的 flex 链缺 min-width: 0，MCP 页同病。作为内容被切掉的 bug 单独修，两页截图为证。

jackwener · 2026-08-08T08:27:04Z

Hold — do not merge. I found a layout regression in this branch after opening it.

Rows no longer shrink: the li.astryx-item measures 2532px inside a ~900px panel (main: 860px), which pushes each row's install button off-screen (x=2842) and lets long descriptions run past the panel edge. The install buttons are missing from every row.

I had reported the clipping as a pre-existing bug. That was wrong on two counts: I had no genuine before-screenshot, and clean main truncates correctly with a visible ellipsis and shows the install buttons. It is a regression introduced here.

Prime suspect is the category grouping — main renders one List, this branch renders one List per category with a header, and the rows stop shrinking. Fixing now; will repost with main / regression / fixed screenshots before this is considered again.

The skills page read as plain next to MCP, and the cause was not missing decoration: a skill row and an MCP row are the same kind of thing — a browsable entity — and only one of them was dressed as one. The icon plate moves out of mcp.css into module-shell.css as `.maka-module-market-icon`, and skill rows adopt it. The tinting BOUNDARY moves with it, because that is the part that took thinking: a tile carrying a colourful official logo drops the tint and rides the quiet neutral plate, since the logo already supplies identity. Skills ship no logos, so they always take the neutral plate. Sharing the class is what stops the two module pages drifting into two icon languages. Category and declared-tool count were already in the data and thrown away on the way to the row. They now LEAD the supporting line: appended last they were the first thing a long description pushed out of sight, so exactly the rows that needed a category never showed one. Built-in skills group by category, each group a List carrying its own header. Structure is how a browse surface gets richer. Guarded twice: one category makes headings pure overhead, and while searching the user has already said what they want. Under a heading the row drops its own category. Grouping exposed a latent bug in the shared shell, fixed here. The module panel is a grid whose column sized to max-content, so a panel holding SEVERAL row groups stretched to its widest row: rows grew to 2532px inside a 900px panel, pushing every row's install button off screen and letting descriptions run past the edge. A single group happened to collapse and hid it. `grid-template-columns: minmax(0, 1fr)` states the intent — one column, never wider than the panel. MCP inherits the fix. Eight hand-written icon sizes become three role constants. Values unchanged. The page header also counts what is available to install, deduplicated across both catalogs, instead of only what is installed.

jackwener · 2026-08-08T08:16:54Z

task #163 波 1。owner 反馈技能页「太素了」。

为什么：不是缺装饰，是没跟上隔壁

技能行和 MCP 行是同一种东西——可浏览的实体——但只有一边被打扮成实体。技能行是全 app 唯一用裸图标字形的浏览行，而数据里现成的分类、工具数在送进行的路上被丢掉了。

四处改动，零新增颜色

1 · 图标底共享化。.maka-mcp-market-icon 从 mcp.css 提升为 module-shell.css 的 .maka-module-market-icon，技能行采用。染色边界规则原样带走——这是当初真正花了心思的部分：带彩色官方 logo 的 tile 主动放弃染底、走安静中性板，因为 logo 已经提供了识别，再染底会和图标打架。技能无 logo，恒走中性板。共享这个类，是为了两个模块页从此不会漂成两套图标语言。

2 · 元数据回填，并且放在前面。 分类与 declaredTools.length 本来就在数据里。追加在描述末尾是错的：技能描述是给模型看的长 prose，一截断最先丢的就是元数据，需要分类的行恰恰一个都看不到。现在是「3 个工具 · 描述」。

3 · 内置按分类分组，每组一个 List 带自己的 header——结构才是浏览面变"富"的方式，找"能写文档的"的人需要的是标题。双守卫：只有一个分类时标题是纯开销；搜索时用户已经说了要什么，再按标题拆散反而埋掉命中。分组态下行内不再带分类（组标题已经说了）。

4 · 8 处手写图标尺寸 → 3 个角色常量，数值不变。

页头原本只数已安装，让一个另外两个 tab 都是目录的页面看起来空空如也；现在也数可安装（两个目录去重）。

怎么验证的

@maka/ui251 passed / 0 failed
skills 与 mcp 两个 e2e 都通过 —— MCP 的类名被指向了共享类，所以专门跑了它
typecheck / lint / format / build 全绿
视觉两态截图已过审

已知遗留（不在本 PR，已批准单开）

长描述没有省略号、被面板右缘直接切掉——改动前就存在，非本次引入。根因：Astryx Item 只对字符串 description 做截断，包 span 反而关掉它；真正的问题在 ModulePage 的 flex 链缺 min-width: 0，MCP 页同病。作为内容被切掉的 bug 单独修，两页截图为证。

jackwener · 2026-08-08T08:27:04Z

Hold — do not merge. I found a layout regression in this branch after opening it.

Rows no longer shrink: the li.astryx-item measures 2532px inside a ~900px panel (main: 860px), which pushes each row's install button off-screen (x=2842) and lets long descriptions run past the panel edge. The install buttons are missing from every row.

I had reported the clipping as a pre-existing bug. That was wrong on two counts: I had no genuine before-screenshot, and clean main truncates correctly with a visible ellipsis and shows the install buttons. It is a regression introduced here.

Prime suspect is the category grouping — main renders one List, this branch renders one List per category with a header, and the rows stop shrinking. Fixing now; will repost with main / regression / fixed screenshots before this is considered again.

The skills page read as plain next to MCP, and the cause was not missing decoration: a skill row and an MCP row are the same kind of thing — a browsable entity — and only one of them was dressed as one. The icon plate moves out of mcp.css into module-shell.css as `.maka-module-market-icon`, and skill rows adopt it. The tinting BOUNDARY moves with it, because that is the part that took thinking: a tile carrying a colourful official logo drops the tint and rides the quiet neutral plate, since the logo already supplies identity. Skills ship no logos, so they always take the neutral plate. Sharing the class is what stops the two module pages drifting into two icon languages. Category and declared-tool count were already in the data and thrown away on the way to the row. They now LEAD the supporting line: appended last they were the first thing a long description pushed out of sight, so exactly the rows that needed a category never showed one. Built-in skills group by category, each group a List carrying its own header. Structure is how a browse surface gets richer. Guarded twice: one category makes headings pure overhead, and while searching the user has already said what they want. Under a heading the row drops its own category. Grouping exposed a latent bug in the shared shell, fixed here. The module panel is a grid whose column sized to max-content, so a panel holding SEVERAL row groups stretched to its widest row: rows grew to 2532px inside a 900px panel, pushing every row's install button off screen and letting descriptions run past the edge. A single group happened to collapse and hid it. `grid-template-columns: minmax(0, 1fr)` states the intent — one column, never wider than the panel. MCP inherits the fix. Eight hand-written icon sizes become three role constants. Values unchanged. The page header also counts what is available to install, deduplicated across both catalogs, instead of only what is installed.

jackwener · 2026-08-08T08:16:54Z

task #163 波 1。owner 反馈技能页「太素了」。

为什么：不是缺装饰，是没跟上隔壁

技能行和 MCP 行是同一种东西——可浏览的实体——但只有一边被打扮成实体。技能行是全 app 唯一用裸图标字形的浏览行，而数据里现成的分类、工具数在送进行的路上被丢掉了。

四处改动，零新增颜色

1 · 图标底共享化。.maka-mcp-market-icon 从 mcp.css 提升为 module-shell.css 的 .maka-module-market-icon，技能行采用。染色边界规则原样带走——这是当初真正花了心思的部分：带彩色官方 logo 的 tile 主动放弃染底、走安静中性板，因为 logo 已经提供了识别，再染底会和图标打架。技能无 logo，恒走中性板。共享这个类，是为了两个模块页从此不会漂成两套图标语言。

2 · 元数据回填，并且放在前面。 分类与 declaredTools.length 本来就在数据里。追加在描述末尾是错的：技能描述是给模型看的长 prose，一截断最先丢的就是元数据，需要分类的行恰恰一个都看不到。现在是「3 个工具 · 描述」。

3 · 内置按分类分组，每组一个 List 带自己的 header——结构才是浏览面变"富"的方式，找"能写文档的"的人需要的是标题。双守卫：只有一个分类时标题是纯开销；搜索时用户已经说了要什么，再按标题拆散反而埋掉命中。分组态下行内不再带分类（组标题已经说了）。

4 · 8 处手写图标尺寸 → 3 个角色常量，数值不变。

页头原本只数已安装，让一个另外两个 tab 都是目录的页面看起来空空如也；现在也数可安装（两个目录去重）。

怎么验证的

@maka/ui251 passed / 0 failed
skills 与 mcp 两个 e2e 都通过 —— MCP 的类名被指向了共享类，所以专门跑了它
typecheck / lint / format / build 全绿
视觉两态截图已过审

已知遗留（不在本 PR，已批准单开）

长描述没有省略号、被面板右缘直接切掉——改动前就存在，非本次引入。根因：Astryx Item 只对字符串 description 做截断，包 span 反而关掉它；真正的问题在 ModulePage 的 flex 链缺 min-width: 0，MCP 页同病。作为内容被切掉的 bug 单独修，两页截图为证。

jackwener · 2026-08-08T08:27:04Z

Hold — do not merge. I found a layout regression in this branch after opening it.

Rows no longer shrink: the li.astryx-item measures 2532px inside a ~900px panel (main: 860px), which pushes each row's install button off-screen (x=2842) and lets long descriptions run past the panel edge. The install buttons are missing from every row.

I had reported the clipping as a pre-existing bug. That was wrong on two counts: I had no genuine before-screenshot, and clean main truncates correctly with a visible ellipsis and shows the install buttons. It is a regression introduced here.

Prime suspect is the category grouping — main renders one List, this branch renders one List per category with a header, and the rows stop shrinking. Fixing now; will repost with main / regression / fixed screenshots before this is considered again.

The skills page read as plain next to MCP, and the cause was not missing decoration: a skill row and an MCP row are the same kind of thing — a browsable entity — and only one of them was dressed as one. The icon plate moves out of mcp.css into module-shell.css as `.maka-module-market-icon`, and skill rows adopt it. The tinting BOUNDARY moves with it, because that is the part that took thinking: a tile carrying a colourful official logo drops the tint and rides the quiet neutral plate, since the logo already supplies identity. Skills ship no logos, so they always take the neutral plate. Sharing the class is what stops the two module pages drifting into two icon languages. Category and declared-tool count were already in the data and thrown away on the way to the row. They now LEAD the supporting line: appended last they were the first thing a long description pushed out of sight, so exactly the rows that needed a category never showed one. Built-in skills group by category, each group a List carrying its own header. Structure is how a browse surface gets richer. Guarded twice: one category makes headings pure overhead, and while searching the user has already said what they want. Under a heading the row drops its own category. Grouping exposed a latent bug in the shared shell, fixed here. The module panel is a grid whose column sized to max-content, so a panel holding SEVERAL row groups stretched to its widest row: rows grew to 2532px inside a 900px panel, pushing every row's install button off screen and letting descriptions run past the edge. A single group happened to collapse and hid it. `grid-template-columns: minmax(0, 1fr)` states the intent — one column, never wider than the panel. MCP inherits the fix. Eight hand-written icon sizes become three role constants. Values unchanged. The page header also counts what is available to install, deduplicated across both catalogs, instead of only what is installed.

jackwener · 2026-08-08T08:16:54Z

task #163 波 1。owner 反馈技能页「太素了」。

为什么：不是缺装饰，是没跟上隔壁

技能行和 MCP 行是同一种东西——可浏览的实体——但只有一边被打扮成实体。技能行是全 app 唯一用裸图标字形的浏览行，而数据里现成的分类、工具数在送进行的路上被丢掉了。

四处改动，零新增颜色

1 · 图标底共享化。.maka-mcp-market-icon 从 mcp.css 提升为 module-shell.css 的 .maka-module-market-icon，技能行采用。染色边界规则原样带走——这是当初真正花了心思的部分：带彩色官方 logo 的 tile 主动放弃染底、走安静中性板，因为 logo 已经提供了识别，再染底会和图标打架。技能无 logo，恒走中性板。共享这个类，是为了两个模块页从此不会漂成两套图标语言。

2 · 元数据回填，并且放在前面。 分类与 declaredTools.length 本来就在数据里。追加在描述末尾是错的：技能描述是给模型看的长 prose，一截断最先丢的就是元数据，需要分类的行恰恰一个都看不到。现在是「3 个工具 · 描述」。

3 · 内置按分类分组，每组一个 List 带自己的 header——结构才是浏览面变"富"的方式，找"能写文档的"的人需要的是标题。双守卫：只有一个分类时标题是纯开销；搜索时用户已经说了要什么，再按标题拆散反而埋掉命中。分组态下行内不再带分类（组标题已经说了）。

4 · 8 处手写图标尺寸 → 3 个角色常量，数值不变。

页头原本只数已安装，让一个另外两个 tab 都是目录的页面看起来空空如也；现在也数可安装（两个目录去重）。

怎么验证的

@maka/ui251 passed / 0 failed
skills 与 mcp 两个 e2e 都通过 —— MCP 的类名被指向了共享类，所以专门跑了它
typecheck / lint / format / build 全绿
视觉两态截图已过审

已知遗留（不在本 PR，已批准单开）

长描述没有省略号、被面板右缘直接切掉——改动前就存在，非本次引入。根因：Astryx Item 只对字符串 description 做截断，包 span 反而关掉它；真正的问题在 ModulePage 的 flex 链缺 min-width: 0，MCP 页同病。作为内容被切掉的 bug 单独修，两页截图为证。

jackwener · 2026-08-08T08:27:04Z

Hold — do not merge. I found a layout regression in this branch after opening it.

Rows no longer shrink: the li.astryx-item measures 2532px inside a ~900px panel (main: 860px), which pushes each row's install button off-screen (x=2842) and lets long descriptions run past the panel edge. The install buttons are missing from every row.

I had reported the clipping as a pre-existing bug. That was wrong on two counts: I had no genuine before-screenshot, and clean main truncates correctly with a visible ellipsis and shows the install buttons. It is a regression introduced here.

Prime suspect is the category grouping — main renders one List, this branch renders one List per category with a header, and the rows stop shrinking. Fixing now; will repost with main / regression / fixed screenshots before this is considered again.

The skills page read as plain next to MCP, and the cause was not missing decoration: a skill row and an MCP row are the same kind of thing — a browsable entity — and only one of them was dressed as one. The icon plate moves out of mcp.css into module-shell.css as `.maka-module-market-icon`, and skill rows adopt it. The tinting BOUNDARY moves with it, because that is the part that took thinking: a tile carrying a colourful official logo drops the tint and rides the quiet neutral plate, since the logo already supplies identity. Skills ship no logos, so they always take the neutral plate. Sharing the class is what stops the two module pages drifting into two icon languages. Category and declared-tool count were already in the data and thrown away on the way to the row. They now LEAD the supporting line: appended last they were the first thing a long description pushed out of sight, so exactly the rows that needed a category never showed one. Built-in skills group by category, each group a List carrying its own header. Structure is how a browse surface gets richer. Guarded twice: one category makes headings pure overhead, and while searching the user has already said what they want. Under a heading the row drops its own category. Grouping exposed a latent bug in the shared shell, fixed here. The module panel is a grid whose column sized to max-content, so a panel holding SEVERAL row groups stretched to its widest row: rows grew to 2532px inside a 900px panel, pushing every row's install button off screen and letting descriptions run past the edge. A single group happened to collapse and hid it. `grid-template-columns: minmax(0, 1fr)` states the intent — one column, never wider than the panel. MCP inherits the fix. Eight hand-written icon sizes become three role constants. Values unchanged. The page header also counts what is available to install, deduplicated across both catalogs, instead of only what is installed.

jackwener · 2026-08-08T08:16:54Z

task #163 波 1。owner 反馈技能页「太素了」。

为什么：不是缺装饰，是没跟上隔壁

技能行和 MCP 行是同一种东西——可浏览的实体——但只有一边被打扮成实体。技能行是全 app 唯一用裸图标字形的浏览行，而数据里现成的分类、工具数在送进行的路上被丢掉了。

四处改动，零新增颜色

1 · 图标底共享化。.maka-mcp-market-icon 从 mcp.css 提升为 module-shell.css 的 .maka-module-market-icon，技能行采用。染色边界规则原样带走——这是当初真正花了心思的部分：带彩色官方 logo 的 tile 主动放弃染底、走安静中性板，因为 logo 已经提供了识别，再染底会和图标打架。技能无 logo，恒走中性板。共享这个类，是为了两个模块页从此不会漂成两套图标语言。

2 · 元数据回填，并且放在前面。 分类与 declaredTools.length 本来就在数据里。追加在描述末尾是错的：技能描述是给模型看的长 prose，一截断最先丢的就是元数据，需要分类的行恰恰一个都看不到。现在是「3 个工具 · 描述」。

3 · 内置按分类分组，每组一个 List 带自己的 header——结构才是浏览面变"富"的方式，找"能写文档的"的人需要的是标题。双守卫：只有一个分类时标题是纯开销；搜索时用户已经说了要什么，再按标题拆散反而埋掉命中。分组态下行内不再带分类（组标题已经说了）。

4 · 8 处手写图标尺寸 → 3 个角色常量，数值不变。

页头原本只数已安装，让一个另外两个 tab 都是目录的页面看起来空空如也；现在也数可安装（两个目录去重）。

怎么验证的

@maka/ui251 passed / 0 failed
skills 与 mcp 两个 e2e 都通过 —— MCP 的类名被指向了共享类，所以专门跑了它
typecheck / lint / format / build 全绿
视觉两态截图已过审

已知遗留（不在本 PR，已批准单开）

长描述没有省略号、被面板右缘直接切掉——改动前就存在，非本次引入。根因：Astryx Item 只对字符串 description 做截断，包 span 反而关掉它；真正的问题在 ModulePage 的 flex 链缺 min-width: 0，MCP 页同病。作为内容被切掉的 bug 单独修，两页截图为证。

jackwener · 2026-08-08T08:27:04Z

Hold — do not merge. I found a layout regression in this branch after opening it.

Rows no longer shrink: the li.astryx-item measures 2532px inside a ~900px panel (main: 860px), which pushes each row's install button off-screen (x=2842) and lets long descriptions run past the panel edge. The install buttons are missing from every row.

I had reported the clipping as a pre-existing bug. That was wrong on two counts: I had no genuine before-screenshot, and clean main truncates correctly with a visible ellipsis and shows the install buttons. It is a regression introduced here.

Prime suspect is the category grouping — main renders one List, this branch renders one List per category with a header, and the rows stop shrinking. Fixing now; will repost with main / regression / fixed screenshots before this is considered again.

The skills page read as plain next to MCP, and the cause was not missing decoration: a skill row and an MCP row are the same kind of thing — a browsable entity — and only one of them was dressed as one. The icon plate moves out of mcp.css into module-shell.css as `.maka-module-market-icon`, and skill rows adopt it. The tinting BOUNDARY moves with it, because that is the part that took thinking: a tile carrying a colourful official logo drops the tint and rides the quiet neutral plate, since the logo already supplies identity. Skills ship no logos, so they always take the neutral plate. Sharing the class is what stops the two module pages drifting into two icon languages. Category and declared-tool count were already in the data and thrown away on the way to the row. They now LEAD the supporting line: appended last they were the first thing a long description pushed out of sight, so exactly the rows that needed a category never showed one. Built-in skills group by category, each group a List carrying its own header. Structure is how a browse surface gets richer. Guarded twice: one category makes headings pure overhead, and while searching the user has already said what they want. Under a heading the row drops its own category. Grouping exposed a latent bug in the shared shell, fixed here. The module panel is a grid whose column sized to max-content, so a panel holding SEVERAL row groups stretched to its widest row: rows grew to 2532px inside a 900px panel, pushing every row's install button off screen and letting descriptions run past the edge. A single group happened to collapse and hid it. `grid-template-columns: minmax(0, 1fr)` states the intent — one column, never wider than the panel. MCP inherits the fix. Eight hand-written icon sizes become three role constants. Values unchanged. The page header also counts what is available to install, deduplicated across both catalogs, instead of only what is installed.

jackwener · 2026-08-08T08:16:54Z

task #163 波 1。owner 反馈技能页「太素了」。

为什么：不是缺装饰，是没跟上隔壁

技能行和 MCP 行是同一种东西——可浏览的实体——但只有一边被打扮成实体。技能行是全 app 唯一用裸图标字形的浏览行，而数据里现成的分类、工具数在送进行的路上被丢掉了。

四处改动，零新增颜色

1 · 图标底共享化。.maka-mcp-market-icon 从 mcp.css 提升为 module-shell.css 的 .maka-module-market-icon，技能行采用。染色边界规则原样带走——这是当初真正花了心思的部分：带彩色官方 logo 的 tile 主动放弃染底、走安静中性板，因为 logo 已经提供了识别，再染底会和图标打架。技能无 logo，恒走中性板。共享这个类，是为了两个模块页从此不会漂成两套图标语言。

2 · 元数据回填，并且放在前面。 分类与 declaredTools.length 本来就在数据里。追加在描述末尾是错的：技能描述是给模型看的长 prose，一截断最先丢的就是元数据，需要分类的行恰恰一个都看不到。现在是「3 个工具 · 描述」。

3 · 内置按分类分组，每组一个 List 带自己的 header——结构才是浏览面变"富"的方式，找"能写文档的"的人需要的是标题。双守卫：只有一个分类时标题是纯开销；搜索时用户已经说了要什么，再按标题拆散反而埋掉命中。分组态下行内不再带分类（组标题已经说了）。

4 · 8 处手写图标尺寸 → 3 个角色常量，数值不变。

页头原本只数已安装，让一个另外两个 tab 都是目录的页面看起来空空如也；现在也数可安装（两个目录去重）。

怎么验证的

@maka/ui251 passed / 0 failed
skills 与 mcp 两个 e2e 都通过 —— MCP 的类名被指向了共享类，所以专门跑了它
typecheck / lint / format / build 全绿
视觉两态截图已过审

已知遗留（不在本 PR，已批准单开）

长描述没有省略号、被面板右缘直接切掉——改动前就存在，非本次引入。根因：Astryx Item 只对字符串 description 做截断，包 span 反而关掉它；真正的问题在 ModulePage 的 flex 链缺 min-width: 0，MCP 页同病。作为内容被切掉的 bug 单独修，两页截图为证。

jackwener · 2026-08-08T08:27:04Z

Hold — do not merge. I found a layout regression in this branch after opening it.

Rows no longer shrink: the li.astryx-item measures 2532px inside a ~900px panel (main: 860px), which pushes each row's install button off-screen (x=2842) and lets long descriptions run past the panel edge. The install buttons are missing from every row.

I had reported the clipping as a pre-existing bug. That was wrong on two counts: I had no genuine before-screenshot, and clean main truncates correctly with a visible ellipsis and shows the install buttons. It is a regression introduced here.

Prime suspect is the category grouping — main renders one List, this branch renders one List per category with a header, and the rows stop shrinking. Fixing now; will repost with main / regression / fixed screenshots before this is considered again.

The skills page read as plain next to MCP, and the cause was not missing decoration: a skill row and an MCP row are the same kind of thing — a browsable entity — and only one of them was dressed as one. The icon plate moves out of mcp.css into module-shell.css as `.maka-module-market-icon`, and skill rows adopt it. The tinting BOUNDARY moves with it, because that is the part that took thinking: a tile carrying a colourful official logo drops the tint and rides the quiet neutral plate, since the logo already supplies identity. Skills ship no logos, so they always take the neutral plate. Sharing the class is what stops the two module pages drifting into two icon languages. Category and declared-tool count were already in the data and thrown away on the way to the row. They now LEAD the supporting line: appended last they were the first thing a long description pushed out of sight, so exactly the rows that needed a category never showed one. Built-in skills group by category, each group a List carrying its own header. Structure is how a browse surface gets richer. Guarded twice: one category makes headings pure overhead, and while searching the user has already said what they want. Under a heading the row drops its own category. Grouping exposed a latent bug in the shared shell, fixed here. The module panel is a grid whose column sized to max-content, so a panel holding SEVERAL row groups stretched to its widest row: rows grew to 2532px inside a 900px panel, pushing every row's install button off screen and letting descriptions run past the edge. A single group happened to collapse and hid it. `grid-template-columns: minmax(0, 1fr)` states the intent — one column, never wider than the panel. MCP inherits the fix. Eight hand-written icon sizes become three role constants. Values unchanged. The page header also counts what is available to install, deduplicated across both catalogs, instead of only what is installed.

jackwener · 2026-08-08T08:16:54Z

task #163 波 1。owner 反馈技能页「太素了」。

为什么：不是缺装饰，是没跟上隔壁

技能行和 MCP 行是同一种东西——可浏览的实体——但只有一边被打扮成实体。技能行是全 app 唯一用裸图标字形的浏览行，而数据里现成的分类、工具数在送进行的路上被丢掉了。

四处改动，零新增颜色

1 · 图标底共享化。.maka-mcp-market-icon 从 mcp.css 提升为 module-shell.css 的 .maka-module-market-icon，技能行采用。染色边界规则原样带走——这是当初真正花了心思的部分：带彩色官方 logo 的 tile 主动放弃染底、走安静中性板，因为 logo 已经提供了识别，再染底会和图标打架。技能无 logo，恒走中性板。共享这个类，是为了两个模块页从此不会漂成两套图标语言。

2 · 元数据回填，并且放在前面。 分类与 declaredTools.length 本来就在数据里。追加在描述末尾是错的：技能描述是给模型看的长 prose，一截断最先丢的就是元数据，需要分类的行恰恰一个都看不到。现在是「3 个工具 · 描述」。

3 · 内置按分类分组，每组一个 List 带自己的 header——结构才是浏览面变"富"的方式，找"能写文档的"的人需要的是标题。双守卫：只有一个分类时标题是纯开销；搜索时用户已经说了要什么，再按标题拆散反而埋掉命中。分组态下行内不再带分类（组标题已经说了）。

4 · 8 处手写图标尺寸 → 3 个角色常量，数值不变。

页头原本只数已安装，让一个另外两个 tab 都是目录的页面看起来空空如也；现在也数可安装（两个目录去重）。

怎么验证的

@maka/ui251 passed / 0 failed
skills 与 mcp 两个 e2e 都通过 —— MCP 的类名被指向了共享类，所以专门跑了它
typecheck / lint / format / build 全绿
视觉两态截图已过审

已知遗留（不在本 PR，已批准单开）

长描述没有省略号、被面板右缘直接切掉——改动前就存在，非本次引入。根因：Astryx Item 只对字符串 description 做截断，包 span 反而关掉它；真正的问题在 ModulePage 的 flex 链缺 min-width: 0，MCP 页同病。作为内容被切掉的 bug 单独修，两页截图为证。

jackwener · 2026-08-08T08:27:04Z

Hold — do not merge. I found a layout regression in this branch after opening it.

Rows no longer shrink: the li.astryx-item measures 2532px inside a ~900px panel (main: 860px), which pushes each row's install button off-screen (x=2842) and lets long descriptions run past the panel edge. The install buttons are missing from every row.

I had reported the clipping as a pre-existing bug. That was wrong on two counts: I had no genuine before-screenshot, and clean main truncates correctly with a visible ellipsis and shows the install buttons. It is a regression introduced here.

Prime suspect is the category grouping — main renders one List, this branch renders one List per category with a header, and the rows stop shrinking. Fixing now; will repost with main / regression / fixed screenshots before this is considered again.

The skills page read as plain next to MCP, and the cause was not missing decoration: a skill row and an MCP row are the same kind of thing — a browsable entity — and only one of them was dressed as one. The icon plate moves out of mcp.css into module-shell.css as `.maka-module-market-icon`, and skill rows adopt it. The tinting BOUNDARY moves with it, because that is the part that took thinking: a tile carrying a colourful official logo drops the tint and rides the quiet neutral plate, since the logo already supplies identity. Skills ship no logos, so they always take the neutral plate. Sharing the class is what stops the two module pages drifting into two icon languages. Category and declared-tool count were already in the data and thrown away on the way to the row. They now LEAD the supporting line: appended last they were the first thing a long description pushed out of sight, so exactly the rows that needed a category never showed one. Built-in skills group by category, each group a List carrying its own header. Structure is how a browse surface gets richer. Guarded twice: one category makes headings pure overhead, and while searching the user has already said what they want. Under a heading the row drops its own category. Grouping exposed a latent bug in the shared shell, fixed here. The module panel is a grid whose column sized to max-content, so a panel holding SEVERAL row groups stretched to its widest row: rows grew to 2532px inside a 900px panel, pushing every row's install button off screen and letting descriptions run past the edge. A single group happened to collapse and hid it. `grid-template-columns: minmax(0, 1fr)` states the intent — one column, never wider than the panel. MCP inherits the fix. Eight hand-written icon sizes become three role constants. Values unchanged. The page header also counts what is available to install, deduplicated across both catalogs, instead of only what is installed.

jackwener · 2026-08-08T08:16:54Z

task #163 波 1。owner 反馈技能页「太素了」。

为什么：不是缺装饰，是没跟上隔壁

技能行和 MCP 行是同一种东西——可浏览的实体——但只有一边被打扮成实体。技能行是全 app 唯一用裸图标字形的浏览行，而数据里现成的分类、工具数在送进行的路上被丢掉了。

四处改动，零新增颜色

1 · 图标底共享化。.maka-mcp-market-icon 从 mcp.css 提升为 module-shell.css 的 .maka-module-market-icon，技能行采用。染色边界规则原样带走——这是当初真正花了心思的部分：带彩色官方 logo 的 tile 主动放弃染底、走安静中性板，因为 logo 已经提供了识别，再染底会和图标打架。技能无 logo，恒走中性板。共享这个类，是为了两个模块页从此不会漂成两套图标语言。

2 · 元数据回填，并且放在前面。 分类与 declaredTools.length 本来就在数据里。追加在描述末尾是错的：技能描述是给模型看的长 prose，一截断最先丢的就是元数据，需要分类的行恰恰一个都看不到。现在是「3 个工具 · 描述」。

3 · 内置按分类分组，每组一个 List 带自己的 header——结构才是浏览面变"富"的方式，找"能写文档的"的人需要的是标题。双守卫：只有一个分类时标题是纯开销；搜索时用户已经说了要什么，再按标题拆散反而埋掉命中。分组态下行内不再带分类（组标题已经说了）。

4 · 8 处手写图标尺寸 → 3 个角色常量，数值不变。

页头原本只数已安装，让一个另外两个 tab 都是目录的页面看起来空空如也；现在也数可安装（两个目录去重）。

怎么验证的

@maka/ui251 passed / 0 failed
skills 与 mcp 两个 e2e 都通过 —— MCP 的类名被指向了共享类，所以专门跑了它
typecheck / lint / format / build 全绿
视觉两态截图已过审

已知遗留（不在本 PR，已批准单开）

长描述没有省略号、被面板右缘直接切掉——改动前就存在，非本次引入。根因：Astryx Item 只对字符串 description 做截断，包 span 反而关掉它；真正的问题在 ModulePage 的 flex 链缺 min-width: 0，MCP 页同病。作为内容被切掉的 bug 单独修，两页截图为证。

jackwener · 2026-08-08T08:27:04Z

Hold — do not merge. I found a layout regression in this branch after opening it.

Rows no longer shrink: the li.astryx-item measures 2532px inside a ~900px panel (main: 860px), which pushes each row's install button off-screen (x=2842) and lets long descriptions run past the panel edge. The install buttons are missing from every row.

I had reported the clipping as a pre-existing bug. That was wrong on two counts: I had no genuine before-screenshot, and clean main truncates correctly with a visible ellipsis and shows the install buttons. It is a regression introduced here.

Prime suspect is the category grouping — main renders one List, this branch renders one List per category with a header, and the rows stop shrinking. Fixing now; will repost with main / regression / fixed screenshots before this is considered again.

The skills page read as plain next to MCP, and the cause was not missing decoration: a skill row and an MCP row are the same kind of thing — a browsable entity — and only one of them was dressed as one. The icon plate moves out of mcp.css into module-shell.css as `.maka-module-market-icon`, and skill rows adopt it. The tinting BOUNDARY moves with it, because that is the part that took thinking: a tile carrying a colourful official logo drops the tint and rides the quiet neutral plate, since the logo already supplies identity. Skills ship no logos, so they always take the neutral plate. Sharing the class is what stops the two module pages drifting into two icon languages. Category and declared-tool count were already in the data and thrown away on the way to the row. They now LEAD the supporting line: appended last they were the first thing a long description pushed out of sight, so exactly the rows that needed a category never showed one. Built-in skills group by category, each group a List carrying its own header. Structure is how a browse surface gets richer. Guarded twice: one category makes headings pure overhead, and while searching the user has already said what they want. Under a heading the row drops its own category. Grouping exposed a latent bug in the shared shell, fixed here. The module panel is a grid whose column sized to max-content, so a panel holding SEVERAL row groups stretched to its widest row: rows grew to 2532px inside a 900px panel, pushing every row's install button off screen and letting descriptions run past the edge. A single group happened to collapse and hid it. `grid-template-columns: minmax(0, 1fr)` states the intent — one column, never wider than the panel. MCP inherits the fix. Eight hand-written icon sizes become three role constants. Values unchanged. The page header also counts what is available to install, deduplicated across both catalogs, instead of only what is installed.

jackwener changed the title ~~feat(ui): give skill rows the module page's browse dialect~~[DO NOT MERGE] feat(ui): give skill rows the module page's browse dialectAug 8, 2026

jackwener force-pushed the feat/skills-page-wave1 branch from d8a7085 to 390f9c6Compare August 8, 2026 08:31

jackwener changed the title ~~[DO NOT MERGE] feat(ui): give skill rows the module page's browse dialect~~feat(ui): give skill rows the module page's browse dialectAug 8, 2026

jackwener force-pushed the feat/skills-page-wave1 branch from 390f9c6 to 0f2a3fcCompare August 8, 2026 08:40

jackwener merged commit b9d94c3 into mainAug 8, 2026
12 checks passed

jackwener deleted the feat/skills-page-wave1 branch August 8, 2026 08:46