further improvements

src/components/BlogList.svelte

@@ -67,10 +67,10 @@
             m-1 p-2 hover:bg-shade
           ">
             <h2 class="font-bold">{post.data.title}</h2>
-            <address class="inline-block post-meta col-start-2 md:ml-3">
+            <address class="inline-block post-meta col-start-2 md:ml-3 whitespace-nowrap">
               {post.data.author}
             </address>
-            <div class="inline-block post-meta col-start-3 lg:ml-1">
+            <div class="inline-block post-meta col-start-3 lg:ml-1 whitespace-nowrap">
               <Time datetime={post.data.pubDate} />
             </div>
             <div class="col-span-3">{post.data.summary}</div>

src/utils/time.ts

@@ -4,13 +4,18 @@ function lt(one: Temporal.Duration, other: Temporal.DurationLike): boolean {
 	return Temporal.Duration.compare(one, other) < 0
 }
 
-export function printTime(time: Temporal.ZonedDateTime): string {
-	const delta = time.until(Temporal.Now.zonedDateTimeISO())
+export function printTime(datetime: Temporal.ZonedDateTime): string {
+	const delta = datetime.until(Temporal.Now.zonedDateTimeISO())
 	if (lt(delta, { minutes: 1 })) return 'now'
+	if (lt(delta, { minutes: 2 })) return '1 minute ago'
 	if (lt(delta, { hours: 1 })) return `${delta.minutes} minutes ago`
+	if (lt(delta, { hours: 2 })) return `1 hour ago`
 	if (lt(delta, { days: 1 })) return `${delta.hours} hours ago`
+	if (lt(delta, { days: 2 })) return `yesterday`
 	if (lt(delta, { days: 7 })) return `${delta.round({ smallestUnit: 'days' }).days} days ago`
-	return `at ${time.toPlainDate().toString()} ${time.toPlainTime().toString({ smallestUnit: 'minutes' })}`
+	const date = datetime.toPlainDate().toString();
+	const time = datetime.toPlainTime().toString({ smallestUnit: 'minutes' });
+	return `at ${date} ${time}`
 }
 
 export function parseTime(string: string): Temporal.ZonedDateTime {

www.lbfalvy.com.code-workspace

@@ -21,7 +21,8 @@
 	},
 	"extensions": {
 		"recommendations": [
-			"bradlc.vscode-tailwindcss"
+			"bradlc.vscode-tailwindcss",
+			"svelte.svelte-vscode"
 		]
 	}
 }