config/frontmatter

[giscus[bot]]

config/frontmatter

详细介绍首页&文章相关的各个配置项

https://theme.sugarat.top/config/frontmatter.html

[lucky-cmyk]

上面的搜索框把文章标题和阅读用时遮挡了，取消搜索框也一样

[lucky-cmyk]

使用浏览器f12，打开控制台，切换设备使用自定义调整下，就可以看见，感谢博主

[ATQQ]

哦哦发现了，昨晚写了bug上去 害。

[ATQQ]

可以自己 重载一下 样式临时

sugar-blog/packages/theme/src/styles/index.scss

Lines 41 to 48 in babb6ba

	@media screen and (min-width: 960px) {
	#VPContent.VPContent{
	padding-top: 0;
	.VPHome{
	min-height: 100vh;
	}
	}
	}

.VPContent 改成.isHome

[ATQQ]

小写 .is-home

[ATQQ]

反馈的2个小问题解决了
可以更新一下主题依赖即可

[lucky-cmyk]

当前页面刷新，好像评论就消失了

[ATQQ]

这个我下来看一下 是啥bug😳

[MuYi086]

发现一个问题，如果把 CI/CD 交给 github action 处理, 大概是因为build时无法访问到.git文件提交的记录，
所有文章的发布时间都会赋值成同样的初始值。

[ATQQ]

这个就是你 github action 配置的问题了，可以参考模板里的配置，改一下git clone 的策略

[MuYi086]

感谢，确实是少了保留 Git信息 这一步

[AutumnFishs]

大佬，https://www.npmjs.com/package/@sugarat/theme?activeTab=code，这里的export const BlogTheme: Theme = {
...DefaultTheme,
Layout: withConfigProvider(BlogApp),
enhanceApp(ctx) {
enhanceAppWithTabs(ctx.app as any)
DefaultTheme.enhanceApp(ctx)
ctx.app.component('UserWorksPage', UserWorksPage as any)
// replace-mermaid-mounted-code
// if (!ctx.app.component('Mermaid')) { ctx.app.component('Mermaid', Mermaid as any) }
}配置在vitepress中配置layout就会被覆盖掉，比如我设置了
extends: BlogTheme,
Layout: () => {
const props: Record<string, any> = {};

const { frontmatter } = useData();

if (frontmatter.value?.layoutClass) {
  props.class = frontmatter.value.layoutClass;
  console.log(frontmatter.value);
}

return h(withConfigProvider(MyLayout), props, {
  // https://vitepress.dev/guide/extending-default-theme#layout-slots
});

},
enhanceApp(ctx: EnhanceAppContext) {
const { app } = ctx;

// vitepressNprogress(ctx);
app.component("MNavLinks", MNavLinks);
app.component("MNavLink", MNavLink);
app.component("BlogConfetti", BlogConfetti);
app.component("BlogVisitor", BlogVisitor);
app.component("MButton", MButton);
useComponents(app, DemoPreview);

},
setup() {
onMounted(() => {
mediumZoom("[data-zoomable]", { background: "var(--vp-c-bg)" }); // 默认
// mediumZoom("#app img", { background: "var(--vp-c-bg)" }); // 不显式添加{data-zoomable}的情况下为所有图像启用此功能
});
},
主题里面的内容就会被覆盖了，这里可以单独抛出，自己配置吗，我看blogapp组件吧原来的vitepress中插槽都保留了，是后面要更新还是现在就可以，只是我使用的姿势不对啊https://github.com/AutumnFishs/blog/blob/main/docs/.vitepress/theme/index.ts

[ATQQ]

参考布局插槽的方式引入自己的内容，在已有的Layout 插入，而非覆盖Layout（你现在的写法）

官方文档：https://vitepress.dev/zh/guide/extending-default-theme#layout-slots

一个例子

sugar-blog/packages/theme/docs/.vitepress/theme/index.ts

Lines 7 to 17 in d603916

	export default {
	...BlogTheme,
	Layout: h(BlogTheme.Layout, undefined, {
	'doc-before': () => h(JoinGroup),
	'doc-after': () => h(JoinGroup, { showImg: true }),
	}),
	enhanceApp(ctx: any) {
	BlogTheme?.enhanceApp?.(ctx)
	ctx.app.component('ChangeThemeDemo', ChangeThemeDemo)
	}
	}

[AutumnFishs]

谢谢