feat: use time el for date strings
for better machine recognition
This commit is contained in:
parent
156be1cfd4
commit
a5142fb00b
@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import type { BlogParsedContent } from "@/shared/types";
|
||||
import { calcReadingTime, getPrettyDate } from "@/shared/metadata";
|
||||
import { calcReadingTime } from "@/shared/metadata";
|
||||
|
||||
const docs = await queryContent<BlogParsedContent>("/blog")
|
||||
.sort({ date: 1 })
|
||||
@ -8,7 +8,6 @@ const docs = await queryContent<BlogParsedContent>("/blog")
|
||||
.find();
|
||||
|
||||
const latest = docs.at(-1) as BlogParsedContent;
|
||||
const prettyDate = getPrettyDate(latest);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -21,7 +20,7 @@ const prettyDate = getPrettyDate(latest);
|
||||
>
|
||||
<h2 class="m-0 mt-4 mb-1">{{ latest.title }}</h2>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400 m-0">
|
||||
{{ prettyDate }} · {{ calcReadingTime(latest).minutes }} min read
|
||||
<Date :doc="latest" /> · {{ calcReadingTime(latest).minutes }} min read
|
||||
</p>
|
||||
<div class="tag-list mt-1">
|
||||
<Tag
|
||||
|
13
components/Date.vue
Normal file
13
components/Date.vue
Normal file
@ -0,0 +1,13 @@
|
||||
<script setup lang="ts">
|
||||
import { getPrettyDate, getUtcDate } from "~~/shared/metadata";
|
||||
import { BlogParsedContent, StoryParsedContent } from "~~/shared/types";
|
||||
|
||||
const props = defineProps<{ doc: StoryParsedContent | BlogParsedContent }>();
|
||||
|
||||
const prettyDate = getPrettyDate(props.doc);
|
||||
const utcDate = getUtcDate(props.doc);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<time pubdate :datetime="utcDate">{{ prettyDate }}</time> ·
|
||||
</template>
|
@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import type { StoryParsedContent, BlogParsedContent } from "@/shared/types";
|
||||
import { calcReadingTime, getPrettyDate } from "@/shared/metadata";
|
||||
import { calcReadingTime } from "@/shared/metadata";
|
||||
|
||||
const { post, type, highlighttags } = defineProps<{
|
||||
post: StoryParsedContent | BlogParsedContent;
|
||||
@ -25,7 +25,7 @@ const descText =
|
||||
{{ post.title }}
|
||||
</a>
|
||||
</h3>
|
||||
<p class="my-1 text-sm">{{ getPrettyDate(post) }} · {{ descText }}</p>
|
||||
<p class="my-1 text-sm"><Date :doc="post" /> · {{ descText }}</p>
|
||||
<div class="flex flex-wrap">
|
||||
<Tag
|
||||
:dest="`/tags/${type}/${tag}`"
|
||||
|
@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import { type StoryParsedContent } from "@/shared/types";
|
||||
import { calcReadingTime, getPrettyDate } from "@/shared/metadata";
|
||||
import { calcReadingTime } from "@/shared/metadata";
|
||||
|
||||
const docs = await queryContent<StoryParsedContent>("/stories")
|
||||
.sort({ date: 1 })
|
||||
@ -8,8 +8,6 @@ const docs = await queryContent<StoryParsedContent>("/stories")
|
||||
.find();
|
||||
|
||||
const latest = docs.at(-1) as StoryParsedContent;
|
||||
|
||||
const prettyDate = getPrettyDate(latest);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -22,7 +20,7 @@ const prettyDate = getPrettyDate(latest);
|
||||
>
|
||||
<h2 class="m-0 mt-4 mb-1">{{ latest.title }}</h2>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400 m-0">
|
||||
{{ prettyDate }} · {{ calcReadingTime(latest).words.total }} words
|
||||
<Date :doc="latest" /> · {{ calcReadingTime(latest).words.total }} words
|
||||
</p>
|
||||
<div class="tag-list mt-1">
|
||||
<Tag
|
||||
|
@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import type { BlogParsedContent, StoryParsedContent } from "@/shared/types";
|
||||
import { calcReadingTime, getPrettyDate } from "@/shared/metadata";
|
||||
import { calcReadingTime } from "@/shared/metadata";
|
||||
|
||||
type GeneralParsedContent = BlogParsedContent | StoryParsedContent;
|
||||
|
||||
@ -33,7 +33,7 @@ const captionText =
|
||||
{{ captionText }}
|
||||
</p>
|
||||
<h1 class="m-0">{{ doc.title }}</h1>
|
||||
<p class="my-2">{{ getPrettyDate(doc) }} · {{ descText }}</p>
|
||||
<p class="my-2"><Date :doc="doc" /> · {{ descText }}</p>
|
||||
<div class="flex flex-wrap">
|
||||
<Tag
|
||||
v-for="(tag, index) in doc.tags"
|
||||
|
@ -37,3 +37,8 @@ export function getPrettyDate(doc: BlogParsedContent | StoryParsedContent) {
|
||||
const date = dayjs(doc.date).utc();
|
||||
return date.format("DD MMM YYYY");
|
||||
}
|
||||
|
||||
export function getUtcDate(doc: BlogParsedContent | StoryParsedContent) {
|
||||
const date = dayjs(doc.date).utc();
|
||||
return date.format("YYYY-MM-DD");
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user