diff --git a/src/components/DateFormat.astro b/src/components/DateFormat.astro
new file mode 100644
index 0000000..ae6590d
--- /dev/null
+++ b/src/components/DateFormat.astro
@@ -0,0 +1,78 @@
+---
+import { themeConfig } from '@/config'
+import { isPostPage } from '@/utils/path'
+
+interface Props {
+ date: Date
+ updatedDate?: Date
+ minutes?: number
+}
+
+const { date, updatedDate, minutes } = Astro.props
+const format = themeConfig.global.dateFormat
+const currentPath = Astro.url.pathname
+const isPost = isPostPage(currentPath)
+const updatedTimeMarginClass = isPost ? 'ml-1.75' : 'ml-1.5'
+const readingTimeMarginClass = isPost ? 'ml-1.75' : 'ml-1.5'
+
+function formatDate(date: Date, format: 'YYYY-MM-DD' | 'MM-DD-YYYY' | 'DD-MM-YYYY' | 'MONTH DAY YYYY' | 'DAY MONTH YYYY') {
+ const options: Intl.DateTimeFormatOptions = {
+ year: 'numeric',
+ month: format === 'MONTH DAY YYYY' || format === 'DAY MONTH YYYY' ? 'short' : '2-digit',
+ day: format === 'MONTH DAY YYYY' || format === 'DAY MONTH YYYY' ? 'numeric' : '2-digit',
+ }
+
+ switch (format) {
+ // ISO format: 2024-03-04
+ case 'YYYY-MM-DD':
+ return date.toISOString().split('T')[0]
+
+ // US date format: 03-04-2024
+ case 'MM-DD-YYYY':
+ return date.toLocaleDateString('en-US', options).replace(/\//g, '-')
+
+ // European date format: 04-03-2024
+ case 'DD-MM-YYYY':
+ return date.toLocaleDateString('en-GB', options).replace(/\//g, '-')
+
+ // US month text format: Mar 4 2024
+ case 'MONTH DAY YYYY':
+ return date.toLocaleDateString('en-US', {
+ year: 'numeric',
+ month: 'short',
+ day: 'numeric',
+ }).replace(',', '')
+
+ // British month text format: 4 Mar 2024
+ case 'DAY MONTH YYYY':
+ return date.toLocaleDateString('en-GB', {
+ year: 'numeric',
+ month: 'short',
+ day: 'numeric',
+ }).replace(',', '')
+
+ // Default to ISO format
+ default:
+ return date.toISOString().split('T')[0]
+ }
+}
+---
+
+
+
+
+
+{updatedDate && (
+
+)}
+
+
+{minutes !== undefined && (
+
+ {minutes} min
+
+)}
diff --git a/src/components/PostList.astro b/src/components/PostList.astro
index 0f0488b..a643282 100644
--- a/src/components/PostList.astro
+++ b/src/components/PostList.astro
@@ -1,5 +1,6 @@
---
-// Define props received by the component
+import PostTime from '@/components/PostTime.astro'
+
interface Post {
data: {
title: string
@@ -31,9 +32,9 @@ function getPostUrl(post: Post) {
---
{posts.map(post => (
- // Single Post
-
+ {/* post title */}
+ {/* mobile post time */}
-
-
- {post.remarkPluginFrontmatter?.minutes} min
-
+
+ {/* desktop post time */}
-
-
- {post.remarkPluginFrontmatter?.minutes} min
-
+
diff --git a/src/components/PostTime.astro b/src/components/PostTime.astro
new file mode 100644
index 0000000..ae6590d
--- /dev/null
+++ b/src/components/PostTime.astro
@@ -0,0 +1,78 @@
+---
+import { themeConfig } from '@/config'
+import { isPostPage } from '@/utils/path'
+
+interface Props {
+ date: Date
+ updatedDate?: Date
+ minutes?: number
+}
+
+const { date, updatedDate, minutes } = Astro.props
+const format = themeConfig.global.dateFormat
+const currentPath = Astro.url.pathname
+const isPost = isPostPage(currentPath)
+const updatedTimeMarginClass = isPost ? 'ml-1.75' : 'ml-1.5'
+const readingTimeMarginClass = isPost ? 'ml-1.75' : 'ml-1.5'
+
+function formatDate(date: Date, format: 'YYYY-MM-DD' | 'MM-DD-YYYY' | 'DD-MM-YYYY' | 'MONTH DAY YYYY' | 'DAY MONTH YYYY') {
+ const options: Intl.DateTimeFormatOptions = {
+ year: 'numeric',
+ month: format === 'MONTH DAY YYYY' || format === 'DAY MONTH YYYY' ? 'short' : '2-digit',
+ day: format === 'MONTH DAY YYYY' || format === 'DAY MONTH YYYY' ? 'numeric' : '2-digit',
+ }
+
+ switch (format) {
+ // ISO format: 2024-03-04
+ case 'YYYY-MM-DD':
+ return date.toISOString().split('T')[0]
+
+ // US date format: 03-04-2024
+ case 'MM-DD-YYYY':
+ return date.toLocaleDateString('en-US', options).replace(/\//g, '-')
+
+ // European date format: 04-03-2024
+ case 'DD-MM-YYYY':
+ return date.toLocaleDateString('en-GB', options).replace(/\//g, '-')
+
+ // US month text format: Mar 4 2024
+ case 'MONTH DAY YYYY':
+ return date.toLocaleDateString('en-US', {
+ year: 'numeric',
+ month: 'short',
+ day: 'numeric',
+ }).replace(',', '')
+
+ // British month text format: 4 Mar 2024
+ case 'DAY MONTH YYYY':
+ return date.toLocaleDateString('en-GB', {
+ year: 'numeric',
+ month: 'short',
+ day: 'numeric',
+ }).replace(',', '')
+
+ // Default to ISO format
+ default:
+ return date.toISOString().split('T')[0]
+ }
+}
+---
+
+
+
+
+
+{updatedDate && (
+
+)}
+
+
+{minutes !== undefined && (
+
+ {minutes} min
+
+)}
diff --git a/src/config.ts b/src/config.ts
index f63bb9d..b96d11c 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -15,7 +15,7 @@ export const themeConfig: ThemeConfig = {
url: 'https://retypeset.radishzz.cc',
// favicon url
// support only webp, svg or png
- favicon: '/image/logo.svg', // https://example.com/logo.svg
+ favicon: '/image/Logo.svg', // https://example.com/logo.svg
},
// SITE INFORMATION >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> END
@@ -55,6 +55,8 @@ export const themeConfig: ThemeConfig = {
moreLocale: ['zh-tw', 'ja', 'en', 'es', 'ru'], // zh, zh-tw, ja, en, es, ru
// font styles for text
fontStyle: 'sans', // sans, serif
+ // date format for posts
+ dateFormat: 'MONTH DAY YYYY', // YYYY-MM-DD, MM-DD-YYYY, DD-MM-YYYY, MONTH DAY YYYY, DAY MONTH YYYY
// space between title and subtitle
titleSpace: 3, // 1, 2, 3
},
@@ -151,12 +153,12 @@ export const themeConfig: ThemeConfig = {
// PRELOAD SETTINGS >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> START
preload: {
- // link prefetch strategy
- // details: https://docs.astro.build/en/guides/prefetch/#prefetch-strategies
+ // link prefetch
+ // docs: https://docs.astro.build/en/guides/prefetch/#prefetch-strategies
linkPrefetch: 'viewport', // hover, tap, viewport, load
// comment server url
commentURL: 'https://comment.radishzz.cc',
- // image hosting domain
+ // image hosting url
imageHostURL: 'https://image.radishzz.cc',
// If you proxy analytics js to the custom domain, you can fill in below.
// See https://gist.github.com/xiaopc/0602f06ca465d76bd9efd3dda9393738
diff --git a/src/pages/[lang]/posts/[slug].astro b/src/pages/[lang]/posts/[slug].astro
index a07f6f3..7aa3869 100644
--- a/src/pages/[lang]/posts/[slug].astro
+++ b/src/pages/[lang]/posts/[slug].astro
@@ -25,7 +25,7 @@ const { Content, remarkPluginFrontmatter } = await post.render()
{post.data.title}
diff --git a/src/pages/posts/[slug].astro b/src/pages/posts/[slug].astro
index e636da5..19bfc59 100644
--- a/src/pages/posts/[slug].astro
+++ b/src/pages/posts/[slug].astro
@@ -1,5 +1,6 @@
---
import Comments from '@/components/Comments/index.astro'
+import PostTime from '@/components/PostTime.astro'
import Layout from '@/layouts/Layout.astro'
import { checkSlugDuplication } from '@/utils/content'
import { generatePostPaths } from '@/utils/i18n/route'
@@ -40,17 +41,12 @@ const { Content, remarkPluginFrontmatter } = await post.render()
transition:name={`time-${post.data.abbrlink || post.slug}`}
data-disable-transition-on-theme
>
-
-
- {remarkPluginFrontmatter.minutes} min
-
- {post.data.updated && (
-
- updated {post.data.updated.toLocaleDateString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit' }).replace(/\//g, '-')}
-
- )}
+
+
diff --git a/src/types/index.d.ts b/src/types/index.d.ts
index 3b0e6bf..be0f62e 100644
--- a/src/types/index.d.ts
+++ b/src/types/index.d.ts
@@ -33,6 +33,7 @@ export interface ThemeConfig {
locale: typeof langPath[number]
moreLocale: typeof langPath[number][]
fontStyle: 'sans' | 'serif'
+ dateFormat: 'YYYY-MM-DD' | 'MM-DD-YYYY' | 'DD-MM-YYYY' | 'MONTH DAY YYYY' | 'DAY MONTH YYYY'
titleSpace: 1 | 2 | 3
}