SuperAPI AI 工具集

style-terminal

前端与建站

查看项目

更新于 10-16 10:51

技能介绍

一、用途 style-terminal 是 list-styling 技能下的终端 / 黑客风格样式令牌与行模板,用于对 SharePoint 列表进行行格式化(rowFormatter),让列表在视觉上呈现命令行终端输出的观感。它属于样式皮肤,而非独立应用。

二、主要能力

  1. 深色卡片视觉:每行是一张深色卡片(背景 #0f172a,近黑深蓝),整体风格模拟阅读 ls -la 输出的感觉。
  2. 霓虹文字与锐利边角:文字在深色上使用明亮色;行内包含提示符字符 >(绿色 #4ade80)出现在文档名之前,文件名使用浅色 #e2e8f0。
  3. 状态徽章:状态以类似 CLI 参数的形式渲染,使用方括号包裹并可全大写显示。提供五种状态及回退的配色:Draft(bg #374151 / text #9ca3af / border #4b5563)、In Review(#1e3a5f / #38bdf8 / #0ea5e9)、Revising(#422006 / #fb923c / #f97316)、Approved(#052e16 / #4ade80 / #22c55e)、Published(#022c22 / #34d399 / #10b981)、_fallback(#1f2937 / #6b7280 / #374151)。
  4. 霓虹进度条:进度百分比为霓虹绿色;进度条轨道为深色 #1e293b,填充按进度变色(小于 30 用 #ef4444,小于 66 用 #38bdf8,否则 #4ade80),进度条 border-radius 为 0,边角硬朗。
  5. 逾期状态提示:逾期时显示方括号包围的 [OVERDUE],类似 CLI 标志;卡片边框变红(#ef4444),并带微弱红光 box-shadow(0px 0px 8px #ef444433)。
  6. 紧凑密集布局:卡片间距 4px,类似终端输出的高密度排布;无 emoji。
  7. 行模板自带 rowFormatter JSON,并说明需按用户实际列表列名与 Choice 值调整。文档提醒:下方列名([$Status]、[$Progress]、[$Deadline])与状态值字符串均为示例占位符,需替换为用户列表中真实的内部列名与实际 Choice 值,并遵循 list-styling Step 3。

三、使用方式 以行卡片模板为例,卡片基础样式包括:background-color #0f172a;border 通过表达式在逾期时取 1px solid #ef4444,否则为 1px solid #1e293b;border-radius 4px;margin-bottom 4px;逾期时 box-shadow 为 0px 0px 8px #ef444433,否则 none;min-height 60px。行内依次包含提示符 >、文档名(在 [$FileLeafRef] 为空时回退到 [$Title])、状态徽章、进度百分比、截止日期,以及逾期时的 [OVERDUE] 标志,下方为分段染色的进度条。整体使用 view-formatting.schema.json 的 rowFormatter 结构(hideSelection、hideColumnHeaders、rowFormatter 等字段)。

四、适用场景 文档明确指出该样式面向开发者 / 技术型受众,适合用于工程门户、开发者关系(dev rel)站点、SRE / 运维仪表盘。

五、限制与注意事项

  1. 不适用于普通员工站点、HR / 人员站点或对外页面;文档称深色 + 霓虹的组合在非技术受众看来会显得“未完成”或“故障”。若请求方不确定,应默认选用其他样式,并把 Terminal 作为备选提出,绝不可默认使用它。
  2. 对比度:文档给出终端调色板在深色背景上的对比度数据——霓虹绿 #39FF7A 在 #0F0F12 上约 9.1:1(AAA);青色 #5BE7FF 约 11.4:1(AAA);鲑红 #FF7A7A(用于 [OVERDUE])约 5.1:1(AA 普通文字);淡灰 #8A8F98 约 4.6:1(仅 AA Large,用于非必要文字)。若更改任何霓虹令牌,需在 WebAIM 重新核验。
  3. 响应式:≤600px 时,将次要元数据列折叠到终端提示符图标下方,且各断点均保留 > 提示符以承载身份识别;≤480px 时,除 [OVERDUE] 外隐藏其他方括号标志,由状态颜色承担提示作用。主文字桌面端使用 monospace 14px,不再缩小;等宽字体小于 13px 在小屏上会难以阅读。触控目标应 ≥44×44px,4px 行间距满足密度但行卡片本身保持可点击。
  4. 文档仅给出上述令牌与模板,未提供具体安装命令、定价或平台支持范围等信息,相关事项暂未提供。