style: apply responsive styles

yuhwan-park · yuhwan-park · commit 9cd7e56607e5 · 2024-10-27T16:55:09.000+09:00
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -42,7 +42,7 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="ko" className={`${nanum.variable} ${pretendard.variable}`}>
-      <body>{children}</body>
+      <body className="px-4 transition-all md:px-0">{children}</body>
     </html>
   );
 }
diff --git a/components/PostList.tsx b/components/PostList.tsx
@@ -30,11 +30,13 @@ export default function PostList({ posts }: { posts: ReducedPost[] }) {
                 {postsByYear[year].map((post) => (
                   <li key={post.slug} className="group/item text-gray-800">
                     <a
-                      className="flex w-full items-center justify-between transition-opacity hover:!opacity-100 group-hover:opacity-40"
+                      className="flex w-full items-center justify-between gap-5 transition-opacity hover:!opacity-100 group-hover:opacity-40"
                       href={post.slug}
                     >
                       <div className="group-hover/item:selection p-0.5">{post.title}</div>
-                      <div className="group-hover/item:selection p-0.5 text-sm">{post.date}</div>
+                      <div className="group-hover/item:selection text-nowrap p-0.5 text-sm">
+                        {post.date}
+                      </div>
                     </a>
                   </li>
                 ))}

Original file line number	Diff line number	Diff line change
`@@ -42,7 +42,7 @@ export default function RootLayout({`
`42`	`42`	`}>) {`
`43`	`43`	`return (`
`44`	`44`	<html lang="ko" className={`${nanum.variable} ${pretendard.variable}`}>
`45`		`- <body>{children}</body>`
	`45`	`+ <body className="px-4 transition-all md:px-0">{children}</body>`
`46`	`46`	`</html>`
`47`	`47`	`);`
`48`	`48`	`}`