shd101wyy / vscode-markdown-preview-enhanced

One of the "BEST" markdown preview extensions for Visual Studio Code
https://shd101wyy.github.io/markdown-preview-enhanced
Other
1.45k stars 173 forks source link

请求添加更多精美的样式主题,目前主题渲染的效果期望能更好 #2030

Open QingShuiHU opened 2 months ago

QingShuiHU commented 2 months ago

目前markdown的渲染效果为:

image 代码命令过长时没有自动换行,并且滚动条始终不能”隐藏“,特别宽,影响美观。 此外,滚动条滚动时,右上角的菜单图标会随之移动,理论上是固定到右上角。 image 希望能够支持通过使用YAML front matter来指定启用不同的主题: theme指定markdown应用的主题 将主题集中到某个配置文件中,用户可以自行添加主题样式,只需要通过主题名引用即可拓展。

希望得到回复,谢谢。

vanleefxp commented 1 month ago

主题是样式表的问题,其实你完全是可以自定义样式表的。你可以从零开始自己写一个样式表,把主题设为 none, 然后在你的每一个 Markdown 文件开头人为添加你自己的样式表。使用以下的语法——

@import "path/to/your/stylesheet.css"

支持的样式表格式有 CSS 和 Less, SASS 暂时不支持,如果要用 SASS 的话得先编译成 CSS. 当然我也希望插件对主题的支持可以更灵活,就目前的效果来看,插件内置的样式表和自定义样式表的地位是不对等的,而且这个 @import 语句更像是 CSS 中的写法,如果能把引入自定义样式表的形式变成通过 front matter 实现,我觉得会更好操作,也更符合 Markdown 的使用习惯。

vanleefxp commented 1 month ago

代码自动换行可以通过以下 CSS 样式实现,参考 MDN 上对 white-space 属性的解释

pre { white-space: pre-wrap }