chore: refactor folder structure

Author: toothlessdev

@types/config.d.ts

@@ -0,0 +1 @@
+declare interface BlogConfiguration {}

src/@types/post.d.ts @types/post.d.tssrc/@types/post.d.ts renamed to @types/post.d.ts

@@ -6,6 +6,12 @@ category: React
 pinned: true
 ---
 
+여기에서 우리는
+
+![테스트 이미지](./c.JPG)
+
+인라인 이미지를 추가할 수 있습니다.
+
 > 이 포스트는 모던 자바스크립트 Deep Dive 를 공부하면서 정리한 글입니다
 
 ## 📖 변수와 상수

content/posts/test.mdx

@@ -31,10 +31,8 @@ export const PostCard = ({ slug, title, category, content, date }: PostCardProps
                 <CardFooter className="mb-[6px] flex px-0 py-2 text-[#9198a1]">
                     <div
                         className={`mr-1 aspect-square h-[12px] w-[12px] rounded-full`}
-                        style={{
-                            backgroundColor: categoryColor[category],
-                        }}
-                    ></div>
+                        style={{ backgroundColor: categoryColor[category] }}
+                    />
                     <p className="text-sm">{category}</p>
                 </CardFooter>
             </Card>

src/components/displays/PostCard/PostCard.tsx

@@ -18,14 +18,16 @@ export const PostListItem = ({ slug, title, category, content, date }: PostCardP
             <div className="border-b-[1px] border-[#3d444d] py-4">
                 <h1 className="pb-2 text-xl font-bold text-white hover:underline">{title}</h1>
                 <p className="line-clamp-2 text-sm text-[#9198a1]">{toPlainText(content)}</p>
-                <div className="flex items-center py-2">
-                    <div
-                        className={`mr-1 aspect-square h-[12px] w-[12px] rounded-full`}
-                        style={{
-                            backgroundColor: categoryColor[category],
-                        }}
-                    ></div>
-                    <p className="text-sm text-[#9198a1]">{category}</p>
+                <div className="flex items-center justify-between">
+                    <div className="flex items-center py-2">
+                        <div
+                            className={`mr-1 aspect-square h-[12px] w-[12px] rounded-full`}
+                            style={{ backgroundColor: categoryColor[category] }}
+                        />
+                        <p className="text-sm text-[#9198a1]">{category}</p>
+                    </div>
+
+                    <p className="flex text-sm text-[#9198a1]">{date}</p>
                 </div>
             </div>
         </Link>

src/components/displays/PostList/PostListItem.tsx

@@ -0,0 +1,15 @@
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import React from "react";
+
+export const Filter = () => {
+    return (
+        <Select>
+            <SelectTrigger className="w-[120px] rounded-[6px]">
+                <SelectValue placeholder="Sort By" className="rounded-[6px]" />
+            </SelectTrigger>
+            <SelectContent className="hover:bg- rounded-[6px] bg-[#0f1117]">
+                <SelectItem value="date">Date</SelectItem>
+            </SelectContent>
+        </Select>
+    );
+};

src/components/forms/Filter/Filter.tsx

@@ -55,7 +55,7 @@ export const CategoryMenu = () => {
 
     return (
         <aside className="w-[30%] p-2 text-white">
-            <h2 className="font-bold">Categories</h2>
+            <h2 className="flex h-[36px] items-center font-bold">Categories</h2>
             <nav className="py-2">
                 {categories.map((category) => {
                     return <CategoryMenuItem category={category.category} contents={category.content} />;

src/components/forms/Filter/index.tsx

@@ -0,0 +1,33 @@
+import {
+    Pagination,
+    PaginationContent,
+    PaginationEllipsis,
+    PaginationItem,
+    PaginationLink,
+    PaginationNext,
+    PaginationPrevious,
+} from "@/components/ui/pagination";
+import React from "react";
+
+export const PageNavigation = () => {
+    return (
+        <Pagination className="my-8 rounded-[6px]">
+            <PaginationContent>
+                <PaginationItem>
+                    <PaginationPrevious className="rounded-[10px]" href="#" />
+                </PaginationItem>
+                <PaginationItem>
+                    <PaginationLink className="rounded-[10px]" href="#">
+                        1
+                    </PaginationLink>
+                </PaginationItem>
+                <PaginationItem>
+                    <PaginationEllipsis />
+                </PaginationItem>
+                <PaginationItem>
+                    <PaginationNext className="rounded-[10px]" href="#" />
+                </PaginationItem>
+            </PaginationContent>
+        </Pagination>
+    );
+};

src/components/navigations/CategoryMenu/CategoryMenu.tsx

@@ -0,0 +1 @@
+export { PageNavigation } from "./PageNavigation";