feat: clean up date styling on post lists

esfalsa · May 19, 2024 · 931b2c9 · 931b2c9
1 parent 30690c2
commit 931b2c9
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/components/PostList.astro b/src/components/PostList.astro
@@ -23,7 +23,12 @@ const { posts } = Astro.props;
 				<DateTime
 					date={post.data.pubDate}
 					display={{ month: "long", day: "numeric" }}
-					class="shrink-0 text-sm tabular-nums text-gray-300"
+					class="hidden shrink-0 text-sm tabular-nums text-gray-300 sm:block"
+				/>
+				<DateTime
+					date={post.data.pubDate}
+					display={{ month: "short", day: "numeric" }}
+					class="shrink-0 text-sm tabular-nums text-gray-300 sm:hidden"
 				/>
 			</div>
 		))

diff --git a/src/pages/posts/[year].astro b/src/pages/posts/[year].astro
@@ -42,7 +42,7 @@ const { posts } = Astro.props;
 					>
 						<div class="h-full w-full bg-gray-800 p-px transition duration-200 hover:bg-opacity-0">
 							<div class="relative h-full w-full rounded-[calc(0.5rem-0.8px)] bg-gray-950 p-4">
-								<div class="mb-2 flex flex-row items-center justify-between">
+								<div class="mb-2 flex flex-col justify-between sm:flex-row sm:items-center">
 									<h2 class="mr-4 text-lg font-bold text-brand-400">
 										{post.data.title}
 									</h2>