Remove custom component styles and use shadcn components instead, then format the code.

pages/posts/[[...slug]].tsx

@@ -1,4 +1,5 @@
 import { ContentContainer, Page } from "@/components/layouts/layouts";
+import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Footer } from "@/components/utils/Footer";
 import { NavBar } from "@/components/utils/NavBar";
@@ -59,9 +60,11 @@ export default function PostsPage(props: PostsPageProps) {
         <PostList data={props.postList} />
         <div className="my-5 flex justify-between text-base font-bold">
           {props.pageNumber !== 1 && (
-            <Link href={`/posts/${props.pageNumber - 1}`} className="link-button my-auto">
-              {"< PREV"}
-            </Link>
+            <Button asChild>
+              <Link href={`/posts/${props.pageNumber - 1}/`} className="font-bold">
+                {"< PREV"}
+              </Link>
+            </Button>
           )}
           <div className="my-auto font-bold flex justify-center">
             <Input
@@ -73,9 +76,11 @@ export default function PostsPage(props: PostsPageProps) {
             <div className="my-auto">{`  /  ${props.pageAmount}`}</div>
           </div>
           {props.pageNumber !== props.pageAmount && (
-            <Link href={`/posts/${props.pageNumber + 1}`} className="link-button my-auto">
-              {"NEXT >"}
-            </Link>
+            <Button asChild>
+              <Link href={`/posts/${props.pageNumber + 1}/`} className="font-bold">
+                {"NEXT >"}
+              </Link>
+            </Button>
           )}
         </div>
       </ContentContainer>