more mobile fixes

This commit is contained in:
Michael Freno
2025-12-21 09:36:43 -05:00
parent 14ea299ca3
commit dba340e8bc
3 changed files with 12 additions and 8 deletions

View File

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

View File

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

View File

@@ -648,7 +648,7 @@ export default function TextEditor(props: TextEditorProps) {
}; };
return ( 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()}> <Show when={editor()}>
{(instance) => ( {(instance) => (
<> <>
@@ -1264,7 +1264,7 @@ export default function TextEditor(props: TextEditorProps) {
<div <div
ref={editorRef} 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> </div>
); );