on this step , make the whole box clickable ... not just the checkbox

This commit is contained in:
Leon Serfaty G
2025-07-18 04:43:55 +00:00
parent 020169eb79
commit 2d2d283588
@@ -83,9 +83,9 @@ export function Step9AdditionalFeatures({ onNext, onBack, onUpdateData, formData
<h2 className="font-headline text-3xl font-bold tracking-tight text-center">Would you like us to develop any additional features?</h2>
<div className="mt-8 grid w-full grid-cols-1 gap-4 md:grid-cols-2">
{features.map((feature) => (
<div
<Label
key={feature.id}
onClick={() => handleSelect(feature.id)}
htmlFor={feature.id}
className={`flex items-center space-x-3 rounded-lg border p-4 cursor-pointer transition-all ${selectedFeatures.includes(feature.id) ? 'border-primary bg-primary/5' : 'border-border'}`}
>
<Checkbox
@@ -93,11 +93,11 @@ export function Step9AdditionalFeatures({ onNext, onBack, onUpdateData, formData
checked={selectedFeatures.includes(feature.id)}
onCheckedChange={() => handleSelect(feature.id)}
/>
<Label htmlFor={feature.id} className="text-base font-medium flex-1 cursor-pointer">{feature.label}</Label>
<span className="text-base font-medium flex-1">{feature.label}</span>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<button type="button" className="text-muted-foreground hover:text-foreground">
<button type="button" className="text-muted-foreground hover:text-foreground" onClick={(e) => e.preventDefault()}>
<Info className="h-4 w-4" />
</button>
</TooltipTrigger>
@@ -106,7 +106,7 @@ export function Step9AdditionalFeatures({ onNext, onBack, onUpdateData, formData
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
</Label>
))}
</div>
<div className="mt-16 flex w-full items-center justify-between">