Make the docs page more responsive

Frontend/src/app/(pages)/docs/[[...slug]]/page.tsx

@@ -38,13 +38,19 @@ const ContentPage = ({ params }: PageProps): ReactElement => {
     const splitSlug: string[] = content.slug?.split("/") || [];
 
     return (
-        <main className="relative pl-7 flex flex-col gap-3.5">
+        <main className="px-7 flex flex-col gap-2">
+            {/* Header */}
+            <div className="flex justify-between items-center">
+                <div className="flex flex-col gap-3">
                     {/* Breadcrumb */}
                     <Breadcrumb>
                         <BreadcrumbList className="text-minecraft-green-4">
                             {["docs", ...splitSlug].map(
                                 (part: string, index: number): ReactElement => (
-                            <div className="flex items-center" key={index}>
+                                    <div
+                                        className="flex items-center"
+                                        key={index}
+                                    >
                                         <BreadcrumbItem>
                                             <BreadcrumbLink
                                                 href={
@@ -63,17 +69,18 @@ const ContentPage = ({ params }: PageProps): ReactElement => {
                             )}
                         </BreadcrumbList>
                     </Breadcrumb>
+
                     {/* Publish Date */}
                     <p className="text-zinc-400 pointer-events-none">
                         Published on{" "}
-                {moment(content.published, "MM-DD-YYYY").format("MMMM Do YYYY")}
+                        {moment(content.published, "MM-DD-YYYY").format(
+                            "MMMM Do YYYY"
+                        )}
                     </p>
-            {/* Content */}
+                </div>
-            <CustomMDX source={content.content} />
 
                 {/* View on Git */}
                 <Link
-                className="absolute left-10 bottom-7"
                     href={`https://git.rainnny.club/Rainnny/RESTfulMC/src/branch/master/Frontend/docs/${content.slug}${content.extension}`}
                     rel="noopener noreferrer"
                     target="_blank"
@@ -85,6 +92,10 @@ const ContentPage = ({ params }: PageProps): ReactElement => {
                         height={26}
                     />
                 </Link>
+            </div>
+
+            {/* Content */}
+            <CustomMDX source={content.content} />
         </main>
     );
 };