make docs bigger click target

components/TreeItem.tsx

@@ -12,9 +12,8 @@ const TreeNode: FC<{ node: ITreeItem; path: string }> = ({
         <>
           {children.length > 0 ? (
             <span
-              className={`text-left ${
-                current ? "font-semibold" : ""
-              } text-ctp-text`}
+              className={`text-left ${current ? "font-semibold" : ""
+                } text-ctp-text`}
             >
               {pretty ? pretty : value}
             </span>
@@ -22,11 +21,10 @@ const TreeNode: FC<{ node: ITreeItem; path: string }> = ({
             <span className="flex items-center gap-2">
               <Link href={path}>
                 <a
-                  className={`${
-                    current
+                  className={`${current
                       ? "border-ctp-mauve font-semibold text-ctp-mauve"
                       : "border-transparent font-normal text-ctp-subtext0 hover:border-ctp-surface2 hover:text-ctp-subtext1"
-                  } first-letter -ml-px border-l pl-4 no-underline transition-colors hover:no-underline`}
+                    } first-letter -ml-px w-full border-l pl-4 no-underline transition-colors hover:no-underline`}
                 >
                   {pretty ? pretty : value}
                 </a>
@@ -38,9 +36,8 @@ const TreeNode: FC<{ node: ITreeItem; path: string }> = ({
 
       {children.length > 0 && (
         <div
-          className={`flex flex-col gap-1 ${
-            value !== "root" ? "border-l border-ctp-surface0" : ""
-          }`}
+          className={`flex flex-col gap-1 ${value !== "root" ? "border-l border-ctp-surface0" : ""
+            }`}
         >
           {children.map((child) => (
             <TreeNode