add comments to the html and use text-xs on the main page

src/app/(pages)/[id]/page.tsx

@@ -34,6 +34,7 @@ export default async function Paste({
 
   return (
     <div className="relative h-full">
+      {/* Action Menu */}
       <ActionMenu>
         <Link href={"/"}>
           <Button>New</Button>
@@ -43,12 +44,14 @@ export default async function Paste({
         </Link>
       </ActionMenu>
 
+      {/* Paste Details */}
       <div className="absolute right-0 bottom-0 text-right p-1.5">
         <p>{data.language}</p>
         <p>{created}</p>
       </div>
 
-      <div className="p-1 hljs !bg-transparent text-sm">
+      {/* Paste Content */}
+      <div className="p-1 !bg-transparent text-sm">
         <CodeBlock code={data.content} language={data.language} />
       </div>
     </div>

src/app/(pages)/page.tsx

@@ -54,8 +54,11 @@ export default function Home(): ReactElement {
 
   return (
     <div className="p-3 h-screen w-screen relative">
-      <div className="flex gap-2 h-full w-full text-sm">
+      <div className="flex gap-2 h-full w-full text-xs">
+        {/* > */}
         <p className="hidden md:block">&gt;</p>
+
+        {/* Input */}
         <textarea
           onInput={(event) => {
             setValue((event.target as HTMLTextAreaElement).value);
@@ -64,6 +67,7 @@ export default function Home(): ReactElement {
         />
       </div>
 
+      {/* Action Menu */}
       <ActionMenu>
         <Button onClick={() => createPaste()} className="flex gap-1">
           {creating && (

src/app/(pages)/raw/[id]/page.tsx

@@ -28,6 +28,7 @@ export default async function Paste({
 
   return (
     <div className="relative h-full">
+      {/* Action Menu */}
       <ActionMenu>
         <Link href={"/"}>
           <Button>New</Button>
@@ -37,6 +38,7 @@ export default async function Paste({
         </Link>
       </ActionMenu>
 
+      {/* Paste Content */}
       <div className="p-1 hljs !bg-transparent text-sm">
         <code>{data.content}</code>
       </div>