make fit for mobile

bnsx · Jun 9, 2024 · 73c5239 · 73c5239
1 parent 3dd4095
commit 73c5239
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 4 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -18,7 +18,7 @@ export default function RootLayout({
     <html lang="en">
       <body className={cn(font.className, "bg-primary")}>
         <Toaster richColors={true} position="top-center" />
-        <div className="min-h-screen">{children}</div>
+        <div className="min-h-screen px-3 py-20 xl:py-0">{children}</div>
         <Footer />
       </body>
     </html>

diff --git a/app/main-form.tsx b/app/main-form.tsx
@@ -113,7 +113,7 @@ export default function MainForm() {
     setSubmit(false);
   };
   return (
-    <div className="translate-y-32 xl:px-0 px-2 grid xl:justify-center gap-1">
+    <div className="xl:translate-y-32 grid xl:justify-center gap-1">
       <Form {...form}>
         <form onSubmit={form.handleSubmit(onSubmit)} onReset={onReset}>
           <Card className="xl:w-96">
@@ -162,7 +162,7 @@ export default function MainForm() {
           </Card>
         </form>
       </Form>
-      <UploadedList files={files} removeFile={removeFile} />
+      <UploadedList files={files} removeFile={removeFile} isSubmit={isSubmit} />
     </div>
   );
 }
diff --git a/components/UploadedList.tsx b/components/UploadedList.tsx
@@ -15,9 +15,10 @@ import { downloadAll } from "@/lib/download";
 interface Props {
   files: FileState[];
   removeFile: (blobURL: string) => void;
+  isSubmit: boolean;
 }
 
-export default function UploadedList({ files, removeFile }: Props) {
+export default function UploadedList({ files, removeFile, isSubmit }: Props) {
   return (
     <>
       <ScrollArea
@@ -75,6 +76,7 @@ export default function UploadedList({ files, removeFile }: Props) {
                   size={"icon"}
                   variant={"outline"}
                   onClick={() => removeFile(obj.blobURL)}
+                  disabled={isSubmit}
                 >
                   <Cross2Icon />
                 </Button>
@@ -88,6 +90,7 @@ export default function UploadedList({ files, removeFile }: Props) {
         <Button
           type="button"
           variant={"outline"}
+          className="w-full"
           onClick={() => downloadAll(files)}
         >
           ดาวน์โหลดทั้งหมด