Update some formats of this blog

This commit is contained in:
Daisuke Nakahara 2025-05-15 20:18:36 +09:00
parent fc2a5be2e7
commit 034a317648
6 changed files with 37 additions and 11 deletions

View file

@ -5,6 +5,7 @@ author: 'Nakahara Daisuke'
tags: ["introduction"] tags: ["introduction"]
--- ---
# Hello!
Hello, my name is Daisuke. Hello, my name is Daisuke.
This is my first blog post. Nice to meet you. This is my first blog post. Nice to meet you.

View file

@ -15,7 +15,9 @@ const { pageTitle } = Astro.props;
</head> </head>
<body> <body>
<Header /> <Header />
<h1>{pageTitle}</h1> <h1 class="page-title">
{pageTitle}
</h1>
<slot /> <slot />
<Footer> <Footer>
<script> <script>
@ -23,3 +25,9 @@ const { pageTitle } = Astro.props;
</script> </script>
</body> </body>
</html> </html>
<style>
.page-title {
font-size: 2.8rem;
}
</style>

View file

@ -12,8 +12,7 @@ const optionsForDate = {
--- ---
<BaseLayout pageTitle={frontmatter.title}> <BaseLayout pageTitle={frontmatter.title}>
<p>Created on: {frontmatter.pubDate.toLocaleDateString("ja-JP", optionsForDate)}</p> <p>Created on: {frontmatter.pubDate.toLocaleDateString("en-US", optionsForDate)}</p>
<p>Written by: {frontmatter.author}</p>
<p><em>{frontmatter.description}</em></p> <p><em>{frontmatter.description}</em></p>
<div class="tags"> <div class="tags">
{ {
@ -24,7 +23,9 @@ const optionsForDate = {
)) ))
} }
</div> </div>
<slot /> <article class="markdown-content">
<slot />
</article>
</BaseLayout> </BaseLayout>
<style> <style>
@ -45,4 +46,20 @@ const optionsForDate = {
font-size: 1.15em; font-size: 1.15em;
background-color: #f8fcfd; background-color: #f8fcfd;
} }
.markdown-content {
font-family: sans-serif;
font-size: 1.2rem;
}
.markdown-content h1 {
font-size: 1.9rem;
}
.markdown-content h2 {
font-size: 1.75rem;
}
.markdown-content h3 {
font-size: 1.5rem;
}
</style> </style>

View file

@ -20,10 +20,10 @@ const pageTitle = "Latest Posts";
<BlogPost <BlogPost
url={`/posts/${post.id}/`} url={`/posts/${post.id}/`}
title={post.data.title} title={post.data.title}
datetime={post.data.pubDate.toLocaleDateString("ja-JP", { datetime={post.data.pubDate.toLocaleDateString("en-US", {
year: "numeric", year: "numeric",
month: "2-digit", month: "long",
day: "2-digit", day: "numeric",
})} })}
/> />
)) ))

View file

@ -45,10 +45,10 @@ const allPosts = await getCollection("blog");
<BlogPost <BlogPost
url={`/posts/${post.id}/`} url={`/posts/${post.id}/`}
title={post.data.title} title={post.data.title}
datetime={post.data.pubDate.toLocaleDateString("ja-JP", { datetime={post.data.pubDate.toLocaleDateString("en-US", {
year: "numeric", year: "numeric",
month: "2-digit", month: "long",
day: "2-digit", day: "numeric",
})} })}
/> />
)) ))

View file

@ -16,4 +16,4 @@ const { Content } = await render(post);
<MarkdownPostLayout frontmatter={post.data}> <MarkdownPostLayout frontmatter={post.data}>
<Content /> <Content />
</MarkdownPostLayout> </MarkdownPostLayout>