more mobile fixes

src/app.css

@@ -536,7 +536,7 @@ a.hover-underline-animation:hover::after {
   position: relative;
   min-height: 300px;
   width: 100%;
-  min-width: 350px;
+  min-width: min(350px, 100%);
   max-width: 100% !important;
   background-color: black;
 }
@@ -732,8 +732,10 @@ a.hover-underline-animation:hover::after {
   border-collapse: collapse;
   table-layout: fixed;
   width: 100%;
+  max-width: 100%;
   margin: 1rem 0;
-  overflow: hidden;
+  overflow: auto;
+  display: block;
 }
 
 .tiptap-table td,
@@ -765,8 +767,10 @@ a.hover-underline-animation:hover::after {
   border-collapse: collapse;
   table-layout: fixed;
   width: 100%;
+  max-width: 100%;
   margin: 1rem 0;
-  overflow: hidden;
+  overflow: auto;
+  display: block;
 }
 
 .ProseMirror table td,

src/components/blog/PostForm.tsx

@@ -255,12 +255,12 @@ export default function PostForm(props: PostFormProps) {
   };
 
   return (
-    <div class="bg-base text-text min-h-screen py-32">
+    <div class="bg-base text-text min-h-screen overflow-x-hidden py-32">
       <div class="text-center text-2xl tracking-wide">
         {props.mode === "edit" ? "Edit a Blog" : "Create a Blog"}
       </div>
       <div class="flex h-full w-full justify-center">
-        <form onSubmit={handleSubmit} class="px-4">
+        <form onSubmit={handleSubmit} class="w-full max-w-full px-4">
           <div class="mx-auto w-full md:w-3/4 xl:w-1/2">
             {/* Title */}
             <div class="input-group mx-4">
@@ -331,7 +331,7 @@ export default function PostForm(props: PostFormProps) {
           </div>
 
           {/* Text Editor */}
-          <div class="">
+          <div class="w-full max-w-full overflow-hidden">
             <TextEditor updateContent={setBody} preSet={initialBody()} />
           </div>
 

src/components/blog/TextEditor.tsx

@@ -648,7 +648,7 @@ export default function TextEditor(props: TextEditorProps) {
   };
 
   return (
-    <div class="border-surface2 text-text w-full rounded-md border px-4 py-2">
+    <div class="border-surface2 text-text w-full max-w-full overflow-hidden rounded-md border px-4 py-2">
       <Show when={editor()}>
         {(instance) => (
           <>
@@ -1264,7 +1264,7 @@ export default function TextEditor(props: TextEditorProps) {
 
       <div
         ref={editorRef}
-        class="prose prose-sm prose-invert sm:prose-base md:prose-xl lg:prose-xl xl:prose-2xl mx-auto h-[80dvh] min-w-full overflow-scroll focus:outline-none"
+        class="prose prose-sm prose-invert sm:prose-base md:prose-xl lg:prose-xl xl:prose-2xl mx-auto h-[80dvh] max-w-full overflow-scroll focus:outline-none"
       />
     </div>
   );