From 0c4281eb537d1d7675bcf8f84316a5d7ed0b3bcb Mon Sep 17 00:00:00 2001
From: Bao <6306455+baodrate@users.noreply.github.com>
Date: Tue, 03 Dec 2024 06:41:55 +0000
Subject: [PATCH] fix: use time HTML element for date strings (#1622)
---
quartz/components/styles/contentMeta.scss | 2 +-
quartz/components/PageList.tsx | 10 +++-------
quartz/components/ContentMeta.tsx | 10 ++++------
quartz/components/Date.tsx | 2 +-
4 files changed, 9 insertions(+), 15 deletions(-)
diff --git a/quartz/components/ContentMeta.tsx b/quartz/components/ContentMeta.tsx
index 5dfec14..e378bcc 100644
--- a/quartz/components/ContentMeta.tsx
+++ b/quartz/components/ContentMeta.tsx
@@ -1,4 +1,4 @@
-import { formatDate, getDate } from "./Date"
+import { Date, getDate } from "./Date"
import { QuartzComponentConstructor, QuartzComponentProps } from "./types"
import readingTime from "reading-time"
import { classNames } from "../util/lang"
@@ -30,7 +30,7 @@
const segments: (string | JSX.Element)[] = []
if (fileData.dates) {
- segments.push(formatDate(getDate(cfg, fileData)!, cfg.locale))
+ segments.push(<Date date={getDate(cfg, fileData)!} locale={cfg.locale} />)
}
// Display reading time if enabled
@@ -39,14 +39,12 @@
const displayedTime = i18n(cfg.locale).components.contentMeta.readingTime({
minutes: Math.ceil(minutes),
})
- segments.push(displayedTime)
+ segments.push(<span>{displayedTime}</span>)
}
- const segmentsElements = segments.map((segment) => <span>{segment}</span>)
-
return (
<p show-comma={options.showComma} class={classNames(displayClass, "content-meta")}>
- {segmentsElements}
+ {segments}
</p>
)
} else {
diff --git a/quartz/components/Date.tsx b/quartz/components/Date.tsx
index 26b5964..0a92cc4 100644
--- a/quartz/components/Date.tsx
+++ b/quartz/components/Date.tsx
@@ -27,5 +27,5 @@
}
export function Date({ date, locale }: Props) {
- return <>{formatDate(date, locale)}</>
+ return <time datetime={date.toISOString()}>{formatDate(date, locale)}</time>
}
diff --git a/quartz/components/PageList.tsx b/quartz/components/PageList.tsx
index cc0124a..c0538f5 100644
--- a/quartz/components/PageList.tsx
+++ b/quartz/components/PageList.tsx
@@ -46,13 +46,9 @@
return (
<li class="section-li">
<div class="section">
- <div>
- {page.dates && (
- <p class="meta">
- <Date date={getDate(cfg, page)!} locale={cfg.locale} />
- </p>
- )}
- </div>
+ <p class="meta">
+ {page.dates && <Date date={getDate(cfg, page)!} locale={cfg.locale} />}
+ </p>
<div class="desc">
<h3>
<a href={resolveRelative(fileData.slug!, page.slug!)} class="internal">
diff --git a/quartz/components/styles/contentMeta.scss b/quartz/components/styles/contentMeta.scss
index 4d89f65..7874f9e 100644
--- a/quartz/components/styles/contentMeta.scss
+++ b/quartz/components/styles/contentMeta.scss
@@ -3,7 +3,7 @@
color: var(--gray);
&[show-comma="true"] {
- > span:not(:last-child) {
+ > *:not(:last-child) {
margin-right: 8px;
&::after {
--
Gitblit v1.10.0