add photonovel + edit button

src/app/engine/presets.ts

@@ -387,9 +387,10 @@ export const presets: Record<string, Preset> = {
     font: "actionman",
     llmPrompt: "new movie",
     imagePrompt: (prompt: string) => [
-      `3D render`,
-      `Blender`,
-      `3D animation`,
+      `3D render animation`,
+      `Pixar`,
+      `cute`,
+      `funny`,
       `Unreal engine`,
       `${prompt}`,
     ],
@@ -572,6 +573,58 @@ export const presets: Record<string, Preset> = {
     ],
   },
   */
+  photonovel: {
+    id: "photonovel",
+    label: "Vintage photonovel",
+    family: "european",
+    color: "color",
+    font: "actionman",
+    llmPrompt: "new movie",
+    imagePrompt: (prompt: string) => [
+      `vintage`,
+      `1950`,
+      `1960`,
+      `french new wave`,
+      `faded colors`,
+      `color movie`,
+      `screencap`,
+      `${prompt}`,
+    ],
+    negativePrompt: () => [
+      "manga",
+      "anime",
+      "american comic",
+      "grayscale",
+      "monochrome",
+      "painting"
+    ],
+  },
+  stockphoto: {
+    id: "stockphoto",
+    label: "Stock photo",
+    family: "european",
+    color: "color",
+    font: "actionman",
+    llmPrompt: "new movie",
+    imagePrompt: (prompt: string) => [
+      `cinematic`,
+      `hyperrealistic`,
+      `footage`,
+      `sharp 8k`,
+      `analog`,
+      `instagram`,
+      `photoshoot`,
+      `${prompt}`,
+    ],
+    negativePrompt: () => [
+      "manga",
+      "anime",
+      "american comic",
+      "grayscale",
+      "monochrome",
+      "painting"
+    ],
+  },
 }
 
 export type PresetName = keyof typeof presets

src/app/interface/edit-modal/index.tsx

@@ -5,6 +5,7 @@ import { Button } from "@/components/ui/button"
 import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog"
 import { Input } from "@/components/ui/input"
 import { cn } from "@/lib/utils"
+import { Textarea } from "@/components/ui/textarea"
 
 
 export function EditModal({
@@ -33,9 +34,7 @@ export function EditModal({
   return (
     <Dialog open={isOpen} onOpenChange={() => isEnabled ? setOpen(true) : undefined}>
       <DialogTrigger asChild>
-        <Button variant="outline">
-          {children}
-        </Button>
+        {children}
       </DialogTrigger>
       <DialogContent className="sm:max-w-[425px]">
         <DialogHeader>
@@ -45,7 +44,7 @@ export function EditModal({
           </DialogDescription>
         </DialogHeader>
           <div className="flex flex-row flex-grow w-full">
-            <Input
+            <Textarea
               placeholder="Story"
               className="w-full bg-neutral-300 text-neutral-800 dark:bg-neutral-300 dark:text-neutral-800 rounded-r-none"
               // disabled={atLeastOnePanelIsBusy}

src/app/interface/panel/index.tsx

@@ -349,22 +349,22 @@ export function Panel({
           // there is an issue, this env check doesn't work..
         // process.env.NEXT_PUBLIC_CAN_REDRAW === "true" ?
          <div
-        className={cn(`relative -mt-14 ml-4`,)}>
+        className={cn(`relative -mt-8 ml-2 md:-mt-12md:ml-3 lg:-mt-14 lg:ml-4`,)}>
           <div className="flex flex-row space-x-2">
             <div
               onClick={rendered.status === "completed" ? handleReload : undefined}
               className={cn(
                 `bg-stone-100 rounded-lg`,
                 `flex flex-row space-x-2 items-center`,
-                `py-2 px-3 cursor-pointer`,
+                `py-1 px-2 md:py-2 md:px-3 cursor-pointer`,
                 `transition-all duration-200 ease-in-out`,
                 rendered.status === "completed" ? "opacity-95" : "opacity-50",
                 mouseOver && rendered.assetUrl ? `scale-95 hover:scale-100 hover:opacity-100`: `scale-0`
               )}>
               <RxReload
-                className="w-5 h-5"
+                className="w-3 h-3 md:w-4 md:h-4 lg:w-5 lg:h-5"
               />
-              <span className="text-sm">Redraw</span>
+              <span className="text-2xs md:text-xs lg:text-sm">Redraw</span>
             </div>
             <EditModal
               isEnabled={rendered.status === "completed"}
@@ -375,15 +375,15 @@ export function Panel({
                 className={cn(
                   `bg-stone-100 rounded-lg`,
                   `flex flex-row space-x-2 items-center`,
-                  `py-2 px-3 cursor-pointer`,
+                  `py-1 px-3 md:py-2 md:px-3 cursor-pointer`,
                   `transition-all duration-200 ease-in-out`,
                   rendered.status === "completed" ? "opacity-95" : "opacity-50",
                   mouseOver && rendered.assetUrl ? `scale-95 hover:scale-100 hover:opacity-100`: `scale-0`
                 )}>
                 <RxPencil2
-                  className="w-5 h-5"
+                  className="w-3 h-3 md:w-4 md:h-4 lg:w-5 lg:h-5"
                 />
-                <span className="text-sm">Edit</span>
+                <span className="text-2xs md:text-xs lg:text-sm">Edit</span>
               </div>
                         
             </EditModal>