cloverta/SanYeCao-blog
1
0
Fork 0
mirror of https://github.com/ClovertaTheTrilobita/SanYeCao-blog.git synced 2026-04-02 01:54:50 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix performance issues possibly caused by font

Browse source
This commit is contained in:
ClovertaTheTrilobita 2026-03-26 17:35:06 +02:00
parent 865fa9a08c
commit d500790d85
1 changed files with 51 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

78
src/layouts/MarkdownPostLayout.astro
View file

@ -5,7 +5,6 @@ import { getLangFromUrl, getTranslations } from "@/i18n";
import "@/styles/global.css"; import "@/styles/global.css";
const { frontmatter, lang, postId } = Astro.props; const { frontmatter, lang, postId } = Astro.props;
// const lang = getLangFromUrl(Astro.url);
const t = getTranslations(lang); const t = getTranslations(lang);
--- ---
@ -14,38 +13,42 @@ const t = getTranslations(lang);
description={frontmatter.description} description={frontmatter.description}
image={frontmatter.image?.url} image={frontmatter.image?.url}
> >
<div class="post-header"> <article class="post-article">
<div class="post-meta"> <div class="post-header">
<h1 class="post-title">{frontmatter.title}</h1> <div class="post-meta">
<p class="description"><em>{frontmatter.description}</em></p> <h1 class="post-title">{frontmatter.title}</h1>
<p class="meta-line"> <p class="description"><em>{frontmatter.description}</em></p>
{t.post.publishedOn}: {frontmatter.pubDate.toLocaleDateString()} <p class="meta-line">
</p> {t.post.publishedOn}: {frontmatter.pubDate.toLocaleDateString()}
<p class="meta-line">{t.post.writtenBy}: {frontmatter.author}</p> </p>
<p class="meta-line">{t.post.writtenBy}: {frontmatter.author}</p>
<div class="tags"> <div class="tags">
{ {
frontmatter.tags.map((tag: string) => ( frontmatter.tags.map((tag: string) => (
<p class="tag"> <p class="tag">
<a href={`/${lang}/tags/${tag}`}>{tag}</a> <a href={`/${lang}/tags/${tag}`}>{tag}</a>
</p> </p>
)) ))
} }
</div>
</div> </div>
<img
src={frontmatter.image.url}
alt={frontmatter.image.alt}
class="post-cover"
/>
</div> </div>
<img <div class="post-divider"></div>
src={frontmatter.image.url}
alt={frontmatter.image.alt}
class="post-cover"
/>
</div>
<div class="post-divider"></div> <div class="post-content">
<slot />
</div>
<slot /> <Giscus term={postId} />
</article>
<Giscus term={postId} />
</BaseLayout> </BaseLayout>
<script <script
@ -77,6 +80,27 @@ const t = getTranslations(lang);
/> />
<style> <style>
.post-content {
font-family:
system-ui,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
"PingFang SC",
"Hiragino Sans GB",
"Microsoft YaHei",
"Noto Sans CJK SC",
"Source Han Sans SC",
sans-serif;
}
.post-content :global(code),
.post-content :global(pre),
.post-content :global(kbd),
.post-content :global(samp) {
font-family: "Maple Mono", "Maple Mono CN", monospace;
}
a { a {
color: var(--post-link-color); color: var(--post-link-color);
} }