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

feat: add className prop to AnnuncioDisplay and update ServizioContent for improved styling

Browse source
This commit is contained in:
Marco Pedone 2026-01-09 14:47:28 +01:00
parent 76bcf640ca
commit d56d8f8ec8
3 changed files with 13 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
apps/infoalloggi/src/components/servizio/annuncio_card.tsx
View file

@ -39,9 +39,11 @@ export const AnnuncioCard = ({
export const AnnuncioDisplay = ({ export const AnnuncioDisplay = ({
data, data,
confirming, confirming,
className,
}: { }: {
data: AnnuncioRicerca; data: AnnuncioRicerca;
confirming?: boolean; confirming?: boolean;
className?: string;
}) => { }) => {
const { t } = useTranslation(); const { t } = useTranslation();
@ -50,6 +52,7 @@ export const AnnuncioDisplay = ({
className={cn( className={cn(
"grid @md:grid-cols-[12rem_1fr] grid-cols-[7rem_1fr] gap-x-4 gap-y-2 rounded-md md:max-w-3xl md:border md:border-white md:bg-[#e6e9ec]/50 lg:gap-x-4 xl:gap-x-6 dark:md:border-primary dark:md:bg-card", "grid @md:grid-cols-[12rem_1fr] grid-cols-[7rem_1fr] gap-x-4 gap-y-2 rounded-md md:max-w-3xl md:border md:border-white md:bg-[#e6e9ec]/50 lg:gap-x-4 xl:gap-x-6 dark:md:border-primary dark:md:bg-card",
confirming && "xl:w-1/2", confirming && "xl:w-1/2",
className,
)} )}
> >
<div className="row-span-1 md:row-span-3"> <div className="row-span-1 md:row-span-3">

5
apps/infoalloggi/src/components/servizio/main.tsx
View file

@ -168,10 +168,11 @@ export const ServizioContent = () => {
Sono già stati selezionati {servizio.annunci.length} annunci Sono già stati selezionati {servizio.annunci.length} annunci
che potrebbero interessarti. che potrebbero interessarti.
</p> </p>
<div className="grid grid-cols-2 gap-4"> <div className="grid gap-4 sm:grid-cols-2">
{servizio.annunci.map((data) => ( {servizio.annunci.map((data) => (
<div className="" key={data.id}> <div className="" key={data.id}>
<AnnuncioDisplay <AnnuncioDisplay
className="bg-[#e6e9ec]/50"
data={{ data={{
...data, ...data,
modificato_il: data.modificato_il modificato_il: data.modificato_il
@ -185,7 +186,7 @@ export const ServizioContent = () => {
</div> </div>
))} ))}
{servizio.annunci.length % 2 === 1 && ( {servizio.annunci.length % 2 === 1 && (
<div className="size-full rounded-md border border-[var(--pattern-fg)] bg-[repeating-linear-gradient(45deg,_var(--pattern-fg)_0,_var(--pattern-fg)_1px,_transparent_0,_transparent_50%)] bg-[size:10px_10px] bg-fixed opacity-10 [--pattern-fg:#696969] dark:[--pattern-fg:#e1e1e1]" /> <div className="hidden size-full rounded-md border border-[var(--pattern-fg)] bg-[repeating-linear-gradient(45deg,_var(--pattern-fg)_0,_var(--pattern-fg)_1px,_transparent_0,_transparent_50%)] bg-[size:10px_10px] bg-fixed opacity-10 [--pattern-fg:#696969] sm:block dark:[--pattern-fg:#e1e1e1]" />
)} )}
</div> </div>
</div> </div>

11
apps/infoalloggi/src/components/tables/ricerca-table.tsx
View file

@ -81,11 +81,14 @@ const Row = ({
)} )}
> >
<CollapsibleTrigger className="flex w-full cursor-pointer items-center justify-between gap-4 px-3 sm:px-4"> <CollapsibleTrigger className="flex w-full cursor-pointer items-center justify-between gap-4 px-3 sm:px-4">
<div className="flex items-center gap-2 font-semibold text-primary sm:text-lg"> <div className="flex items-center gap-2 font-semibold">
<Building className="size-6 fill-background" /> <Building className="size-6 fill-background" />
Affitto {servizio.tipologia}
<span className="text-muted-foreground text-sm"> <span className="text-primary sm:text-lg">
{`- del ${servizio.created_at.toLocaleDateString("it")}`} Affitto {servizio.tipologia}
</span>
<span className="text-muted-foreground text-xs sm:text-sm">
{`${servizio.created_at.toLocaleDateString("it")}`}
</span> </span>
</div> </div>
<div className="float-end flex items-center justify-start pl-2 text-primary"> <div className="float-end flex items-center justify-start pl-2 text-primary">