Amadeus
/
blog
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: add language as post property (#151) 

* feat: add language as post property

* update frontmatter.json

* style: remove extra space

* fix: remove unnecessary replacements

* feat: add `language` field to `new-post.js`

* style: format code style

* fix: use `siteConfig.lang` in `jsonLd`

* fix: use `siteConfig` when `entry.data` was empty
This commit is contained in:
Alan Ye 2024-08-27 23:52:30 +08:00 committed by GitHub
parent 856c2bb2c0
commit f79ee3482d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 20 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontmatter.json
View File

@ -55,6 +55,11 @@
"title": "draft",
"name": "draft",
"type": "boolean"
},
{
"title": "language",
"name": "language",
"type": "string"
}
]
}

1
scripts/new-post.js
View File

@ -44,6 +44,7 @@ image: ''
tags: []
category: ''
draft: false
language: ''
---
`

1
src/content/config.ts
View File

@ -9,6 +9,7 @@ const postsCollection = defineCollection({
image: z.string().optional().default(''),
tags: z.array(z.string()).optional().default([]),
category: z.string().optional().default(''),
language: z.string().optional().default(''),
/* For internal use */
prevTitle: z.string().default(''),

9
src/layouts/Layout.astro
View File

@ -21,9 +21,10 @@ interface Props {
title?: string
banner?: string
description?: string
lang?: string
}
let { title, banner, description } = Astro.props
let { title, banner, description, lang } = Astro.props
// apply a class to the body element to decide the height of the banner, only used for initial page load
// Swup can update the body for each page visit, but it's after the page transition, causing a delay for banner height change
@ -52,7 +53,11 @@ if (title) {
const favicons: Favicon[] =
siteConfig.favicon.length > 0 ? siteConfig.favicon : defaultFavicons
const siteLang = siteConfig.lang.replace('_', '-')
// const siteLang = siteConfig.lang.replace('_', '-')
if (!lang) {
lang = `${siteConfig.lang}`
}
const siteLang = lang.replace('_', '-')
---
<!DOCTYPE html>

5
src/layouts/MainGridLayout.astro
View File

@ -11,15 +11,16 @@ interface Props {
title?: string
banner?: string
description?: string
lang?: string
}
const { title, banner, description } = Astro.props
const { title, banner, description, lang } = Astro.props
const hasBannerCredit =
siteConfig.banner.enable && siteConfig.banner.credit.enable
const hasBannerLink = !!siteConfig.banner.credit.url
---
<Layout title={title} banner={banner} description={description}>
<Layout title={title} banner={banner} description={description} lang={lang}>
<slot slot="head" name="head"></slot>
<div class="max-w-[var(--page-width)] min-h-screen grid grid-cols-[17.5rem_auto] grid-rows-[auto_auto_1fr_auto] lg:grid-rows-[auto_1fr_auto]
mx-auto gap-4 relative px-0 md:px-4"

5
src/pages/posts/[...slug].astro
View File

@ -11,7 +11,7 @@ import { Icon } from 'astro-icon/components'
import { licenseConfig } from 'src/config'
import PostMetadata from '../../components/PostMeta.astro'
import ImageWrapper from '../../components/misc/ImageWrapper.astro'
import { profileConfig } from '../../config'
import { profileConfig, siteConfig } from '../../config'
import { formatDateToYYYYMMDD } from '../../utils/date-utils'
export async function getStaticPaths() {
@ -41,10 +41,11 @@ const jsonLd = {
url: Astro.site,
},
datePublished: formatDateToYYYYMMDD(entry.data.published),
inLanguage: (entry.data.language ? entry.data.language.replace('_', '-') : siteConfig.lang.replace('_', '-')),
// TODO include cover image here
}
---
<MainGridLayout banner={entry.data.image} title={entry.data.title} description={entry.data.description}>
<MainGridLayout banner={entry.data.image} title={entry.data.title} description={entry.data.description} lang={entry.data.language}>
<script is:inline slot="head" type="application/ld+json" set:html={JSON.stringify(jsonLd)}></script>
<div class="flex w-full rounded-[var(--radius-large)] overflow-hidden relative mb-4">
<div id="post-container" class:list={["card-base z-10 px-6 md:px-9 pt-6 pb-4 relative w-full ",