Hacktoberfest 2026:维护者为十月标记出来的 issue,仍然开放、适合新手。 浏览 Hacktoberfest issue

Design the VS Code Workspaces panel

未关闭
#1,113 3 条评论 0 个 reaction 已指派 1 人 在 GitHub 查看

维护者通常 2 天内回复

@chrifro 已经在做这个了。

开始于 2026年9月15日。

评估

这个 Issue 还没有评估数据。

描述

Scope

Design the Workspaces panel associated with DEVEX-621 (workspaces: panel components on top of packages/ui).

Design only — no backend integration, IPC, data fetching, or functional implementation.

Design direction

Aim to follow VS Code's design patterns and monochrome/low-color approach so the panel feels native to the editor. Prefer hierarchy, spacing, typography, and icons over decorative color. Any colored pills or indicators should be restrained, meaningful, theme-aware, and understandable without color alone.

Hierarchy and layout
  • Preserve the familiar VS Code layout: workspace name, owner when it isn't you, and workspace → agent hierarchy.
  • Improve the visual hierarchy of subagents so their parent relationship is clear.
  • Preserve hover-revealed actions, with keyboard-accessible equivalents.
  • Explore an overflow menu (…) for secondary actions, with icons where helpful.
Metadata and status
  • Replace one-tree-item-per-metadata-entry with a more compact, readable presentation.
  • Explore pills for status or metadata, using color sparingly and only where it adds meaning.
  • Show when a workspace needs an update and distinguish that from its current status.
  • Cover app statuses displayed under each agent.
  • Include metadata freshness / “collected at” tooltips.
States and accessibility
  • Cover welcome, empty, error, and loading states.
  • Specify keyboard focus and keyboard-accessible equivalents of hover actions.
  • Check narrow sidebar layouts and long names/values.
  • Cover light, dark, and high-contrast themes.

Deferred

A search bar with custom filters should wait until the dashboard design is complete so the experiences can align. Search/filter design and implementation are out of scope for this issue.

Deliverables

  • Mockups covering the hierarchy, metadata, statuses, and relevant panel states.
  • Interaction notes for expansion, hover/focus actions, overflow menus, and tooltips.
  • Representative examples with multiple agents/subagents and dense metadata.
  • Clear separation between the initial design and deferred search/filter work.

Generated by Coder Agents on behalf of @EhabY.

主要语言
TypeScript
星标
132
派生
48
平均合并
2 天 5 小时
30 天内合并 PR
19

环境准备

在 Codespaces 中打开

在浏览器里用你自己的 GitHub 账号启动这个项目的开发容器。

  • 没有 Dockerfile 或 Docker Compose 文件
  • 没有 Pull Request 模板
  • 阅读贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

coder/vscode-coder 的其他 Issue

查看 coder/vscode-coder 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。