3

我想知道 vscode 的扩展 API 中是否有一些东西可以使命令调色板看起来像来自 Atom 的?

我喜欢 Atom 在屏幕中间打开它的方式和它的风格。

我们可以在扩展中应用自定义 CSS 表或做一些事情来实现吗?!

非常感谢 !

4

2 回答 2

2

我也有过这个问题。

我已经多次尝试 VS Code,但我真的不喜欢命令面板的外观。这一切都被压扁了,没有填充,而且……呃!

所以,我花了一些时间研究这个,我终于找到了一种方法来破解 VS Code 命令面板,让它看起来更像 Atom。

这是我的命令面板现在的样子: Hacked Together VS Code Command Palette 看起来(更)像 Atom。

这些是我采取的步骤:

  1. 安装猴子补丁
  2. 安装自定义 UI
  3. 将以下声明添加到您的 settings.json 中(根据需要进行自定义):

    "customizeUI.stylesheet": {
        ".quick-input-widget": "width: 650px; margin-left: -325px;important;top:50px !important; padding:15px !important;background-color:rgb(41 46 53)!important;border-radius:10px!important;",
        ".quick-input-widget .quick-input-header": "padding:0px!important;margin-bottom:10px;",
        ".quick-input-widget .monaco-inputbox": "padding:10px !important;border-radius:5px!important;",
        ".quick-input-widget .monaco-list-rows": "top: 0 !important;max-height:670px;min-height:300px;",
        ".quick-input-widget .monaco-list-row": "position:static!important;border-bottom: 1px solid #333942;padding:5px!important;height:auto!important;",
        ".quick-input-widget .quick-input-list-entry": "position:relative;padding:0 5px 0px 15px;",
        ".quick-input-widget .quick-input-list-entry .codicon[class*=codicon-]": "font-size:12px;",
        ".quick-input-widget .quick-input-list-entry .monaco-action-bar": "position:absolute;left:0;",
        // ".quick-input-widget .quick-input-list-entry .quick-input-list-label": "max-width: 80%;",
        ".quick-input-widget .quick-input-list .quick-input-list-entry.quick-input-list-separator-border": "border-top-width:0px!important;"
    },

它与 Atom 不完全匹配:

  • 这种方法的主要问题是键盘滚动不稳定。命令调色板列表的“结束”最终超出了包含 div 的溢出限制。因此,当您向下箭头时,您必须保持向下箭头 PAST 可见 div 的末尾,以使列表移动。我可以忍受这个。其他更擅长破解 VS Code 的人可能能够弄清楚这一点。

  • 当您调用命令选项板时,Atom 会使屏幕的其余部分变暗。我现在没有办法做到这一点。可以使用 Money Patch 添加一些自定义 javascript(添加类或伪元素),这将允许这种情况发生,但我不打算尝试。

可能还有其他问题,但就目前而言——这似乎工作得很好!

编辑:为清楚起见的文字。

于 2021-11-18T20:44:56.157 回答
1

这目前既不可能,也没有计划,既不是来自扩展,也不是来自配置设置。

我建议在命令面板上打开问题,如果需要,VS Code 必须改进它(https://github.com/Microsoft/vscode/)。

于 2016-07-09T05:58:50.237 回答