vscode修改左侧菜单字体行高间距
这里我修改的行高32px;
1、如果直接修改css行高,发现菜单position 的top值是动态生成的,所以修改js.
js文件: /opt/apps/com.visualstudio.code/files/share/code/resources/app/out/vs/workbench/workbench.desktop.main.js
可以搜索“s(e.reduce((e,t)=>e.concat(t)”,快速定位到红色标记旁。
然后在t.size前加上:
t.templateId==="file"?32:
,在e.size前加上:
e.templateId==="file"?32:
2、修改css 文件:/opt/apps/com.visualstudio.code/files/share/code/resources/app/out/vs/workbench/workbench.desktop.main.css
在css文件末尾加上:
/* 自定义 */
.explorer-viewlet .monaco-workbench .monaco-tl-row{
height: 32px;
line-height: 32px;
}
.explorer-viewlet .explorer-item {
height: 32px;
line-height: 32px;
}
.explorer-viewlet .monaco-tl-twistie{
height: 32px;
line-height: 32px;
}
.explorer-viewlet .monaco-tl-contents{
height: 32px;
line-height: 32px;
}
.explorer-viewlet .show-file-icons .folder-icon::before,.explorer-viewlet .show-file-icons .file-icon::before{
height: 32px;
line-height: 32px;
margin-right: 6px;
background-size: auto;
}
.explorer-viewlet .show-file-icons .ignore-lang-file-icon.file-icon::before{
height: 32px;
line-height: 32px;
margin-right: 6px;
background-size: auto;
}
.explorer-viewlet .monaco-list .monaco-list-row.selected{
height: 32px!important;
line-height: 32px!important;
}
.explorer-viewlet .show-file-icons .php-lang-file-icon.file-icon::before{
height: 32px;
line-height: 32px;
margin-right: 6px;
background-size: auto;
}
.explorer-viewlet .monaco-list.mouse-support .monaco-list-row{
height: 32px!important;
line-height: 32px!important;
}
.explorer-viewlet .monaco-icon-label>.monaco-icon-label-container>.monaco-icon-name-container>.label-name{
height: 32px!important;
line-height: 32px!important;
font-size: 16px;
}
.explorer-viewlet .show-file-icons .monaco-tl-twistie.collapsible:not(.collapsed) + .monaco-tl-contents .folder-icon::before{
height: 32px!important;
line-height: 32px!important;
}
最后再看看效果: