72 lines
1.6 KiB
Plaintext
72 lines
1.6 KiB
Plaintext
---
|
|
import { getEntry, type CollectionKey } from "astro:content";
|
|
|
|
interface Props {
|
|
articleSlug: string;
|
|
collectionName: CollectionKey;
|
|
}
|
|
const { articleSlug, collectionName } = Astro.props;
|
|
|
|
const article = await getEntry(collectionName, articleSlug);
|
|
const { Content } = await article!.render();
|
|
const articlePrettyName = article!.id.split("/").pop()!.replace(".md", "");
|
|
---
|
|
|
|
<div class="article">
|
|
<div class="article-title">
|
|
<h1>{articlePrettyName} </h1>
|
|
{
|
|
article!.data.lastUpdate && (
|
|
<span class="last-update">Last Update: {article!.data.lastUpdate}</span>
|
|
)
|
|
}
|
|
</div>
|
|
<Content />
|
|
</div>
|
|
|
|
<style>
|
|
:global(.article img) {
|
|
max-width: 100%;
|
|
margin: auto;
|
|
display: block;
|
|
}
|
|
:global(.article p) {
|
|
margin: 1em 0 1em 0;
|
|
}
|
|
:global(.article > h1, h2, h3, h4, h5) {
|
|
margin: 1em 0 1em 0;
|
|
}
|
|
:global(.article-title h1) {
|
|
margin: 0.5em 0 0 0;
|
|
}
|
|
.article .article-title {
|
|
display: flex;
|
|
align-items: baseline;
|
|
flex-wrap: wrap;
|
|
}
|
|
/* reduce indent of TOC list */
|
|
:global(.article-title + ul) {
|
|
margin: 1em 0 1em 0;
|
|
padding: 0 0 0 20px;
|
|
}
|
|
/* font for all code */
|
|
:global(.article code) {
|
|
font-family: "Consolas", "Tahoma", sans-serif;
|
|
}
|
|
/* code block */
|
|
:global(.article pre) {
|
|
border: 1px solid #eee;
|
|
border-left: 6px solid #ccc;
|
|
padding: 6px 6px 4px 6px;
|
|
border-radius: 6px;
|
|
}
|
|
/* inline code in paragraph*/
|
|
:global(.article p code) {
|
|
color: #be4750;
|
|
}
|
|
/* inline code in list item */
|
|
:global(.article li > code) {
|
|
color: #be4750;
|
|
}
|
|
</style>
|