Marco/infoalloggi-monorepo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 6 Wiki Activity Actions

feat: replace Accordion with Collapsible for pricing component; improve UI interaction

Browse source
This commit is contained in:
Marco Pedone 2026-01-12 17:08:27 +01:00
parent ff3af6541c
commit dec6aff651
2 changed files with 36 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/infoalloggi/src/components/prezzi.tsx
View file

@ -138,7 +138,7 @@ export const PricingComponent = ({
};
return (
<Card className={cn("w-full max-w-xl gap-4 py-4", className)}>
<Card className={cn("w-full max-w-xl gap-4 rounded-md py-4", className)}>
<CardHeader className="py-2">
<CardTitle className="pt-1 text-center font-semibold text-3xl">
{title}

58
apps/infoalloggi/src/pages/annuncio/[cod].tsx
View file

@ -38,6 +38,11 @@ import {
} from "~/components/ui/accordion";
import { Button } from "~/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger,
} from "~/components/ui/collapsible";
import {
Dialog,
DialogContent,
@ -329,31 +334,38 @@ const Pricing = ({
);
}
return (
<Accordion className="w-full" collapsible type="single">
<AccordionItem value="item-1">
<AccordionTrigger className="items-center">
<div className="items-cernter flex justify-start gap-2 px-1 font-semibold text-xl">
<BadgeEuro />
<Collapsible className="w-full">
<CollapsibleTrigger asChild>
<Button
className={cn(
"w-full text-white",
tipologia === TipologiaPosizioneEnum.Transitorio
? "bg-transitorio"
: "bg-stabile",
)}
>
<div className="flex items-center gap-2">
<BadgeEuro className="size-5" />
<span>{t.pricing_cmp.cta_costo}</span>
</div>
</AccordionTrigger>
<AccordionContent className="flex justify-center">
<PricingComponent
className={cn(style)}
cta={cta}
opzioni={opzioni}
pricingData={pricing}
statico={true}
tipo={tipologia}
title={
tipologia === TipologiaPosizioneEnum.Transitorio
? t.prezzi.titolo_transitori
: t.prezzi.titolo_stabile
}
/>
</AccordionContent>
</AccordionItem>
</Accordion>
</Button>
</CollapsibleTrigger>
<CollapsibleContent className="mt-2">
<PricingComponent
className={cn(style)}
cta={cta}
opzioni={opzioni}
pricingData={pricing}
statico={true}
tipo={tipologia}
title={
tipologia === TipologiaPosizioneEnum.Transitorio
? t.prezzi.titolo_transitori
: t.prezzi.titolo_stabile
}
/>
</CollapsibleContent>
</Collapsible>
);
};