great! but make the modal less tall and more wide so it fits better with
This commit is contained in:
@@ -218,34 +218,35 @@ export function Step11Results({ onReset, customHours, readyMadeHours, formData }
|
||||
Send Estimate to Email
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
<DialogContent className="sm:max-w-md">
|
||||
<DialogContent className="sm:max-w-2xl">
|
||||
<DialogHeader>
|
||||
<DialogTitle className="font-headline text-2xl">Get Your Detailed Estimate</DialogTitle>
|
||||
<DialogDescription>
|
||||
Fill out the form below and we'll email you a PDF copy of your estimate.
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 py-2">
|
||||
<div className="space-y-4">
|
||||
<h3 className="text-lg font-medium text-foreground">Estimate Summary</h3>
|
||||
<Card className="bg-muted/50 border-dashed">
|
||||
<CardContent className="p-4 space-y-4 text-sm">
|
||||
<div className="flex justify-between items-center">
|
||||
<span className="text-muted-foreground flex items-center gap-2"><Clock className="h-4 w-4" /> Custom Development</span>
|
||||
<span className="font-bold">{customHours}+ hours</span>
|
||||
</div>
|
||||
<Separator />
|
||||
<div className="flex justify-between items-center">
|
||||
<span className="text-muted-foreground flex items-center gap-2"><Clock className="h-4 w-4" /> Ready-Made Tools</span>
|
||||
<span className="font-bold">{readyMadeHours}+ hours</span>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Note: This is a preliminary estimate. We will contact you for a more detailed quote.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4 py-2">
|
||||
<Card className="bg-muted/50 border-dashed">
|
||||
<CardHeader className="flex-row items-center gap-4 space-y-0 p-4">
|
||||
<Briefcase className="h-8 w-8 text-primary" />
|
||||
<CardTitle className="text-lg font-medium">Estimate Summary</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="p-4 pt-0 space-y-2 text-sm">
|
||||
<div className="flex justify-between items-center">
|
||||
<span className="text-muted-foreground flex items-center gap-2"><Clock className="h-4 w-4" /> Custom Development</span>
|
||||
<span className="font-bold">{customHours}+ hours</span>
|
||||
</div>
|
||||
<div className="flex justify-between items-center">
|
||||
<span className="text-muted-foreground flex items-center gap-2"><Clock className="h-4 w-4" /> Ready-Made Tools</span>
|
||||
<span className="font-bold">{readyMadeHours}+ hours</span>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Separator />
|
||||
|
||||
<div className="flex flex-col justify-between">
|
||||
<form id="send-estimate-form" onSubmit={handleSubmit} className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="name">Full Name</Label>
|
||||
@@ -269,12 +270,13 @@ export function Step11Results({ onReset, customHours, readyMadeHours, formData }
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<DialogFooter className="mt-4">
|
||||
<Button type="submit" form="send-estimate-form" className="w-full" size="lg" disabled={isPending}>
|
||||
{isPending ? "Sending..." : "Send to Email"}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</div>
|
||||
</div>
|
||||
<DialogFooter>
|
||||
<Button type="submit" form="send-estimate-form" className="w-full" size="lg" disabled={isPending}>
|
||||
{isPending ? "Sending..." : "Send to Email"}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
<Button onClick={onReset} size="lg" variant="link" className="text-muted-foreground">
|
||||
|
||||
Reference in New Issue
Block a user