sort classes rule and fix
This commit is contained in:
parent
ada7f0b7e0
commit
a87a35ffbe
164 changed files with 539 additions and 533 deletions
|
|
@ -88,7 +88,12 @@
|
||||||
"useParseIntRadix": "off"
|
"useParseIntRadix": "off"
|
||||||
},
|
},
|
||||||
"nursery": {
|
"nursery": {
|
||||||
"useExhaustiveSwitchCases": "on"
|
"useExhaustiveSwitchCases": "on",
|
||||||
|
"useSortedClasses": {
|
||||||
|
"level": "info",
|
||||||
|
"fix": "safe",
|
||||||
|
"options": {}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"performance": {
|
"performance": {
|
||||||
"noImgElement": "off",
|
"noImgElement": "off",
|
||||||
|
|
|
||||||
|
|
@ -26,7 +26,7 @@ const VerificaEmail = ({ token, userId, redirect }: VerificaEmailProps) => {
|
||||||
</Row>
|
</Row>
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={`${process.env.NEXT_PUBLIC_BASE_URL}/auth/verifica-email-action?t=${token}&u=${userId}${redirect ? `&r=${redirect}` : ""}`}
|
href={`${process.env.NEXT_PUBLIC_BASE_URL}/auth/verifica-email-action?t=${token}&u=${userId}${redirect ? `&r=${redirect}` : ""}`}
|
||||||
>
|
>
|
||||||
Clicca qui per verificare
|
Clicca qui per verificare
|
||||||
|
|
|
||||||
|
|
@ -40,7 +40,7 @@ const Base = ({
|
||||||
|
|
||||||
<Preview>{preview}</Preview>
|
<Preview>{preview}</Preview>
|
||||||
<Body className="py-2 text-center font-sans text-base text-neutral-700">
|
<Body className="py-2 text-center font-sans text-base text-neutral-700">
|
||||||
<Container className="max-w-xl rounded-lg border border-solid border-[#eaeaea] pt-2 pb-10">
|
<Container className="max-w-xl rounded-lg border border-[#eaeaea] border-solid pt-2 pb-10">
|
||||||
<Img
|
<Img
|
||||||
alt="Infoalloggi.it"
|
alt="Infoalloggi.it"
|
||||||
className="mx-auto my-2 scale-80"
|
className="mx-auto my-2 scale-80"
|
||||||
|
|
@ -57,7 +57,7 @@ const Base = ({
|
||||||
|
|
||||||
<Section className="mt-4">
|
<Section className="mt-4">
|
||||||
{noreply && (
|
{noreply && (
|
||||||
<Text className="text-xs text-neutral-500">
|
<Text className="text-neutral-500 text-xs">
|
||||||
Questo è un messaggio automatico, per favore non rispondere
|
Questo è un messaggio automatico, per favore non rispondere
|
||||||
a questa email.
|
a questa email.
|
||||||
</Text>
|
</Text>
|
||||||
|
|
|
||||||
|
|
@ -39,7 +39,7 @@ const ContattoAnnuncioEmail = ({
|
||||||
</Section>
|
</Section>
|
||||||
<Section className="mb-5">
|
<Section className="mb-5">
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={`${process.env.NEXT_PUBLIC_BASE_URL}/annuncio/${codice}`}
|
href={`${process.env.NEXT_PUBLIC_BASE_URL}/annuncio/${codice}`}
|
||||||
>
|
>
|
||||||
Vai all'annuncio
|
Vai all'annuncio
|
||||||
|
|
|
||||||
|
|
@ -32,7 +32,7 @@ const Generic = ({
|
||||||
{link && (
|
{link && (
|
||||||
<Section className="mb-5">
|
<Section className="mb-5">
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={`${link.href}`}
|
href={`${link.href}`}
|
||||||
>
|
>
|
||||||
{link.label}
|
{link.label}
|
||||||
|
|
|
||||||
|
|
@ -46,7 +46,7 @@ const OnboardingServizio = ({
|
||||||
</Row>
|
</Row>
|
||||||
<Section className="mb-5">
|
<Section className="mb-5">
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={`${process.env.NEXT_PUBLIC_BASE_URL}/servizio/pre-onboard/${token}`}
|
href={`${process.env.NEXT_PUBLIC_BASE_URL}/servizio/pre-onboard/${token}`}
|
||||||
>
|
>
|
||||||
Vai al servizio
|
Vai al servizio
|
||||||
|
|
@ -69,21 +69,21 @@ const OnboardingServizio = ({
|
||||||
/>
|
/>
|
||||||
</Row>
|
</Row>
|
||||||
<Row className="block w-full">
|
<Row className="block w-full">
|
||||||
<div className="mb-[5px] flex h-[24px] w-fit items-center justify-center gap-1 rounded-full bg-indigo-600 px-2 text-[12px] leading-none font-semibold text-white">
|
<div className="mb-[5px] flex h-[24px] w-fit items-center justify-center gap-1 rounded-full bg-indigo-600 px-2 font-semibold text-[12px] text-white leading-0">
|
||||||
<strong>Codice: </strong> {annuncio.codice}
|
<strong>Codice: </strong> {annuncio.codice}
|
||||||
</div>
|
</div>
|
||||||
<Heading
|
<Heading
|
||||||
as="h2"
|
as="h2"
|
||||||
className="mt-0 mb-[6px] text-[16px] leading-none font-bold"
|
className="mt-0 mb-[6px] font-bold text-[16px] leading-none"
|
||||||
>
|
>
|
||||||
{annuncio.titolo || "N/A"}
|
{annuncio.titolo || "N/A"}
|
||||||
</Heading>
|
</Heading>
|
||||||
<Text className="m-0 text-[14px] leading-[24px] text-gray-500">
|
<Text className="m-0 text-[14px] text-gray-500 leading-[24px]">
|
||||||
<strong>Prezzo:</strong> €
|
<strong>Prezzo:</strong> €
|
||||||
{(annuncio.prezzo / 1e2).toFixed(2)}
|
{(annuncio.prezzo / 1e2).toFixed(2)}
|
||||||
</Text>
|
</Text>
|
||||||
<Link
|
<Link
|
||||||
className="block text-[14px] font-semibold text-indigo-600 no-underline"
|
className="block font-semibold text-[14px] text-indigo-600 no-underline"
|
||||||
href={`${process.env.NEXT_PUBLIC_BASE_URL}/annuncio/${annuncio.codice}`}
|
href={`${process.env.NEXT_PUBLIC_BASE_URL}/annuncio/${annuncio.codice}`}
|
||||||
>
|
>
|
||||||
Scheda dell'annuncio →
|
Scheda dell'annuncio →
|
||||||
|
|
|
||||||
|
|
@ -27,7 +27,7 @@ const PagamentoConferma = ({ receiptHref }: PagamentoConfermaProps) => {
|
||||||
</Row>
|
</Row>
|
||||||
<Section className="mb-5">
|
<Section className="mb-5">
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={receiptHref}
|
href={receiptHref}
|
||||||
>
|
>
|
||||||
Vai al tuo account
|
Vai al tuo account
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ const PagamentoErrore = () => {
|
||||||
</Row>
|
</Row>
|
||||||
<Section className="mb-5">
|
<Section className="mb-5">
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={`${process.env.NEXT_PUBLIC_BASE_URL}/area-riservata/dashboard`}
|
href={`${process.env.NEXT_PUBLIC_BASE_URL}/area-riservata/dashboard`}
|
||||||
>
|
>
|
||||||
Vai al tuo account
|
Vai al tuo account
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ const PagamentoRicezione = () => {
|
||||||
</Row>
|
</Row>
|
||||||
<Section className="mb-5">
|
<Section className="mb-5">
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={`${process.env.NEXT_PUBLIC_BASE_URL}/area-riservata/dashboard`}
|
href={`${process.env.NEXT_PUBLIC_BASE_URL}/area-riservata/dashboard`}
|
||||||
>
|
>
|
||||||
Vai al tuo account
|
Vai al tuo account
|
||||||
|
|
|
||||||
|
|
@ -24,7 +24,7 @@ const PwResetLink = ({ resetlink }: PwResetLinkProps) => {
|
||||||
</Row>
|
</Row>
|
||||||
<Section className="mb-5">
|
<Section className="mb-5">
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={resetlink}
|
href={resetlink}
|
||||||
>
|
>
|
||||||
Clicca qui per il reset della password
|
Clicca qui per il reset della password
|
||||||
|
|
|
||||||
|
|
@ -20,7 +20,7 @@ const RegistrazioneAvvenuta = () => {
|
||||||
</Row>
|
</Row>
|
||||||
<Section className="mb-5">
|
<Section className="mb-5">
|
||||||
<Button
|
<Button
|
||||||
className="mx-auto box-border inline-flex h-10 items-center justify-center rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold whitespace-nowrap text-neutral-900"
|
className="mx-auto box-border inline-flex h-10 items-center justify-center whitespace-nowrap rounded-md bg-neutral-100 px-4 py-2 text-center align-middle font-semibold text-neutral-900"
|
||||||
href={`${process.env.NEXT_PUBLIC_BASE_URL}/area-riservata/dashboard`}
|
href={`${process.env.NEXT_PUBLIC_BASE_URL}/area-riservata/dashboard`}
|
||||||
>
|
>
|
||||||
Vai al tuo account
|
Vai al tuo account
|
||||||
|
|
|
||||||
|
|
@ -8,10 +8,10 @@ export default function TestAppPage() {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-8">
|
<div className="p-8">
|
||||||
<h1 className="mb-4 text-2xl font-bold">Test App Page</h1>
|
<h1 className="mb-4 font-bold text-2xl">Test App Page</h1>
|
||||||
|
|
||||||
<div className="rounded-lg border bg-gray-50 p-4">
|
<div className="rounded-lg border bg-gray-50 p-4">
|
||||||
<h2 className="mb-2 text-lg font-semibold">Data from Database:</h2>
|
<h2 className="mb-2 font-semibold text-lg">Data from Database:</h2>
|
||||||
|
|
||||||
<Suspense fallback={<LoadingPage />}>
|
<Suspense fallback={<LoadingPage />}>
|
||||||
<AnnunciList annunci={annunci} />
|
<AnnunciList annunci={annunci} />
|
||||||
|
|
|
||||||
|
|
@ -218,7 +218,7 @@ export const IconMatrixTooltip = () => {
|
||||||
<div className="grid grid-cols-4 gap-2">
|
<div className="grid grid-cols-4 gap-2">
|
||||||
{iconOptions.map((icon) => (
|
{iconOptions.map((icon) => (
|
||||||
<button
|
<button
|
||||||
className="bg-muted flex flex-col items-center rounded-xl p-2 hover:opacity-75"
|
className="flex flex-col items-center rounded-xl bg-muted p-2 hover:opacity-75"
|
||||||
key={icon}
|
key={icon}
|
||||||
onClick={async () => {
|
onClick={async () => {
|
||||||
await navigator.clipboard.writeText(icon);
|
await navigator.clipboard.writeText(icon);
|
||||||
|
|
|
||||||
|
|
@ -54,7 +54,7 @@ const InformationBubble = ({
|
||||||
<HybridTooltip>
|
<HybridTooltip>
|
||||||
<HybridTooltipTrigger
|
<HybridTooltipTrigger
|
||||||
className={cn(
|
className={cn(
|
||||||
`absolute -top-2 -right-2 flex size-6 items-center justify-center rounded-full bg-white`,
|
`-top-2 -right-2 absolute flex size-6 items-center justify-center rounded-full bg-white`,
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|
@ -65,12 +65,12 @@ const InformationBubble = ({
|
||||||
</HybridTooltipTrigger>
|
</HybridTooltipTrigger>
|
||||||
|
|
||||||
<HybridTooltipContent
|
<HybridTooltipContent
|
||||||
className="border-border -mb-1.5 bg-white shadow-sm [&>span>svg]:invisible"
|
className="-mb-1.5 border-border bg-white shadow-sm [&>span>svg]:invisible"
|
||||||
side={side}
|
side={side}
|
||||||
>
|
>
|
||||||
{href ? (
|
{href ? (
|
||||||
<Link
|
<Link
|
||||||
className="flex items-center justify-center text-sm text-blue-500 underline-offset-2 hover:underline"
|
className="flex items-center justify-center text-blue-500 text-sm underline-offset-2 hover:underline"
|
||||||
href={href}
|
href={href}
|
||||||
target={target}
|
target={target}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -33,7 +33,7 @@ export const MappaDialogFullscreen = ({
|
||||||
<MapIcon className="size-5" /> {t.mappa}
|
<MapIcon className="size-5" /> {t.mappa}
|
||||||
</Button>
|
</Button>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="h-full w-screen max-w-[100vw] p-0 sm:max-h-[60vh] sm:max-w-2xl [&_#dialog-close]:bg-white [&_#dialog-close]:opacity-100 [&_#dialog-close>svg]:size-8">
|
<DialogContent className="h-full w-screen max-w-[100vw] p-0 sm:max-h-[60vh] sm:max-w-2xl [&_#dialog-close>svg]:size-8 [&_#dialog-close]:bg-white [&_#dialog-close]:opacity-100">
|
||||||
<DialogHeader className="hidden h-0">
|
<DialogHeader className="hidden h-0">
|
||||||
<DialogTitle className="sr-only">{t.mappa}</DialogTitle>
|
<DialogTitle className="sr-only">{t.mappa}</DialogTitle>
|
||||||
<DialogDescription className="sr-only">{t.mappa}</DialogDescription>
|
<DialogDescription className="sr-only">{t.mappa}</DialogDescription>
|
||||||
|
|
|
||||||
|
|
@ -53,7 +53,7 @@ export const AcquistoProcessing = ({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mx-auto my-4 w-full max-w-3xl space-y-8 rounded-md">
|
<div className="mx-auto my-4 w-full max-w-3xl space-y-8 rounded-md">
|
||||||
<h3 className="mt-2 text-center text-2xl font-bold tracking-wide text-neutral-700 uppercase">
|
<h3 className="mt-2 text-center font-bold text-2xl text-neutral-700 uppercase tracking-wide">
|
||||||
{t.acquisto.titolo}
|
{t.acquisto.titolo}
|
||||||
</h3>
|
</h3>
|
||||||
{(() => {
|
{(() => {
|
||||||
|
|
@ -119,12 +119,12 @@ export const PricePreparation = ({
|
||||||
<div className="mx-auto mt-4 max-w-2xl p-2 sm:mt-10">
|
<div className="mx-auto mt-4 max-w-2xl p-2 sm:mt-10">
|
||||||
{isLoading || !prezziario ? (
|
{isLoading || !prezziario ? (
|
||||||
<>
|
<>
|
||||||
<h3 className="text-2xl font-semibold">{t.acquisto.preparazione}</h3>
|
<h3 className="font-semibold text-2xl">{t.acquisto.preparazione}</h3>
|
||||||
<LoadingPage />
|
<LoadingPage />
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
<div className="space-y-8">
|
<div className="space-y-8">
|
||||||
<h3 className="text-center text-2xl font-semibold">
|
<h3 className="text-center font-semibold text-2xl">
|
||||||
{t.acquisto.servizi_acquisto}
|
{t.acquisto.servizi_acquisto}
|
||||||
</h3>
|
</h3>
|
||||||
|
|
||||||
|
|
@ -133,7 +133,7 @@ export const PricePreparation = ({
|
||||||
<p className="text-lg">
|
<p className="text-lg">
|
||||||
Cod: “{prezziario.idprezziario}”
|
Cod: “{prezziario.idprezziario}”
|
||||||
</p>
|
</p>
|
||||||
<p className="text-4xl font-bold">
|
<p className="font-bold text-4xl">
|
||||||
{formatCurrency(prezziario.prezzo_cent / 100)}
|
{formatCurrency(prezziario.prezzo_cent / 100)}
|
||||||
</p>
|
</p>
|
||||||
<p>{prezziario.desc_it}</p>
|
<p>{prezziario.desc_it}</p>
|
||||||
|
|
@ -215,10 +215,10 @@ const CheckoutForm = ({
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
<p>{descrizione}</p>
|
<p>{descrizione}</p>
|
||||||
<span>
|
<span>
|
||||||
<span className="text-3xl font-bold">
|
<span className="font-bold text-3xl">
|
||||||
{formatCurrency(prezzo / 100)}
|
{formatCurrency(prezzo / 100)}
|
||||||
</span>{" "}
|
</span>{" "}
|
||||||
<span className="text-base font-normal sm:text-sm">
|
<span className="font-normal text-base sm:text-sm">
|
||||||
{t.pricing_cmp.risultati_iva}
|
{t.pricing_cmp.risultati_iva}
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
|
||||||
|
|
@ -20,7 +20,7 @@ export function ReceiptGenerator({ data }: { data: PurchaseData }) {
|
||||||
<div className="mx-auto max-w-4xl">
|
<div className="mx-auto max-w-4xl">
|
||||||
<div className="space-y-6">
|
<div className="space-y-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<h1 className="text-2xl font-bold">Ricevuta di cortesia</h1>
|
<h1 className="font-bold text-2xl">Ricevuta di cortesia</h1>
|
||||||
|
|
||||||
<Button className="print:hidden" onClick={() => reactToPrintFn()}>
|
<Button className="print:hidden" onClick={() => reactToPrintFn()}>
|
||||||
Stampa
|
Stampa
|
||||||
|
|
@ -73,8 +73,8 @@ function Receipt({ data }: ReceiptProps) {
|
||||||
<div className="space-y-6">
|
<div className="space-y-6">
|
||||||
<div className="flex items-start justify-between">
|
<div className="flex items-start justify-between">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-2xl font-bold">{companyName}</h1>
|
<h1 className="font-bold text-2xl">{companyName}</h1>
|
||||||
<p className="text-sm whitespace-pre-line">{companyAddress}</p>
|
<p className="whitespace-pre-line text-sm">{companyAddress}</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="relative size-24">
|
<div className="relative size-24">
|
||||||
|
|
@ -87,7 +87,7 @@ function Receipt({ data }: ReceiptProps) {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="border-b pb-4">
|
<div className="border-b pb-4">
|
||||||
<h2 className="text-center text-xl font-semibold">
|
<h2 className="text-center font-semibold text-xl">
|
||||||
Ricevuta di cortesia
|
Ricevuta di cortesia
|
||||||
</h2>
|
</h2>
|
||||||
<div className="mt-2 flex justify-between">
|
<div className="mt-2 flex justify-between">
|
||||||
|
|
@ -114,7 +114,7 @@ function Receipt({ data }: ReceiptProps) {
|
||||||
<div>
|
<div>
|
||||||
<h3 className="mb-1 font-semibold">Intestatario:</h3>
|
<h3 className="mb-1 font-semibold">Intestatario:</h3>
|
||||||
<p className="font-medium">{data.clienteNome}</p>
|
<p className="font-medium">{data.clienteNome}</p>
|
||||||
<p className="text-sm whitespace-pre-line">
|
<p className="whitespace-pre-line text-sm">
|
||||||
{data.clienteIndirizzo}
|
{data.clienteIndirizzo}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -175,10 +175,10 @@ function Receipt({ data }: ReceiptProps) {
|
||||||
</div>
|
</div>
|
||||||
<div className="border-t pt-4">
|
<div className="border-t pt-4">
|
||||||
<h3 className="mb-1 font-semibold">Note</h3>
|
<h3 className="mb-1 font-semibold">Note</h3>
|
||||||
<p className="text-sm whitespace-pre-line">{note}</p>
|
<p className="whitespace-pre-line text-sm">{note}</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="text-muted-foreground pt-6 text-center text-sm">
|
<div className="pt-6 text-center text-muted-foreground text-sm">
|
||||||
<p>{footer}</p>
|
<p>{footer}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -71,14 +71,14 @@ export const CTA_TipologiaModal = () => {
|
||||||
</DialogDescription>
|
</DialogDescription>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<div className="flex flex-col gap-8">
|
<div className="flex flex-col gap-8">
|
||||||
<div className="border-transitorio space-y-2 rounded-md border p-2">
|
<div className="space-y-2 rounded-md border border-transitorio p-2">
|
||||||
<h3 className="text-transitorio text-lg font-semibold">
|
<h3 className="font-semibold text-lg text-transitorio">
|
||||||
{t.tipologia_tutorial.transitorio}
|
{t.tipologia_tutorial.transitorio}
|
||||||
</h3>
|
</h3>
|
||||||
<p>{t.tipologia_tutorial.transitorio_desc}</p>
|
<p>{t.tipologia_tutorial.transitorio_desc}</p>
|
||||||
<Button
|
<Button
|
||||||
aria-label={t.tipologia_tutorial.transitorio_cta}
|
aria-label={t.tipologia_tutorial.transitorio_cta}
|
||||||
className="bg-transitorio flex w-full items-center gap-2"
|
className="flex w-full items-center gap-2 bg-transitorio"
|
||||||
onClick={async () => await update("Transitorio")}
|
onClick={async () => await update("Transitorio")}
|
||||||
>
|
>
|
||||||
{t.tipologia_tutorial.transitorio_cta}
|
{t.tipologia_tutorial.transitorio_cta}
|
||||||
|
|
@ -86,14 +86,14 @@ export const CTA_TipologiaModal = () => {
|
||||||
<ArrowRight className="size-4" />
|
<ArrowRight className="size-4" />
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
<div className="border-stabile space-y-2 rounded-md border p-2">
|
<div className="space-y-2 rounded-md border border-stabile p-2">
|
||||||
<h3 className="text-stabile text-lg font-semibold">
|
<h3 className="font-semibold text-lg text-stabile">
|
||||||
{t.tipologia_tutorial.stabile}
|
{t.tipologia_tutorial.stabile}
|
||||||
</h3>
|
</h3>
|
||||||
<p>{t.tipologia_tutorial.stabile_desc}</p>
|
<p>{t.tipologia_tutorial.stabile_desc}</p>
|
||||||
<Button
|
<Button
|
||||||
aria-label={t.tipologia_tutorial.stabile_cta}
|
aria-label={t.tipologia_tutorial.stabile_cta}
|
||||||
className="bg-stabile flex w-full items-center gap-2"
|
className="flex w-full items-center gap-2 bg-stabile"
|
||||||
onClick={async () => await update("Stabile")}
|
onClick={async () => await update("Stabile")}
|
||||||
>
|
>
|
||||||
{t.tipologia_tutorial.stabile_cta}
|
{t.tipologia_tutorial.stabile_cta}
|
||||||
|
|
|
||||||
|
|
@ -24,7 +24,7 @@ export const AnnuncioInteractions = ({
|
||||||
|
|
||||||
if (disabled) {
|
if (disabled) {
|
||||||
return (
|
return (
|
||||||
<div className="w-full rounded-md bg-red-500 p-2 text-center text-base font-semibold text-white">
|
<div className="w-full rounded-md bg-red-500 p-2 text-center font-semibold text-base text-white">
|
||||||
Richieste Temporaneamente disattivate
|
Richieste Temporaneamente disattivate
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
@ -140,7 +140,7 @@ export const InteressatoButton = ({
|
||||||
}
|
}
|
||||||
if (hasInterest) {
|
if (hasInterest) {
|
||||||
return (
|
return (
|
||||||
<span className="flex w-full items-center justify-center gap-2 rounded-md bg-green-500 p-2 text-sm font-semibold text-white">
|
<span className="flex w-full items-center justify-center gap-2 rounded-md bg-green-500 p-2 font-semibold text-sm text-white">
|
||||||
<BadgePlus className="inline size-5" />
|
<BadgePlus className="inline size-5" />
|
||||||
Hai già mandato una richiesta
|
Hai già mandato una richiesta
|
||||||
</span>
|
</span>
|
||||||
|
|
@ -182,7 +182,7 @@ export const InteressatoButtonBatchV = ({
|
||||||
|
|
||||||
if (hasInterest) {
|
if (hasInterest) {
|
||||||
return (
|
return (
|
||||||
<span className="flex w-full items-center justify-center gap-2 rounded-md bg-green-500 p-2 text-sm font-semibold text-white">
|
<span className="flex w-full items-center justify-center gap-2 rounded-md bg-green-500 p-2 font-semibold text-sm text-white">
|
||||||
<BadgePlus className="inline size-5" />
|
<BadgePlus className="inline size-5" />
|
||||||
Hai già mandato una richiesta
|
Hai già mandato una richiesta
|
||||||
</span>
|
</span>
|
||||||
|
|
|
||||||
|
|
@ -60,7 +60,7 @@ export const CardAnnuncio = ({
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"h-[464px] rounded-md bg-white shadow-sm shadow-neutral-100 outline outline-neutral-200 hover:shadow-md hover:outline-neutral-300",
|
"h-[464px] rounded-md bg-white shadow-neutral-100 shadow-sm outline outline-neutral-200 hover:shadow-md hover:outline-neutral-300",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
id={`card-annuncio-${id}`}
|
id={`card-annuncio-${id}`}
|
||||||
|
|
@ -70,11 +70,11 @@ export const CardAnnuncio = ({
|
||||||
//target="_blank"
|
//target="_blank"
|
||||||
href={`/annuncio/${codice}`} //duration-700 ease-in-out animate-in fade-in
|
href={`/annuncio/${codice}`} //duration-700 ease-in-out animate-in fade-in
|
||||||
>
|
>
|
||||||
<div className="group relative rounded-md text-clip">
|
<div className="group relative text-clip rounded-md">
|
||||||
{stato === "Trattativa" && (
|
{stato === "Trattativa" && (
|
||||||
<div>
|
<div>
|
||||||
<div className="absolute z-20 h-56 w-full">
|
<div className="absolute z-20 h-56 w-full">
|
||||||
<div className="absolute bottom-0 w-full touch-none bg-violet-500 rounded-b-md text-center text-lg text-white select-none">
|
<div className="absolute bottom-0 w-full touch-none select-none rounded-b-md bg-violet-500 text-center text-lg text-white">
|
||||||
Annuncio in Trattativa
|
Annuncio in Trattativa
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -156,36 +156,36 @@ export const CardAnnuncio = ({
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<span className="sr-only">{t.card.codice}</span>
|
<span className="sr-only">{t.card.codice}</span>
|
||||||
|
|
||||||
<span className="text-xl font-semibold text-red-600">
|
<span className="font-semibold text-red-600 text-xl">
|
||||||
Cod: {codice}
|
Cod: {codice}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<span className="sr-only">{t.card.prezzo}</span>
|
<span className="sr-only">{t.card.prezzo}</span>
|
||||||
|
|
||||||
<span className="text-xl font-semibold">
|
<span className="font-semibold text-xl">
|
||||||
{formatCurrency(prezzo / 1e2)}
|
{formatCurrency(prezzo / 1e2)}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="text-muted-foreground mb-3 text-center">
|
<div className="mb-3 text-center text-muted-foreground">
|
||||||
<span className="sr-only">{t.card.titolo}</span>
|
<span className="sr-only">{t.card.titolo}</span>
|
||||||
|
|
||||||
<span className="line-clamp-2 min-h-[3.5rem] text-base font-medium md:text-lg">
|
<span className="line-clamp-2 min-h-[3.5rem] font-medium text-base md:text-lg">
|
||||||
{titolo}
|
{titolo}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-muted-foreground text-center">
|
<div className="text-center text-muted-foreground">
|
||||||
<span className="sr-only">{t.card.indirizzo}</span>
|
<span className="sr-only">{t.card.indirizzo}</span>
|
||||||
|
|
||||||
<span className="text-sm font-medium">
|
<span className="font-medium text-sm">
|
||||||
{comune && provincia && `${comune} (${provincia})`}
|
{comune && provincia && `${comune} (${provincia})`}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="text-muted-foreground mt-4 flex items-center justify-around gap-2 text-xs">
|
<div className="mt-4 flex items-center justify-around gap-2 text-muted-foreground text-xs">
|
||||||
<div className="flex w-full items-center justify-center gap-1 rounded-md bg-neutral-100 py-3">
|
<div className="flex w-full items-center justify-center gap-1 rounded-md bg-neutral-100 py-3">
|
||||||
<Ruler className="size-4 text-indigo-700" />
|
<Ruler className="size-4 text-indigo-700" />
|
||||||
|
|
||||||
|
|
@ -245,7 +245,7 @@ export const CarouselAnnuncio = ({
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="mx-auto my-4 w-full rounded-md text-clip">
|
<div className="mx-auto my-4 w-full text-clip rounded-md">
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<Carousel opts={{ align: "start", loop: true }}>
|
<Carousel opts={{ align: "start", loop: true }}>
|
||||||
<CarouselContent>
|
<CarouselContent>
|
||||||
|
|
@ -272,7 +272,7 @@ export const CarouselAnnuncio = ({
|
||||||
width={800}
|
width={800}
|
||||||
/>
|
/>
|
||||||
<Maximize2
|
<Maximize2
|
||||||
className="absolute right-2 bottom-2 transition-all duration-300 hover:scale-150 origin-bottom-right ease-in-out cursor-pointer size-7 rounded-md bg-white/70 stroke-2 p-1 group-hover:opacity-100 sm:opacity-0"
|
className="absolute right-2 bottom-2 size-7 origin-bottom-right cursor-pointer rounded-md bg-white/70 stroke-2 p-1 transition-all duration-300 ease-in-out hover:scale-150 group-hover:opacity-100 sm:opacity-0"
|
||||||
onClick={() => handleOpenModal(idx)}
|
onClick={() => handleOpenModal(idx)}
|
||||||
/>
|
/>
|
||||||
</CarouselItem>
|
</CarouselItem>
|
||||||
|
|
@ -300,7 +300,7 @@ export const CarouselAnnuncio = ({
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Maximize2
|
<Maximize2
|
||||||
className="absolute right-2 bottom-2 transition-all duration-300 hover:scale-150 origin-bottom-right ease-in-out cursor-pointer size-7 rounded-md bg-white/70 stroke-2 p-1 group-hover:opacity-100 sm:opacity-0"
|
className="absolute right-2 bottom-2 size-7 origin-bottom-right cursor-pointer rounded-md bg-white/70 stroke-2 p-1 transition-all duration-300 ease-in-out hover:scale-150 group-hover:opacity-100 sm:opacity-0"
|
||||||
onClick={() =>
|
onClick={() =>
|
||||||
handleOpenModal(immagini?.length || 0 + idx)
|
handleOpenModal(immagini?.length || 0 + idx)
|
||||||
}
|
}
|
||||||
|
|
@ -324,7 +324,7 @@ export const CarouselAnnuncio = ({
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Dialog onOpenChange={setOpenModal} open={openModal}>
|
<Dialog onOpenChange={setOpenModal} open={openModal}>
|
||||||
<DialogContent className="flex h-full w-full max-w-full items-center justify-center border-none border-transparent bg-white p-0 md:max-w-[80vw] md:p-6 [&_#dialog-close>svg]:size-8">
|
<DialogContent className="flex h-full w-full max-w-full items-center justify-center border-transparent border-none bg-white p-0 md:max-w-[80vw] md:p-6 [&_#dialog-close>svg]:size-8">
|
||||||
<DialogHeader className="absolute top-0 right-0 left-0 z-10">
|
<DialogHeader className="absolute top-0 right-0 left-0 z-10">
|
||||||
<DialogTitle className="sr-only">Image Dialog</DialogTitle>
|
<DialogTitle className="sr-only">Image Dialog</DialogTitle>
|
||||||
<DialogDescription className="sr-only">Immagine</DialogDescription>
|
<DialogDescription className="sr-only">Immagine</DialogDescription>
|
||||||
|
|
@ -353,7 +353,7 @@ export const CarouselAnnuncio = ({
|
||||||
key={`carousel-videoplayer-${video}`}
|
key={`carousel-videoplayer-${video}`}
|
||||||
>
|
>
|
||||||
<VideoPlayer
|
<VideoPlayer
|
||||||
className="h-[90vh] absolute w-full mx-auto max-w-fit rounded-md object-contain"
|
className="absolute mx-auto h-[90vh] w-full max-w-fit rounded-md object-contain"
|
||||||
coverImage={immagini?.[0] ? immagini[0] : ""}
|
coverImage={immagini?.[0] ? immagini[0] : ""}
|
||||||
videoSrc={video}
|
videoSrc={video}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -124,8 +124,8 @@ export const AllegatiComp = ({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-col space-y-5">
|
<div className="flex flex-col space-y-5">
|
||||||
<h1 className="text-primary text-2xl font-bold">{t.allegati.title}</h1>
|
<h1 className="font-bold text-2xl text-primary">{t.allegati.title}</h1>
|
||||||
<h1 className="text-xl font-semibold">{t.allegati.da_info}</h1>
|
<h1 className="font-semibold text-xl">{t.allegati.da_info}</h1>
|
||||||
{from_admin && (
|
{from_admin && (
|
||||||
<FileList
|
<FileList
|
||||||
delete_onClick={(id) => deleteFile({ fileId: id, userId })}
|
delete_onClick={(id) => deleteFile({ fileId: id, userId })}
|
||||||
|
|
@ -299,7 +299,7 @@ function FileList({
|
||||||
return (
|
return (
|
||||||
<div className="w-full">
|
<div className="w-full">
|
||||||
<div className="rounded-md border">
|
<div className="rounded-md border">
|
||||||
<div className="bg-muted/50 text-muted-foreground grid grid-cols-12 gap-2 p-4 text-sm font-medium">
|
<div className="grid grid-cols-12 gap-2 bg-muted/50 p-4 font-medium text-muted-foreground text-sm">
|
||||||
<div className="col-span-6 md:col-span-8">File</div>
|
<div className="col-span-6 md:col-span-8">File</div>
|
||||||
<div className="col-span-4 md:col-span-3">Data</div>
|
<div className="col-span-4 md:col-span-3">Data</div>
|
||||||
<div className="col-span-2 text-right md:col-span-1">Azioni</div>
|
<div className="col-span-2 text-right md:col-span-1">Azioni</div>
|
||||||
|
|
@ -307,7 +307,7 @@ function FileList({
|
||||||
<div className="divide-y">
|
<div className="divide-y">
|
||||||
{files.map((file) => (
|
{files.map((file) => (
|
||||||
<div
|
<div
|
||||||
className="hover:bg-muted/50 grid grid-cols-12 items-center gap-2 p-4 text-sm transition-colors"
|
className="grid grid-cols-12 items-center gap-2 p-4 text-sm transition-colors hover:bg-muted/50"
|
||||||
key={file.id}
|
key={file.id}
|
||||||
>
|
>
|
||||||
<div className="col-span-6 flex items-center gap-2 md:col-span-8">
|
<div className="col-span-6 flex items-center gap-2 md:col-span-8">
|
||||||
|
|
@ -316,7 +316,7 @@ function FileList({
|
||||||
</div>
|
</div>
|
||||||
<Link
|
<Link
|
||||||
aria-label="Allegato"
|
aria-label="Allegato"
|
||||||
className="text-foreground truncate font-medium hover:underline"
|
className="truncate font-medium text-foreground hover:underline"
|
||||||
href={`/area-riservata/allegato-view/${file.id}`}
|
href={`/area-riservata/allegato-view/${file.id}`}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
>
|
>
|
||||||
|
|
@ -324,7 +324,7 @@ function FileList({
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="text-muted-foreground col-span-4 md:col-span-3">
|
<div className="col-span-4 text-muted-foreground md:col-span-3">
|
||||||
{format(file.created_at, "d MMM yyyy")}
|
{format(file.created_at, "d MMM yyyy")}
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-2 flex justify-end gap-1 md:col-span-1">
|
<div className="col-span-2 flex justify-end gap-1 md:col-span-1">
|
||||||
|
|
|
||||||
|
|
@ -23,7 +23,7 @@ export const AdminDashboard = () => {
|
||||||
<div className="mx-auto pt-4 pb-8">
|
<div className="mx-auto pt-4 pb-8">
|
||||||
<div className="mx-3 items-start justify-between pb-3 md:flex">
|
<div className="mx-3 items-start justify-between pb-3 md:flex">
|
||||||
<div className="flex max-w-lg items-center gap-3">
|
<div className="flex max-w-lg items-center gap-3">
|
||||||
<h3 className="text-2xl font-bold">Admin Dashboard</h3>
|
<h3 className="font-bold text-2xl">Admin Dashboard</h3>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{!stats ? (
|
{!stats ? (
|
||||||
|
|
@ -38,7 +38,7 @@ export const AdminDashboard = () => {
|
||||||
</CardDescription>
|
</CardDescription>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
|
|
||||||
<CardContent className="flex h-full items-center justify-center text-6xl font-bold">
|
<CardContent className="flex h-full items-center justify-center font-bold text-6xl">
|
||||||
{stats.userCount}
|
{stats.userCount}
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
|
|
@ -74,7 +74,7 @@ export const UserDashboard = ({ userId }: { userId: UsersId }) => {
|
||||||
<div className="mx-auto pt-4">
|
<div className="mx-auto pt-4">
|
||||||
<div className="mx-3 items-start justify-between md:flex">
|
<div className="mx-3 items-start justify-between md:flex">
|
||||||
<div className="flex max-w-lg items-center gap-3">
|
<div className="flex max-w-lg items-center gap-3">
|
||||||
<h3 className="text-2xl font-bold">Le tue ricerche</h3>
|
<h3 className="font-bold text-2xl">Le tue ricerche</h3>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -35,7 +35,7 @@ export const Sidebar = ({
|
||||||
animate={{ width: minimized ? 65 : 192 }}
|
animate={{ width: minimized ? 65 : 192 }}
|
||||||
aria-label="Sidebar Menu"
|
aria-label="Sidebar Menu"
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-accent-foreground z-30 hidden h-auto w-48 shrink-0 space-y-4 border-r bg-white pt-3 md:block",
|
"z-30 hidden h-auto w-48 shrink-0 space-y-4 border-r bg-white pt-3 text-accent-foreground md:block",
|
||||||
className,
|
className,
|
||||||
minimized && "cursor-pointer",
|
minimized && "cursor-pointer",
|
||||||
//defaultOpen && "w-[65px]",
|
//defaultOpen && "w-[65px]",
|
||||||
|
|
@ -57,7 +57,7 @@ export const Sidebar = ({
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{!minimized && (
|
{!minimized && (
|
||||||
<h4 className={cn("w-full text-xl font-semibold")}>Menu</h4>
|
<h4 className={cn("w-full font-semibold text-xl")}>Menu</h4>
|
||||||
)}
|
)}
|
||||||
<Button
|
<Button
|
||||||
aria-label="Toggle Sidebar"
|
aria-label="Toggle Sidebar"
|
||||||
|
|
|
||||||
|
|
@ -70,7 +70,7 @@ export const BannerFactory = (bannerData: Banners) => {
|
||||||
<div className="flex flex-1 items-start justify-center gap-x-4 sm:items-center">
|
<div className="flex flex-1 items-start justify-center gap-x-4 sm:items-center">
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex flex-none items-center justify-center rounded-full bg-indigo-800 p-1.5 px-4 text-sm font-medium",
|
"flex flex-none items-center justify-center rounded-full bg-indigo-800 p-1.5 px-4 font-medium text-sm",
|
||||||
accentColor,
|
accentColor,
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
export default function BlurryDivider() {
|
export default function BlurryDivider() {
|
||||||
return (
|
return (
|
||||||
<hr className="h-px border-t-0 bg-transparent bg-gradient-to-r from-transparent via-neutral-500 to-transparent opacity-80 dark:via-neutral-50 dark:opacity-100" />
|
<hr className="h-px border-t-0 bg-gradient-to-r bg-transparent from-transparent via-neutral-500 to-transparent opacity-80 dark:via-neutral-50 dark:opacity-100" />
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -51,7 +51,7 @@ export const ChatAttachments = ({
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
>
|
>
|
||||||
{attachments && attachments.length > 0 && (
|
{attachments && attachments.length > 0 && (
|
||||||
<span className="absolute -top-1 right-0 rounded-full bg-blue-500 px-1 text-xs font-bold text-white">
|
<span className="-top-1 absolute right-0 rounded-full bg-blue-500 px-1 font-bold text-white text-xs">
|
||||||
{attachments.length}
|
{attachments.length}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
|
|
@ -78,13 +78,13 @@ export const ChatAttachments = ({
|
||||||
<>
|
<>
|
||||||
{!attachments || attachments.length === 0 ? (
|
{!attachments || attachments.length === 0 ? (
|
||||||
<div className="flex h-full items-center justify-center">
|
<div className="flex h-full items-center justify-center">
|
||||||
<p className="text-center text-lg font-semibold text-gray-500">
|
<p className="text-center font-semibold text-gray-500 text-lg">
|
||||||
{t.allegati.nessun_allegato}
|
{t.allegati.nessun_allegato}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<ul className="px-2">
|
<ul className="px-2">
|
||||||
<h3 className="px-3 text-lg font-semibold text-gray-700">
|
<h3 className="px-3 font-semibold text-gray-700 text-lg">
|
||||||
{t.allegati.allegati_recenti}
|
{t.allegati.allegati_recenti}
|
||||||
</h3>
|
</h3>
|
||||||
{attachments?.map((file, idx) => {
|
{attachments?.map((file, idx) => {
|
||||||
|
|
@ -137,7 +137,7 @@ export const ChatAttachments = ({
|
||||||
>
|
>
|
||||||
<Paperclip /> {t.allegati.i_tuoi_allegati}
|
<Paperclip /> {t.allegati.i_tuoi_allegati}
|
||||||
{attachments && attachments.length > 0 && (
|
{attachments && attachments.length > 0 && (
|
||||||
<span className="absolute -top-1 -right-1 flex size-5 items-center justify-center rounded-full bg-red-600 text-xs text-white">
|
<span className="-top-1 -right-1 absolute flex size-5 items-center justify-center rounded-full bg-red-600 text-white text-xs">
|
||||||
{attachments.length}
|
{attachments.length}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
|
|
|
||||||
|
|
@ -101,7 +101,7 @@ export default function ChatBottombar({
|
||||||
<div className="relative w-full">
|
<div className="relative w-full">
|
||||||
<AutosizeTextarea
|
<AutosizeTextarea
|
||||||
autoComplete="off"
|
autoComplete="off"
|
||||||
className="bg-background flex h-14 min-h-14 w-full resize-none items-center overflow-hidden rounded-xl border pr-8 ring-0 outline-hidden hover:border-neutral-400 focus:border-neutral-600 focus:ring-0 focus-visible:ring-0 focus-visible:ring-offset-0"
|
className="flex h-14 min-h-14 w-full resize-none items-center overflow-hidden rounded-xl border bg-background pr-8 outline-hidden ring-0 hover:border-neutral-400 focus:border-neutral-600 focus:ring-0 focus-visible:ring-0 focus-visible:ring-offset-0"
|
||||||
minHeight={56}
|
minHeight={56}
|
||||||
name="message"
|
name="message"
|
||||||
onBlur={() => setIsFocused(false)}
|
onBlur={() => setIsFocused(false)}
|
||||||
|
|
|
||||||
|
|
@ -61,7 +61,7 @@ export const ChatBubbleReadStatus = ({ isread }: ChatBubbleReadStatusProps) => {
|
||||||
if (isread) {
|
if (isread) {
|
||||||
return <CheckCheck className="mt-2 size-4 text-green-500" />;
|
return <CheckCheck className="mt-2 size-4 text-green-500" />;
|
||||||
}
|
}
|
||||||
return <Check className="text-muted-foreground mt-2 size-4" />;
|
return <Check className="mt-2 size-4 text-muted-foreground" />;
|
||||||
};
|
};
|
||||||
|
|
||||||
// ChatBubbleMessage
|
// ChatBubbleMessage
|
||||||
|
|
@ -100,7 +100,7 @@ const ChatBubbleMessage = React.forwardRef<
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
chatBubbleMessageVariants({ className, layout, variant }),
|
chatBubbleMessageVariants({ className, layout, variant }),
|
||||||
"max-w-full break-words whitespace-pre-wrap",
|
"max-w-full whitespace-pre-wrap break-words",
|
||||||
)}
|
)}
|
||||||
ref={ref}
|
ref={ref}
|
||||||
{...props}
|
{...props}
|
||||||
|
|
@ -173,7 +173,7 @@ const ChatBubbleActionWrapper = React.forwardRef<
|
||||||
{show && (
|
{show && (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"absolute top-1/2 flex -translate-y-1/2 opacity-0 transition-opacity duration-200 group-hover:opacity-100",
|
"-translate-y-1/2 absolute top-1/2 flex opacity-0 transition-opacity duration-200 group-hover:opacity-100",
|
||||||
variant === "sent"
|
variant === "sent"
|
||||||
? "-left-1 -translate-x-full flex-row-reverse"
|
? "-left-1 -translate-x-full flex-row-reverse"
|
||||||
: "-right-1 translate-x-full",
|
: "-right-1 translate-x-full",
|
||||||
|
|
|
||||||
|
|
@ -194,7 +194,7 @@ export const ChatList = ({
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{!isPrevSameDay && (
|
{!isPrevSameDay && (
|
||||||
<span className="mx-auto rounded-md bg-muted px-2 py-1 text-center text-xs text-muted-foreground">
|
<span className="mx-auto rounded-md bg-muted px-2 py-1 text-center text-muted-foreground text-xs">
|
||||||
{new Date(message.time).toLocaleDateString("it", {
|
{new Date(message.time).toLocaleDateString("it", {
|
||||||
day: "2-digit",
|
day: "2-digit",
|
||||||
month: "2-digit",
|
month: "2-digit",
|
||||||
|
|
@ -213,7 +213,7 @@ export const ChatList = ({
|
||||||
{!isPreviousSameSender && (
|
{!isPreviousSameSender && (
|
||||||
<p
|
<p
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-sm font-semibold",
|
"font-semibold text-sm",
|
||||||
variant === "sent" && "text-right",
|
variant === "sent" && "text-right",
|
||||||
)}
|
)}
|
||||||
style={{
|
style={{
|
||||||
|
|
|
||||||
|
|
@ -103,7 +103,7 @@ export const ChatSidebar = ({ chatId }: { chatId: ChatsChatid | null }) => {
|
||||||
<div className="mx-2 flex flex-col items-center justify-between gap-2 sm:flex-row sm:gap-0">
|
<div className="mx-2 flex flex-col items-center justify-between gap-2 sm:flex-row sm:gap-0">
|
||||||
{isDesktop ? (
|
{isDesktop ? (
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<Search className="text-muted-foreground absolute top-[0.8rem] left-2 size-4" />
|
<Search className="absolute top-[0.8rem] left-2 size-4 text-muted-foreground" />
|
||||||
<label className="sr-only" htmlFor="search">
|
<label className="sr-only" htmlFor="search">
|
||||||
Search Chats
|
Search Chats
|
||||||
</label>
|
</label>
|
||||||
|
|
@ -181,10 +181,10 @@ export const ChatSidebar = ({ chatId }: { chatId: ChatsChatid | null }) => {
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<span className="text-muted-foreground truncate text-xs">
|
<span className="truncate text-muted-foreground text-xs">
|
||||||
{getLastMessage(chat.lastmessage)}
|
{getLastMessage(chat.lastmessage)}
|
||||||
</span>
|
</span>
|
||||||
<span className="text-muted-foreground truncate text-xs">
|
<span className="truncate text-muted-foreground text-xs">
|
||||||
{chat.lastmessage &&
|
{chat.lastmessage &&
|
||||||
new Date(chat.lastmessage.time).toLocaleString("it", {
|
new Date(chat.lastmessage.time).toLocaleString("it", {
|
||||||
day: "2-digit",
|
day: "2-digit",
|
||||||
|
|
|
||||||
|
|
@ -142,7 +142,7 @@ const UserStatus = ({
|
||||||
<TooltipTrigger>
|
<TooltipTrigger>
|
||||||
<span
|
<span
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex flex-row items-center text-xs font-bold text-green-500",
|
"flex flex-row items-center font-bold text-green-500 text-xs",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<ShieldUser className="mr-[0.2rem]" size={15} />
|
<ShieldUser className="mr-[0.2rem]" size={15} />
|
||||||
|
|
@ -159,7 +159,7 @@ const UserStatus = ({
|
||||||
</TooltipProvider>
|
</TooltipProvider>
|
||||||
) : (
|
) : (
|
||||||
<span
|
<span
|
||||||
className={cn("flex flex-row text-xs font-bold text-green-500")}
|
className={cn("flex flex-row font-bold text-green-500 text-xs")}
|
||||||
key={idx}
|
key={idx}
|
||||||
>
|
>
|
||||||
<span>
|
<span>
|
||||||
|
|
|
||||||
|
|
@ -90,7 +90,7 @@ const AutocompleteSearchBox = ({
|
||||||
</label>
|
</label>
|
||||||
<Input
|
<Input
|
||||||
className={cn(
|
className={cn(
|
||||||
"placeholder:text-primary search-cancel:brightness-75 search-cancel:grayscale search-cancel:cursor-pointer z-10 cursor-pointer rounded-md bg-transparent text-xl placeholder:font-bold",
|
"z-10 cursor-pointer search-cancel:cursor-pointer rounded-md bg-transparent text-xl search-cancel:brightness-75 search-cancel:grayscale placeholder:font-bold placeholder:text-primary",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
id="search"
|
id="search"
|
||||||
|
|
@ -116,7 +116,7 @@ const AutocompleteSearchBox = ({
|
||||||
{open && (
|
{open && (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"border-foreground ring-foreground absolute z-50 mt-1 max-h-64 w-full overflow-hidden rounded-md border bg-white shadow-xs ring-1",
|
"absolute z-50 mt-1 max-h-64 w-full overflow-hidden rounded-md border border-foreground bg-white shadow-xs ring-1 ring-foreground",
|
||||||
optionBoxClassName,
|
optionBoxClassName,
|
||||||
)}
|
)}
|
||||||
id="searchOptionsBox"
|
id="searchOptionsBox"
|
||||||
|
|
@ -132,14 +132,14 @@ const AutocompleteSearchBox = ({
|
||||||
role="listbox"
|
role="listbox"
|
||||||
>
|
>
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<li className={"px-3 py-2 text-center text-xl text-neutral-600"}>
|
<li className={"px-3 py-2 text-center text-neutral-600 text-xl"}>
|
||||||
<span>Caricamento...</span>
|
<span>Caricamento...</span>
|
||||||
</li>
|
</li>
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
{results.length === 0 && (
|
{results.length === 0 && (
|
||||||
<li
|
<li
|
||||||
className={"px-3 py-2 text-center text-xl text-neutral-600"}
|
className={"px-3 py-2 text-center text-neutral-600 text-xl"}
|
||||||
>
|
>
|
||||||
<span>
|
<span>
|
||||||
<CircleOff className="inline size-6" />
|
<CircleOff className="inline size-6" />
|
||||||
|
|
@ -151,7 +151,7 @@ const AutocompleteSearchBox = ({
|
||||||
<li key={item}>
|
<li key={item}>
|
||||||
<Link
|
<Link
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex w-full cursor-pointer items-center justify-between border-b border-neutral-200 bg-white px-4 py-2 text-xl text-neutral-500 duration-150 hover:bg-neutral-100 hover:text-neutral-600 hover:underline hover:underline-offset-2",
|
"flex w-full cursor-pointer items-center justify-between border-neutral-200 border-b bg-white px-4 py-2 text-neutral-500 text-xl duration-150 hover:bg-neutral-100 hover:text-neutral-600 hover:underline hover:underline-offset-2",
|
||||||
optionsClassName,
|
optionsClassName,
|
||||||
)}
|
)}
|
||||||
href={`/annuncio/${item}`}
|
href={`/annuncio/${item}`}
|
||||||
|
|
@ -189,7 +189,7 @@ const MovingText = ({ hidden }: { hidden: boolean }) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<StaggeredFade
|
<StaggeredFade
|
||||||
className="absolute text-2xl font-bold dark:text-neutral-800"
|
className="absolute font-bold text-2xl dark:text-neutral-800"
|
||||||
hide={hidden}
|
hide={hidden}
|
||||||
key={randomFrase}
|
key={randomFrase}
|
||||||
text={randomFrase}
|
text={randomFrase}
|
||||||
|
|
|
||||||
|
|
@ -39,7 +39,7 @@ export const ComeFunziona = () => {
|
||||||
];
|
];
|
||||||
return (
|
return (
|
||||||
<div className="mx-auto w-full max-w-6xl py-2">
|
<div className="mx-auto w-full max-w-6xl py-2">
|
||||||
<h2 className="max-w-xl text-3xl font-semibold tracking-tight md:mx-auto md:text-center md:text-4xl md:leading-[3.5rem]">
|
<h2 className="max-w-xl font-semibold text-3xl tracking-tight md:mx-auto md:text-center md:text-4xl md:leading-[3.5rem]">
|
||||||
{t.come_funziona.title}
|
{t.come_funziona.title}
|
||||||
</h2>
|
</h2>
|
||||||
<div className="mx-auto mt-8 w-full space-y-12 md:mt-16">
|
<div className="mx-auto mt-8 w-full space-y-12 md:mt-16">
|
||||||
|
|
@ -51,7 +51,7 @@ export const ComeFunziona = () => {
|
||||||
<div className="flex shrink-0 basis-1/2 justify-center">
|
<div className="flex shrink-0 basis-1/2 justify-center">
|
||||||
<Image
|
<Image
|
||||||
alt={`img${idx}`}
|
alt={`img${idx}`}
|
||||||
className="border-border/50 aspect-[6/4] rounded-xl border"
|
className="aspect-[6/4] rounded-xl border border-border/50"
|
||||||
height={200}
|
height={200}
|
||||||
src={feature.image}
|
src={feature.image}
|
||||||
width={400}
|
width={400}
|
||||||
|
|
@ -60,11 +60,11 @@ export const ComeFunziona = () => {
|
||||||
<div className="flex basis-1/2 flex-col">
|
<div className="flex basis-1/2 flex-col">
|
||||||
<div className="flex items-center gap-3 text-blue-600">
|
<div className="flex items-center gap-3 text-blue-600">
|
||||||
{feature.icon}
|
{feature.icon}
|
||||||
<h4 className="my-3 text-3xl font-semibold tracking-tight">
|
<h4 className="my-3 font-semibold text-3xl tracking-tight">
|
||||||
{feature.title}
|
{feature.title}
|
||||||
</h4>
|
</h4>
|
||||||
</div>
|
</div>
|
||||||
<p className="text-muted-foreground text-[17px]">
|
<p className="text-[17px] text-muted-foreground">
|
||||||
{feature.desc}
|
{feature.desc}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -101,7 +101,7 @@ export const AutosizeTextarea = forwardRef<
|
||||||
<textarea
|
<textarea
|
||||||
{...props}
|
{...props}
|
||||||
className={cn(
|
className={cn(
|
||||||
"border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50",
|
"flex w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
|
|
|
||||||
|
|
@ -104,7 +104,7 @@ export function DataTableFacetedFilter<TData, TValue>({
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"border-primary mr-2 flex size-4 items-center justify-center rounded-xs border",
|
"mr-2 flex size-4 items-center justify-center rounded-xs border border-primary",
|
||||||
isSelected
|
isSelected
|
||||||
? "bg-primary text-primary-foreground"
|
? "bg-primary text-primary-foreground"
|
||||||
: "opacity-50 [&_svg]:invisible",
|
: "opacity-50 [&_svg]:invisible",
|
||||||
|
|
@ -113,7 +113,7 @@ export function DataTableFacetedFilter<TData, TValue>({
|
||||||
<CheckIcon className={cn("size-4")} />
|
<CheckIcon className={cn("size-4")} />
|
||||||
</div>
|
</div>
|
||||||
{option.icon && (
|
{option.icon && (
|
||||||
<option.icon className="text-muted-foreground mr-2 size-4" />
|
<option.icon className="mr-2 size-4 text-muted-foreground" />
|
||||||
)}
|
)}
|
||||||
<span>{option.label}</span>
|
<span>{option.label}</span>
|
||||||
{facets?.get(option.value) && (
|
{facets?.get(option.value) && (
|
||||||
|
|
|
||||||
|
|
@ -36,7 +36,7 @@ export function DataTableColumnHeader<TData, TValue>({
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger asChild>
|
<DropdownMenuTrigger asChild>
|
||||||
<Button
|
<Button
|
||||||
className="data-[state=open]:bg-accent -ml-3 h-8"
|
className="-ml-3 h-8 data-[state=open]:bg-accent"
|
||||||
size="sm"
|
size="sm"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
>
|
>
|
||||||
|
|
@ -52,18 +52,18 @@ export function DataTableColumnHeader<TData, TValue>({
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent align="start">
|
<DropdownMenuContent align="start">
|
||||||
<DropdownMenuItem onClick={() => column.toggleSorting(false)}>
|
<DropdownMenuItem onClick={() => column.toggleSorting(false)}>
|
||||||
<ArrowUpIcon className="text-muted-foreground/70 mr-2 h-3.5 w-3.5" />
|
<ArrowUpIcon className="mr-2 h-3.5 w-3.5 text-muted-foreground/70" />
|
||||||
Asc
|
Asc
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
<DropdownMenuItem onClick={() => column.toggleSorting(true)}>
|
<DropdownMenuItem onClick={() => column.toggleSorting(true)}>
|
||||||
<ArrowDownIcon className="text-muted-foreground/70 mr-2 h-3.5 w-3.5" />
|
<ArrowDownIcon className="mr-2 h-3.5 w-3.5 text-muted-foreground/70" />
|
||||||
Desc
|
Desc
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
{column.getCanHide() && (
|
{column.getCanHide() && (
|
||||||
<>
|
<>
|
||||||
<DropdownMenuSeparator />
|
<DropdownMenuSeparator />
|
||||||
<DropdownMenuItem onClick={() => column.toggleVisibility(false)}>
|
<DropdownMenuItem onClick={() => column.toggleVisibility(false)}>
|
||||||
<EyeOff className="text-muted-foreground/70 mr-2 h-3.5 w-3.5" />
|
<EyeOff className="mr-2 h-3.5 w-3.5 text-muted-foreground/70" />
|
||||||
Nascondi
|
Nascondi
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,7 @@ export function DataTablePagination<TData>({
|
||||||
}: DataTablePaginationProps<TData>) {
|
}: DataTablePaginationProps<TData>) {
|
||||||
return (
|
return (
|
||||||
<div className="flex items-center justify-between px-2">
|
<div className="flex items-center justify-between px-2">
|
||||||
<div className="text-muted-foreground flex-1 text-sm">
|
<div className="flex-1 text-muted-foreground text-sm">
|
||||||
{hasSelectRow &&
|
{hasSelectRow &&
|
||||||
`${table.getFilteredSelectedRowModel().rows.length} selezioni su `}
|
`${table.getFilteredSelectedRowModel().rows.length} selezioni su `}
|
||||||
{table.getFilteredRowModel().rows.length} righe totali
|
{table.getFilteredRowModel().rows.length} righe totali
|
||||||
|
|
@ -33,7 +33,7 @@ export function DataTablePagination<TData>({
|
||||||
|
|
||||||
<div className="flex flex-wrap items-center gap-x-6 gap-y-2 lg:gap-x-8">
|
<div className="flex flex-wrap items-center gap-x-6 gap-y-2 lg:gap-x-8">
|
||||||
<div className="flex items-center space-x-2">
|
<div className="flex items-center space-x-2">
|
||||||
<p className="text-sm font-medium">Righe per pagina</p>
|
<p className="font-medium text-sm">Righe per pagina</p>
|
||||||
<Select
|
<Select
|
||||||
onValueChange={(value) => {
|
onValueChange={(value) => {
|
||||||
table.setPageSize(Number(value));
|
table.setPageSize(Number(value));
|
||||||
|
|
@ -53,7 +53,7 @@ export function DataTablePagination<TData>({
|
||||||
</Select>
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center gap-x-6 lg:gap-x-8">
|
<div className="flex items-center gap-x-6 lg:gap-x-8">
|
||||||
<div className="flex items-center justify-between text-sm font-medium">
|
<div className="flex items-center justify-between font-medium text-sm">
|
||||||
Pagina {table.getState().pagination.pageIndex + 1} di{" "}
|
Pagina {table.getState().pagination.pageIndex + 1} di{" "}
|
||||||
{table.getPageCount()}
|
{table.getPageCount()}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -30,7 +30,7 @@ function EmojiPicker({
|
||||||
return (
|
return (
|
||||||
<EmojiPickerPrimitive.Root
|
<EmojiPickerPrimitive.Root
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-popover text-popover-foreground isolate flex h-full w-fit flex-col overflow-hidden rounded-md",
|
"isolate flex h-full w-fit flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="emoji-picker"
|
data-slot="emoji-picker"
|
||||||
|
|
@ -50,7 +50,7 @@ function EmojiPickerSearch({
|
||||||
>
|
>
|
||||||
<SearchIcon className="size-4 shrink-0 opacity-50" />
|
<SearchIcon className="size-4 shrink-0 opacity-50" />
|
||||||
<EmojiPickerPrimitive.Search
|
<EmojiPickerPrimitive.Search
|
||||||
className="placeholder:text-muted-foreground focus:border-accent-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden focus:ring-0 disabled:cursor-not-allowed disabled:opacity-50"
|
className="flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden placeholder:text-muted-foreground focus:border-accent-foreground focus:ring-0 disabled:cursor-not-allowed disabled:opacity-50"
|
||||||
data-slot="emoji-picker-search"
|
data-slot="emoji-picker-search"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
@ -74,7 +74,7 @@ function EmojiPickerEmoji({
|
||||||
return (
|
return (
|
||||||
<button
|
<button
|
||||||
className={cn(
|
className={cn(
|
||||||
"data-[active]:bg-accent flex size-7 items-center justify-center rounded-xs text-base",
|
"flex size-7 items-center justify-center rounded-xs text-base data-[active]:bg-accent",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="emoji-picker-emoji"
|
data-slot="emoji-picker-emoji"
|
||||||
|
|
@ -91,7 +91,7 @@ function EmojiPickerCategoryHeader({
|
||||||
}: EmojiPickerListCategoryHeaderProps) {
|
}: EmojiPickerListCategoryHeaderProps) {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="bg-popover text-muted-foreground px-3 pt-3.5 pb-2 text-xs leading-none"
|
className="bg-popover px-3 pt-3.5 pb-2 text-muted-foreground text-xs leading-none"
|
||||||
data-slot="emoji-picker-category-header"
|
data-slot="emoji-picker-category-header"
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
|
|
@ -111,19 +111,19 @@ function EmojiPickerContent({
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
<EmojiPickerPrimitive.Loading
|
<EmojiPickerPrimitive.Loading
|
||||||
className="text-muted-foreground absolute inset-0 flex items-center justify-center"
|
className="absolute inset-0 flex items-center justify-center text-muted-foreground"
|
||||||
data-slot="emoji-picker-loading"
|
data-slot="emoji-picker-loading"
|
||||||
>
|
>
|
||||||
<LoaderIcon className="size-4 animate-spin" />
|
<LoaderIcon className="size-4 animate-spin" />
|
||||||
</EmojiPickerPrimitive.Loading>
|
</EmojiPickerPrimitive.Loading>
|
||||||
<EmojiPickerPrimitive.Empty
|
<EmojiPickerPrimitive.Empty
|
||||||
className="text-muted-foreground absolute inset-0 flex items-center justify-center text-sm"
|
className="absolute inset-0 flex items-center justify-center text-muted-foreground text-sm"
|
||||||
data-slot="emoji-picker-empty"
|
data-slot="emoji-picker-empty"
|
||||||
>
|
>
|
||||||
No emoji found.
|
No emoji found.
|
||||||
</EmojiPickerPrimitive.Empty>
|
</EmojiPickerPrimitive.Empty>
|
||||||
<EmojiPickerPrimitive.List
|
<EmojiPickerPrimitive.List
|
||||||
className="pb-1 select-none"
|
className="select-none pb-1"
|
||||||
components={{
|
components={{
|
||||||
CategoryHeader: EmojiPickerCategoryHeader,
|
CategoryHeader: EmojiPickerCategoryHeader,
|
||||||
Emoji: EmojiPickerEmoji,
|
Emoji: EmojiPickerEmoji,
|
||||||
|
|
|
||||||
|
|
@ -755,7 +755,7 @@ const FileUploadDropzone = forwardRef<HTMLDivElement, FileUploadDropzoneProps>(
|
||||||
role="region"
|
role="region"
|
||||||
{...dropzoneProps}
|
{...dropzoneProps}
|
||||||
className={cn(
|
className={cn(
|
||||||
"data-[dragging]:border-primary data-[invalid]:border-destructive data-[invalid]:ring-destructive/20 hover:bg-accent/30 focus-visible:border-ring/50 relative flex flex-col items-center justify-center gap-2 rounded-lg border-2 border-dashed p-6 outline-hidden transition-colors select-none data-[disabled]:pointer-events-none",
|
"relative flex select-none flex-col items-center justify-center gap-2 rounded-lg border-2 border-dashed p-6 outline-hidden transition-colors hover:bg-accent/30 focus-visible:border-ring/50 data-[disabled]:pointer-events-none data-[dragging]:border-primary data-[invalid]:border-destructive data-[invalid]:ring-destructive/20",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
onClick={onClick}
|
onClick={onClick}
|
||||||
|
|
@ -847,7 +847,7 @@ const FileUploadList = forwardRef<HTMLDivElement, FileUploadListProps>(
|
||||||
role="list"
|
role="list"
|
||||||
{...listProps}
|
{...listProps}
|
||||||
className={cn(
|
className={cn(
|
||||||
"data-[state=active]:animate-in data-[state=inactive]:animate-out data-[state=active]:fade-in-0 data-[state=inactive]:fade-out-0 data-[state=active]:slide-in-from-top-2 data-[state=inactive]:slide-out-to-top-2 flex flex-col gap-2",
|
"data-[state=active]:fade-in-0 data-[state=inactive]:fade-out-0 data-[state=active]:slide-in-from-top-2 data-[state=inactive]:slide-out-to-top-2 flex flex-col gap-2 data-[state=active]:animate-in data-[state=inactive]:animate-out",
|
||||||
orientation === "horizontal" && "flex-row overflow-x-auto p-1.5",
|
orientation === "horizontal" && "flex-row overflow-x-auto p-1.5",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
|
|
@ -1109,7 +1109,7 @@ const FileUploadItemMetadata = forwardRef<
|
||||||
{children ?? (
|
{children ?? (
|
||||||
<>
|
<>
|
||||||
<span
|
<span
|
||||||
className="truncate text-sm font-medium"
|
className="truncate font-medium text-sm"
|
||||||
id={itemContext.nameId}
|
id={itemContext.nameId}
|
||||||
>
|
>
|
||||||
{itemContext.fileState.file.name}
|
{itemContext.fileState.file.name}
|
||||||
|
|
@ -1171,7 +1171,7 @@ const FileUploadItemProgress = forwardRef<
|
||||||
role="progressbar"
|
role="progressbar"
|
||||||
{...progressProps}
|
{...progressProps}
|
||||||
className={cn(
|
className={cn(
|
||||||
"absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2",
|
"-translate-x-1/2 -translate-y-1/2 absolute top-1/2 left-1/2",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
ref={forwardedRef}
|
ref={forwardedRef}
|
||||||
|
|
@ -1218,13 +1218,13 @@ const FileUploadItemProgress = forwardRef<
|
||||||
role="progressbar"
|
role="progressbar"
|
||||||
{...progressProps}
|
{...progressProps}
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-primary/20 relative h-1.5 w-full overflow-hidden rounded-full",
|
"relative h-1.5 w-full overflow-hidden rounded-full bg-primary/20",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
ref={forwardedRef}
|
ref={forwardedRef}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
className="bg-primary h-full w-full flex-1 transition-all"
|
className="h-full w-full flex-1 bg-primary transition-all"
|
||||||
style={{
|
style={{
|
||||||
transform: `translateX(-${100 - itemContext.fileState.progress}%)`,
|
transform: `translateX(-${100 - itemContext.fileState.progress}%)`,
|
||||||
}}
|
}}
|
||||||
|
|
|
||||||
|
|
@ -133,7 +133,7 @@ const FormDescription = React.forwardRef<
|
||||||
return (
|
return (
|
||||||
<p
|
<p
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-sm text-neutral-500 dark:text-neutral-400",
|
"text-neutral-500 text-sm dark:text-neutral-400",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
id={formDescriptionId}
|
id={formDescriptionId}
|
||||||
|
|
@ -158,7 +158,7 @@ const FormMessage = React.forwardRef<
|
||||||
return (
|
return (
|
||||||
<p
|
<p
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-sm font-medium text-red-500 dark:text-red-600",
|
"font-medium text-red-500 text-sm dark:text-red-600",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
id={formMessageId}
|
id={formMessageId}
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@ const Input = forwardRef<HTMLInputElement, InputProps>(
|
||||||
type={type}
|
type={type}
|
||||||
{...props}
|
{...props}
|
||||||
className={cn(
|
className={cn(
|
||||||
`border-border bg-background text-primary placeholder:text-muted-foreground hover:border-muted-foreground focus:border-foreground focus:ring-foreground w-full rounded-lg border px-3 py-2 font-medium shadow-xs outline-hidden transition-all duration-200 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:cursor-not-allowed disabled:opacity-50`,
|
`w-full rounded-lg border border-border bg-background px-3 py-2 font-medium text-primary shadow-xs outline-hidden transition-all duration-200 file:border-0 file:bg-transparent file:font-medium file:text-sm placeholder:text-muted-foreground hover:border-muted-foreground focus:border-foreground focus:ring-foreground disabled:cursor-not-allowed disabled:opacity-50`,
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -112,7 +112,7 @@ export function MultiSelectTrigger({
|
||||||
{...props}
|
{...props}
|
||||||
aria-expanded={props["aria-expanded"] ?? open}
|
aria-expanded={props["aria-expanded"] ?? open}
|
||||||
className={cn(
|
className={cn(
|
||||||
"aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 border-input data-[placeholder]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 dark:bg-input/30 dark:hover:bg-input/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex h-auto min-h-9 w-fit items-center justify-between gap-2 overflow-hidden rounded-md border bg-transparent px-3 py-1.5 text-sm whitespace-nowrap shadow-xs outline-hidden transition-[color,box-shadow] focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"flex h-auto min-h-9 w-fit items-center justify-between gap-2 overflow-hidden whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-1.5 text-sm shadow-xs outline-hidden transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-muted-foreground dark:bg-input/30 dark:aria-invalid:ring-destructive/40 dark:hover:bg-input/50 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
role={props.role ?? "combobox"}
|
role={props.role ?? "combobox"}
|
||||||
|
|
@ -190,7 +190,7 @@ export function MultiSelectValue({
|
||||||
|
|
||||||
if (selectedValues.size === 0 && placeholder) {
|
if (selectedValues.size === 0 && placeholder) {
|
||||||
return (
|
return (
|
||||||
<span className="text-muted-foreground font-normal">{placeholder}</span>
|
<span className="font-normal text-muted-foreground">{placeholder}</span>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -230,7 +230,7 @@ export function MultiSelectValue({
|
||||||
>
|
>
|
||||||
{items.get(value)}
|
{items.get(value)}
|
||||||
{clickToRemove && (
|
{clickToRemove && (
|
||||||
<XIcon className="text-muted-foreground group-hover:text-destructive size-2" />
|
<XIcon className="size-2 text-muted-foreground group-hover:text-destructive" />
|
||||||
)}
|
)}
|
||||||
</Badge>
|
</Badge>
|
||||||
))}
|
))}
|
||||||
|
|
|
||||||
|
|
@ -49,7 +49,7 @@ const DialogOverlay = forwardRef<
|
||||||
>(({ className, ...props }, ref) => (
|
>(({ className, ...props }, ref) => (
|
||||||
<DialogPrimitive.Overlay
|
<DialogPrimitive.Overlay
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-background/40 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 backdrop-blur-sm",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-background/40 backdrop-blur-sm data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
ref={ref}
|
ref={ref}
|
||||||
|
|
@ -70,7 +70,7 @@ const DialogContent = forwardRef<
|
||||||
<DialogOverlay />
|
<DialogOverlay />
|
||||||
<DialogPrimitive.Content
|
<DialogPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:rounded-lg",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 data-[state=closed]:animate-out data-[state=open]:animate-in sm:rounded-lg",
|
||||||
context.innerOpen && "translate-y-[-55%] scale-[0.97]",
|
context.innerOpen && "translate-y-[-55%] scale-[0.97]",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
|
|
@ -78,7 +78,7 @@ const DialogContent = forwardRef<
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
<DialogClose className="ring-offset-background data-[state=open]:bg-accent data-[state=open]:text-muted-foreground focus:ring-ring absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none">
|
<DialogClose className="absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
|
||||||
<X className="size-4" />
|
<X className="size-4" />
|
||||||
<span className="sr-only">Close</span>
|
<span className="sr-only">Close</span>
|
||||||
</DialogClose>
|
</DialogClose>
|
||||||
|
|
@ -178,10 +178,10 @@ const InnerDialogContent = forwardRef<
|
||||||
<DialogPortal>
|
<DialogPortal>
|
||||||
<DialogPrimitive.Content
|
<DialogPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-background fixed top-[50%] left-[50%] z-[60] grid w-full max-w-lg translate-x-[-50%] translate-y-[-45%] gap-4 rounded-lg border p-6 shadow-lg duration-200",
|
"fixed top-[50%] left-[50%] z-[60] grid w-full max-w-lg translate-x-[-50%] translate-y-[-45%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200",
|
||||||
isClosingByDrag
|
isClosingByDrag
|
||||||
? "data-[state=closed]:fade-out-0 data-[state=closed]:animate-none"
|
? "data-[state=closed]:fade-out-0 data-[state=closed]:animate-none"
|
||||||
: "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
|
: "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
position === "default" &&
|
position === "default" &&
|
||||||
"data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
|
"data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
|
||||||
position === "bottom" &&
|
position === "bottom" &&
|
||||||
|
|
@ -206,7 +206,7 @@ const InnerDialogContent = forwardRef<
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
<div ref={contentRef}>{children}</div>
|
<div ref={contentRef}>{children}</div>
|
||||||
<InnerDialogClose className="ring-offset-background data-[state=open]:bg-accent data-[state=open]:text-muted-foreground focus:ring-ring absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none">
|
<InnerDialogClose className="absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
|
||||||
<X className="size-4" />
|
<X className="size-4" />
|
||||||
<span className="sr-only">Close</span>
|
<span className="sr-only">Close</span>
|
||||||
</InnerDialogClose>
|
</InnerDialogClose>
|
||||||
|
|
@ -248,7 +248,7 @@ const InnerDialogTitle = forwardRef<
|
||||||
>(({ className, ...props }, ref) => (
|
>(({ className, ...props }, ref) => (
|
||||||
<DialogPrimitive.Title
|
<DialogPrimitive.Title
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-lg leading-none font-semibold tracking-tight",
|
"font-semibold text-lg leading-none tracking-tight",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
ref={ref}
|
ref={ref}
|
||||||
|
|
@ -300,7 +300,7 @@ const DialogTitle = forwardRef<
|
||||||
>(({ className, ...props }, ref) => (
|
>(({ className, ...props }, ref) => (
|
||||||
<DialogPrimitive.Title
|
<DialogPrimitive.Title
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-lg leading-none font-semibold tracking-tight",
|
"font-semibold text-lg leading-none tracking-tight",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
ref={ref}
|
ref={ref}
|
||||||
|
|
|
||||||
|
|
@ -46,7 +46,7 @@ export const StaggeredFade: React.FC<TextStaggeredFadeProps> = ({
|
||||||
<motion.h2
|
<motion.h2
|
||||||
animate={isInView ? (!hide ? "show" : "hidden") : ""}
|
animate={isInView ? (!hide ? "show" : "hidden") : ""}
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-center text-xl font-bold tracking-tighter md:leading-[4rem]",
|
"text-center font-bold text-xl tracking-tighter md:leading-[4rem]",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
initial="hidden"
|
initial="hidden"
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@ const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
|
||||||
return (
|
return (
|
||||||
<textarea
|
<textarea
|
||||||
className={cn(
|
className={cn(
|
||||||
`border-border bg-background hover:border-muted-foreground focus:border-foreground focus:ring-foreground flex min-h-[80px] w-full rounded-lg border px-3 py-2 shadow-sm outline-hidden transition-all duration-200 disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-500 dark:placeholder:text-neutral-400 dark:hover:border-neutral-400 dark:focus:border-transparent`,
|
`flex min-h-[80px] w-full rounded-lg border border-border bg-background px-3 py-2 shadow-sm outline-hidden transition-all duration-200 hover:border-muted-foreground focus:border-foreground focus:ring-foreground disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-500 dark:focus:border-transparent dark:hover:border-neutral-400 dark:placeholder:text-neutral-400`,
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
ref={ref}
|
ref={ref}
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@ export const DocNotFoundPage = () => {
|
||||||
<div className="flex min-h-[60vh] w-full items-center justify-center">
|
<div className="flex min-h-[60vh] w-full items-center justify-center">
|
||||||
<div className="max-w-lg space-y-5 rounded-xl border bg-white p-10 text-center shadow-lg">
|
<div className="max-w-lg space-y-5 rounded-xl border bg-white p-10 text-center shadow-lg">
|
||||||
<MissingFile className="mx-auto mb-4 size-32 fill-indigo-600" />
|
<MissingFile className="mx-auto mb-4 size-32 fill-indigo-600" />
|
||||||
<h1 className="mb-2 text-3xl font-extrabold text-indigo-600">
|
<h1 className="mb-2 font-extrabold text-3xl text-indigo-600">
|
||||||
{t.doc_not_found.titolo}
|
{t.doc_not_found.titolo}
|
||||||
</h1>
|
</h1>
|
||||||
<p className="text-muted-foreground">{t.doc_not_found.sottotitolo}</p>
|
<p className="text-muted-foreground">{t.doc_not_found.sottotitolo}</p>
|
||||||
|
|
|
||||||
|
|
@ -163,7 +163,7 @@ export const Etichetta = ({
|
||||||
return (
|
return (
|
||||||
<span
|
<span
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex w-fit items-center justify-center rounded-md px-1.5 text-sm whitespace-nowrap select-none",
|
"flex w-fit select-none items-center justify-center whitespace-nowrap rounded-md px-1.5 text-sm",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
style={{
|
style={{
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@ export default function FailedAnnuncioLoading() {
|
||||||
<div className="mx-auto flex h-screen max-w-screen-xl items-center justify-start px-4 md:px-8">
|
<div className="mx-auto flex h-screen max-w-screen-xl items-center justify-start px-4 md:px-8">
|
||||||
<div className="mx-auto max-w-lg space-y-3 text-center">
|
<div className="mx-auto max-w-lg space-y-3 text-center">
|
||||||
<HomeIcon className="mx-auto size-20 text-rose-700" />
|
<HomeIcon className="mx-auto size-20 text-rose-700" />
|
||||||
<h3 className="text-accent-foreground text-4xl font-semibold sm:text-5xl">
|
<h3 className="font-semibold text-4xl text-accent-foreground sm:text-5xl">
|
||||||
{t.annuncio_load_fail.titolo}
|
{t.annuncio_load_fail.titolo}
|
||||||
</h3>
|
</h3>
|
||||||
<p className="text-neutral-600">{t.annuncio_load_fail.sottotitolo}</p>
|
<p className="text-neutral-600">{t.annuncio_load_fail.sottotitolo}</p>
|
||||||
|
|
|
||||||
|
|
@ -6,12 +6,12 @@ export const Footer = () => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
return (
|
return (
|
||||||
<div className="mt-auto">
|
<div className="mt-auto">
|
||||||
<footer className="bg-muted text-muted-foreground bottom-0 z-40 w-full">
|
<footer className="bottom-0 z-40 w-full bg-muted text-muted-foreground">
|
||||||
<div className="mx-auto max-w-6xl px-4 py-6 sm:px-6 lg:px-8">
|
<div className="mx-auto max-w-6xl px-4 py-6 sm:px-6 lg:px-8">
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<Link
|
<Link
|
||||||
aria-label="footerLogo"
|
aria-label="footerLogo"
|
||||||
className="flex items-center justify-center text-3xl font-bold tracking-wide antialiased"
|
className="flex items-center justify-center font-bold text-3xl tracking-wide antialiased"
|
||||||
href="/"
|
href="/"
|
||||||
>
|
>
|
||||||
<LogoSvg className="h-12 w-auto [&>g]:fill-red-500 dark:[&>g]:fill-neutral-100 [&>text]:fill-neutral-600 [&>text]:stroke-neutral-600 dark:[&>text]:fill-neutral-100 dark:[&>text]:stroke-neutral-100" />
|
<LogoSvg className="h-12 w-auto [&>g]:fill-red-500 dark:[&>g]:fill-neutral-100 [&>text]:fill-neutral-600 [&>text]:stroke-neutral-600 dark:[&>text]:fill-neutral-100 dark:[&>text]:stroke-neutral-100" />
|
||||||
|
|
@ -77,12 +77,12 @@ export const MiniFooter = () => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
return (
|
return (
|
||||||
<div className="mt-auto flex w-full">
|
<div className="mt-auto flex w-full">
|
||||||
<footer className="dark:bg-primary z-40 w-full bg-neutral-100 text-neutral-700 dark:text-white">
|
<footer className="z-40 w-full bg-neutral-100 text-neutral-700 dark:bg-primary dark:text-white">
|
||||||
<div className="mx-auto max-w-5xl px-2 py-2 sm:px-6 lg:px-8">
|
<div className="mx-auto max-w-5xl px-2 py-2 sm:px-6 lg:px-8">
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<Link
|
<Link
|
||||||
aria-label="footerLogo"
|
aria-label="footerLogo"
|
||||||
className="text-2xl font-bold tracking-wide antialiased"
|
className="font-bold text-2xl tracking-wide antialiased"
|
||||||
href="/"
|
href="/"
|
||||||
>
|
>
|
||||||
Infoalloggi.it
|
Infoalloggi.it
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@ export const LoadingPage = () => {
|
||||||
return (
|
return (
|
||||||
<div className="flex h-full max-h-full w-full animate-pulse items-center justify-center py-20">
|
<div className="flex h-full max-h-full w-full animate-pulse items-center justify-center py-20">
|
||||||
<div className="relative flex size-40 animate-spin items-center justify-center rounded-full border-8 border-gray-300 border-t-red-400 text-4xl text-red-400"></div>
|
<div className="relative flex size-40 animate-spin items-center justify-center rounded-full border-8 border-gray-300 border-t-red-400 text-4xl text-red-400"></div>
|
||||||
<ASvg className="absolute size-24 -translate-y-2" />
|
<ASvg className="-translate-y-2 absolute size-24" />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -89,7 +89,7 @@ export default function MapMarker({
|
||||||
{/* Triangle part */}
|
{/* Triangle part */}
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"h-0 w-0 border-solid border-transparent",
|
"h-0 w-0 border-transparent border-solid",
|
||||||
sizeClasses[size].triangle,
|
sizeClasses[size].triangle,
|
||||||
colorClasses[color].triangle,
|
colorClasses[color].triangle,
|
||||||
)}
|
)}
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,7 @@ export const LangToggle = () => {
|
||||||
return (
|
return (
|
||||||
<LoadingButton
|
<LoadingButton
|
||||||
aria-label="Change Language"
|
aria-label="Change Language"
|
||||||
className="text-primary flex w-fit items-center gap-2"
|
className="flex w-fit items-center gap-2 text-primary"
|
||||||
loading={busy}
|
loading={busy}
|
||||||
onClick={() => handleLangChange(locale === "it" ? "en" : "it")}
|
onClick={() => handleLangChange(locale === "it" ? "en" : "it")}
|
||||||
variant="outline"
|
variant="outline"
|
||||||
|
|
|
||||||
|
|
@ -105,7 +105,7 @@ export const UserHeaderSection = ({
|
||||||
<>
|
<>
|
||||||
<DropdownMenuLabel className="font-normal">
|
<DropdownMenuLabel className="font-normal">
|
||||||
<div className="flex flex-col space-y-1">
|
<div className="flex flex-col space-y-1">
|
||||||
<p className="text-sm leading-none font-medium">
|
<p className="font-medium text-sm leading-none">
|
||||||
{session.user.username}
|
{session.user.username}
|
||||||
</p>
|
</p>
|
||||||
<p className="text-muted-foreground text-xs leading-none">
|
<p className="text-muted-foreground text-xs leading-none">
|
||||||
|
|
@ -134,7 +134,7 @@ export const UserHeaderSection = ({
|
||||||
<>
|
<>
|
||||||
<DropdownMenuLabel className="font-normal">
|
<DropdownMenuLabel className="font-normal">
|
||||||
<div className="flex flex-col space-y-1">
|
<div className="flex flex-col space-y-1">
|
||||||
<p className="text-sm leading-none font-medium">
|
<p className="font-medium text-sm leading-none">
|
||||||
{session.user.username}
|
{session.user.username}
|
||||||
</p>
|
</p>
|
||||||
<p className="text-muted-foreground text-xs leading-none">
|
<p className="text-muted-foreground text-xs leading-none">
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,7 @@ export function MainNav({ pathname }: MainNavProps) {
|
||||||
className="flex shrink-0 items-center font-medium md:mb-0"
|
className="flex shrink-0 items-center font-medium md:mb-0"
|
||||||
href="/"
|
href="/"
|
||||||
>
|
>
|
||||||
<LogoSvg className="[&>text]:fill-primary [&>text]:stroke-primary h-8 w-auto [&>g]:fill-red-500" />
|
<LogoSvg className="h-8 w-auto [&>g]:fill-red-500 [&>text]:fill-primary [&>text]:stroke-primary" />
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
<nav className="flex items-center gap-4 text-lg tracking-wide lg:gap-6">
|
<nav className="flex items-center gap-4 text-lg tracking-wide lg:gap-6">
|
||||||
|
|
@ -25,7 +25,7 @@ export function MainNav({ pathname }: MainNavProps) {
|
||||||
<Link
|
<Link
|
||||||
aria-label={item.title}
|
aria-label={item.title}
|
||||||
className={cn(
|
className={cn(
|
||||||
"hover:text-primary/80 transition-colors",
|
"transition-colors hover:text-primary/80",
|
||||||
pathname === item.href ? "text-primary" : "text-primary/70",
|
pathname === item.href ? "text-primary" : "text-primary/70",
|
||||||
)}
|
)}
|
||||||
href={item.href}
|
href={item.href}
|
||||||
|
|
|
||||||
|
|
@ -68,7 +68,7 @@ export function MobileNav({
|
||||||
onOpenChange={setOpen}
|
onOpenChange={setOpen}
|
||||||
>
|
>
|
||||||
<Home className="size-6" />{" "}
|
<Home className="size-6" />{" "}
|
||||||
<span className="text-xl font-medium">Home</span>
|
<span className="font-medium text-xl">Home</span>
|
||||||
</MobileLink>
|
</MobileLink>
|
||||||
|
|
||||||
<div className="flex h-full flex-col space-y-2 pt-4">
|
<div className="flex h-full flex-col space-y-2 pt-4">
|
||||||
|
|
@ -85,7 +85,7 @@ export function MobileNav({
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className="text-primary flex h-full grow flex-col gap-3">
|
<div className="flex h-full grow flex-col gap-3 text-primary">
|
||||||
{t.nav.mainNav.map((item) => (
|
{t.nav.mainNav.map((item) => (
|
||||||
<MobileLink
|
<MobileLink
|
||||||
className={cn(
|
className={cn(
|
||||||
|
|
@ -132,7 +132,7 @@ export function MobileNav({
|
||||||
{verySmallScreen ? (
|
{verySmallScreen ? (
|
||||||
<ASvg className="h-8 w-auto" />
|
<ASvg className="h-8 w-auto" />
|
||||||
) : (
|
) : (
|
||||||
<LogoSvg className="xs:h-8 [&>text]:fill-primary [&>text]:stroke-primary h-6 w-auto text-neutral-700 sm:h-10 [&>g]:fill-red-500 dark:[&>g]:fill-neutral-100 dark:[&>text]:fill-neutral-100 dark:[&>text]:stroke-neutral-100" />
|
<LogoSvg className="h-6 xs:h-8 w-auto text-neutral-700 sm:h-10 [&>g]:fill-red-500 dark:[&>g]:fill-neutral-100 [&>text]:fill-primary [&>text]:stroke-primary dark:[&>text]:fill-neutral-100 dark:[&>text]:stroke-neutral-100" />
|
||||||
)}
|
)}
|
||||||
</Link>
|
</Link>
|
||||||
</>
|
</>
|
||||||
|
|
@ -189,7 +189,7 @@ const AreaRiservataLinks = ({
|
||||||
}: AreaRiservataLinksProps) => {
|
}: AreaRiservataLinksProps) => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
return (
|
return (
|
||||||
<div className="text-primary flex flex-col space-y-4 text-base">
|
<div className="flex flex-col space-y-4 text-base text-primary">
|
||||||
{isAdmin
|
{isAdmin
|
||||||
? t.nav.areaRiservataAdminNav.map((item) => {
|
? t.nav.areaRiservataAdminNav.map((item) => {
|
||||||
if (item.items !== undefined) {
|
if (item.items !== undefined) {
|
||||||
|
|
@ -211,7 +211,7 @@ const AreaRiservataLinks = ({
|
||||||
return (
|
return (
|
||||||
<MobileLink
|
<MobileLink
|
||||||
className={cn(
|
className={cn(
|
||||||
`hover:text-accent-foreground mx-4 block w-full border-l px-6 py-2 duration-150 hover:border-neutral-800`,
|
`mx-4 block w-full border-l px-6 py-2 duration-150 hover:border-neutral-800 hover:text-accent-foreground`,
|
||||||
item.href === pathname &&
|
item.href === pathname &&
|
||||||
"border-neutral-900 text-neutral-900",
|
"border-neutral-900 text-neutral-900",
|
||||||
)}
|
)}
|
||||||
|
|
@ -276,7 +276,7 @@ export const ARMinimizableLinks = ({
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-primary flex w-full flex-col space-y-4 text-base",
|
"flex w-full flex-col space-y-4 text-base text-primary",
|
||||||
minimized && "justify-center",
|
minimized && "justify-center",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|
@ -302,7 +302,7 @@ export const ARMinimizableLinks = ({
|
||||||
return (
|
return (
|
||||||
<MobileLink
|
<MobileLink
|
||||||
className={cn(
|
className={cn(
|
||||||
`hover:text-accent-foreground mx-4 block w-full border-l px-6 py-2 duration-150 hover:border-neutral-800`,
|
`mx-4 block w-full border-l px-6 py-2 duration-150 hover:border-neutral-800 hover:text-accent-foreground`,
|
||||||
item.href === pathname &&
|
item.href === pathname &&
|
||||||
"border-neutral-900 text-neutral-900",
|
"border-neutral-900 text-neutral-900",
|
||||||
minimized && "hidden",
|
minimized && "hidden",
|
||||||
|
|
|
||||||
|
|
@ -37,7 +37,7 @@ export function RicercaCommand() {
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<div className="relative mx-auto flex w-full gap-2">
|
<div className="relative mx-auto flex w-full gap-2">
|
||||||
<CodiceBox
|
<CodiceBox
|
||||||
className="outline-foreground focus:ring-foreground rounded-none rounded-t-md outline placeholder:text-center focus:border-none focus:outline-hidden"
|
className="rounded-none rounded-t-md outline outline-foreground placeholder:text-center focus:border-none focus:outline-hidden focus:ring-foreground"
|
||||||
key={"codiceBox"}
|
key={"codiceBox"}
|
||||||
optionBoxClassName="rounded-none rounded-b-md mt-0 border-b-0 border-x-0"
|
optionBoxClassName="rounded-none rounded-b-md mt-0 border-b-0 border-x-0"
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ export function SiteHeader() {
|
||||||
setOpenSidebar(status);
|
setOpenSidebar(status);
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<header className="border-border/40 bg-background/95 supports-[backdrop-filter]:bg-background/60 sticky top-0 z-50 w-full border-b backdrop-blur">
|
<header className="sticky top-0 z-50 w-full border-border/40 border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
|
||||||
<div className="mx-auto flex h-14 w-full items-center pr-3 pl-4 md:pr-4 md:pl-8">
|
<div className="mx-auto flex h-14 w-full items-center pr-3 pl-4 md:pr-4 md:pl-8">
|
||||||
<MainNav pathname={pathname} />
|
<MainNav pathname={pathname} />
|
||||||
<MobileNav
|
<MobileNav
|
||||||
|
|
|
||||||
|
|
@ -46,8 +46,8 @@ export default function PaymentStatus({
|
||||||
<Icon className="size-8" />
|
<Icon className="size-8" />
|
||||||
</div>
|
</div>
|
||||||
<div className="ml-3">
|
<div className="ml-3">
|
||||||
<h3 className={`text-sm font-medium ${color}`}>{title}</h3>
|
<h3 className={`font-medium text-sm ${color}`}>{title}</h3>
|
||||||
{message && <div className="mt-2 text-sm text-gray-700">{message}</div>}
|
{message && <div className="mt-2 text-gray-700 text-sm">{message}</div>}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
||||||
|
|
@ -52,11 +52,11 @@ export const PDFViewer = ({ url }: { url: string }) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="w-full flex justify-center outline mx-1 shadow-lg rounded-md overflow-clip"
|
className="mx-1 flex w-full justify-center overflow-clip rounded-md shadow-lg outline"
|
||||||
ref={containerRef}
|
ref={containerRef}
|
||||||
>
|
>
|
||||||
<Document
|
<Document
|
||||||
className={"overflow-auto aspect-[1/1.4142]"}
|
className={"aspect-[1/1.4142] overflow-auto"}
|
||||||
file={file}
|
file={file}
|
||||||
loading={<LoadingPage />}
|
loading={<LoadingPage />}
|
||||||
noData={
|
noData={
|
||||||
|
|
|
||||||
|
|
@ -38,7 +38,7 @@ const PhoneInput: React.ForwardRefExoticComponent<PhoneInputProps> = React.memo(
|
||||||
return (
|
return (
|
||||||
<RPNInput.default
|
<RPNInput.default
|
||||||
className={cn(
|
className={cn(
|
||||||
"[&_input]:ph-input-fix flex h-auto w-full flex-1 [&_*]:!h-auto",
|
"[&_input]:ph-input-fix [&_*]:!h-auto flex h-auto w-full flex-1",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
countrySelectComponent={CountrySelect}
|
countrySelectComponent={CountrySelect}
|
||||||
|
|
|
||||||
|
|
@ -35,18 +35,18 @@ export const PricingChoice = () => {
|
||||||
}));
|
}));
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="text-primary flex flex-col items-center justify-center gap-4">
|
<div className="flex flex-col items-center justify-center gap-4 text-primary">
|
||||||
<h2 className="text-3xl font-semibold">Scegli il tuo servizio</h2>
|
<h2 className="font-semibold text-3xl">Scegli il tuo servizio</h2>
|
||||||
<Tabs className="mb-2 w-full max-w-xl" defaultValue="transitorio">
|
<Tabs className="mb-2 w-full max-w-xl" defaultValue="transitorio">
|
||||||
<TabsList className="flex h-auto w-full items-center justify-between gap-1 p-1">
|
<TabsList className="flex h-auto w-full items-center justify-between gap-1 p-1">
|
||||||
<TabsTrigger
|
<TabsTrigger
|
||||||
className="bg-transitorio [&[data-state=active]]:bg-transitorio w-full cursor-pointer px-2 text-xl sm:px-3"
|
className="w-full cursor-pointer bg-transitorio px-2 text-xl sm:px-3 [&[data-state=active]]:bg-transitorio"
|
||||||
value="transitorio"
|
value="transitorio"
|
||||||
>
|
>
|
||||||
Transitorio
|
Transitorio
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
<TabsTrigger
|
<TabsTrigger
|
||||||
className="bg-stabile [&[data-state=active]]:bg-stabile w-full cursor-pointer px-2 text-xl sm:px-3"
|
className="w-full cursor-pointer bg-stabile px-2 text-xl sm:px-3 [&[data-state=active]]:bg-stabile"
|
||||||
value="stabile"
|
value="stabile"
|
||||||
>
|
>
|
||||||
Stabile
|
Stabile
|
||||||
|
|
@ -140,36 +140,36 @@ export const PricingComponent = ({
|
||||||
return (
|
return (
|
||||||
<Card className={cn("w-full max-w-xl gap-4 py-4", className)}>
|
<Card className={cn("w-full max-w-xl gap-4 py-4", className)}>
|
||||||
<CardHeader className="py-2">
|
<CardHeader className="py-2">
|
||||||
<CardTitle className="pt-1 text-center text-3xl font-semibold">
|
<CardTitle className="pt-1 text-center font-semibold text-3xl">
|
||||||
{title}
|
{title}
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
<CardDescription className="sr-only">
|
<CardDescription className="sr-only">
|
||||||
Prezzo del servizio
|
Prezzo del servizio
|
||||||
</CardDescription>
|
</CardDescription>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent className="xs:px-6 flex w-full flex-col items-center justify-center gap-4 p-0 px-2 py-0 sm:gap-6 sm:py-4">
|
<CardContent className="flex w-full flex-col items-center justify-center gap-4 p-0 px-2 xs:px-6 py-0 sm:gap-6 sm:py-4">
|
||||||
<div
|
<div
|
||||||
className="xs:gap-x-4 xs:gap-y-1 flex w-full items-center justify-center gap-0"
|
className="flex w-full items-center justify-center gap-0 xs:gap-x-4 xs:gap-y-1"
|
||||||
data-role="wrapper"
|
data-role="wrapper"
|
||||||
>
|
>
|
||||||
<div className="xs:w-1/3 flex w-2/5 flex-col items-center gap-2">
|
<div className="flex w-2/5 xs:w-1/3 flex-col items-center gap-2">
|
||||||
<h2 className="text-2xl font-semibold" data-role="title">
|
<h2 className="font-semibold text-2xl" data-role="title">
|
||||||
{t.acconto}
|
{t.acconto}
|
||||||
</h2>
|
</h2>
|
||||||
<p
|
<p
|
||||||
className="xs:text-3xl text-2xl font-semibold sm:text-6xl"
|
className="font-semibold text-2xl xs:text-3xl sm:text-6xl"
|
||||||
data-role="amount"
|
data-role="amount"
|
||||||
>
|
>
|
||||||
{downPayment}€
|
{downPayment}€
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="xs:w-1/3 flex w-2/5 flex-col items-center gap-2 text-center">
|
<div className="flex w-2/5 xs:w-1/3 flex-col items-center gap-2 text-center">
|
||||||
<h2 className="text-2xl font-semibold" data-role="title">
|
<h2 className="font-semibold text-2xl" data-role="title">
|
||||||
{t.saldo}
|
{t.saldo}
|
||||||
</h2>
|
</h2>
|
||||||
<p
|
<p
|
||||||
className="xs:text-3xl text-2xl font-semibold sm:text-6xl"
|
className="font-semibold text-2xl xs:text-3xl sm:text-6xl"
|
||||||
data-role="amount"
|
data-role="amount"
|
||||||
>
|
>
|
||||||
<AnimatedNumber
|
<AnimatedNumber
|
||||||
|
|
@ -180,15 +180,15 @@ export const PricingComponent = ({
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="xs:w-1/3 flex w-2/5 flex-col items-center gap-2 text-center">
|
<div className="flex w-2/5 xs:w-1/3 flex-col items-center gap-2 text-center">
|
||||||
<h2 className="text-2xl font-semibold" data-role="title">
|
<h2 className="font-semibold text-2xl" data-role="title">
|
||||||
Contratto
|
Contratto
|
||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
{tipo === TipologiaPosizioneEnum.Transitorio ? (
|
{tipo === TipologiaPosizioneEnum.Transitorio ? (
|
||||||
<div className="flex flex-col justify-center leading-none">
|
<div className="flex flex-col justify-center leading-none">
|
||||||
<span
|
<span
|
||||||
className="xs:text-3xl text-2xl font-semibold sm:text-6xl"
|
className="font-semibold text-2xl xs:text-3xl sm:text-6xl"
|
||||||
data-role="amount"
|
data-role="amount"
|
||||||
>
|
>
|
||||||
0 €
|
0 €
|
||||||
|
|
@ -210,8 +210,8 @@ export const PricingComponent = ({
|
||||||
{opzioni.map((opzione, idx) => (
|
{opzioni.map((opzione, idx) => (
|
||||||
<Button
|
<Button
|
||||||
className={cn(
|
className={cn(
|
||||||
"xs:h-10 xs:px-4 xs:py-2 h-9 rounded-md border-none px-3",
|
"h-9 xs:h-10 rounded-md border-none px-3 xs:px-4 xs:py-2",
|
||||||
idx === Value ? "animate-in fade-in-0" : "",
|
idx === Value ? "fade-in-0 animate-in" : "",
|
||||||
)}
|
)}
|
||||||
key={idx}
|
key={idx}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
|
|
@ -225,7 +225,7 @@ export const PricingComponent = ({
|
||||||
</Button>
|
</Button>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-center text-xl font-semibold text-white">{cta}</h2>
|
<h2 className="text-center font-semibold text-white text-xl">{cta}</h2>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
);
|
);
|
||||||
|
|
@ -271,17 +271,17 @@ export const PricingComponentConsulenza = ({
|
||||||
return (
|
return (
|
||||||
<Card className={cn("w-full max-w-xl", className)}>
|
<Card className={cn("w-full max-w-xl", className)}>
|
||||||
<CardHeader className="p-3 px-5">
|
<CardHeader className="p-3 px-5">
|
||||||
<CardTitle className="pt-1 text-center text-3xl font-semibold">
|
<CardTitle className="pt-1 text-center font-semibold text-3xl">
|
||||||
{title}
|
{title}
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
<CardDescription className="sr-only">
|
<CardDescription className="sr-only">
|
||||||
Prezzo del servizio
|
Prezzo del servizio
|
||||||
</CardDescription>
|
</CardDescription>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent className="xs:px-6 flex flex-col items-center justify-center gap-8 p-0 px-2 pt-4 pb-4">
|
<CardContent className="flex flex-col items-center justify-center gap-8 p-0 px-2 xs:px-6 pt-4 pb-4">
|
||||||
<div className="xs:gap-4 flex w-full items-center justify-center gap-0">
|
<div className="flex w-full items-center justify-center gap-0 xs:gap-4">
|
||||||
<div className="flex flex-col items-center gap-2">
|
<div className="flex flex-col items-center gap-2">
|
||||||
<p className="xs:text-6xl text-3xl font-semibold">
|
<p className="font-semibold text-3xl xs:text-6xl">
|
||||||
<AnimatedNumber format={customFormat} value={p || 0} />
|
<AnimatedNumber format={customFormat} value={p || 0} />
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -290,8 +290,8 @@ export const PricingComponentConsulenza = ({
|
||||||
{opzioni.map((opzione, idx) => (
|
{opzioni.map((opzione, idx) => (
|
||||||
<Button
|
<Button
|
||||||
className={cn(
|
className={cn(
|
||||||
"xs:h-10 xs:px-4 xs:py-2 h-9 rounded-md border-none px-3",
|
"h-9 xs:h-10 rounded-md border-none px-3 xs:px-4 xs:py-2",
|
||||||
idx === Value ? "animate-in fade-in-0" : "",
|
idx === Value ? "fade-in-0 animate-in" : "",
|
||||||
)}
|
)}
|
||||||
key={idx}
|
key={idx}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
|
|
@ -305,7 +305,7 @@ export const PricingComponentConsulenza = ({
|
||||||
</Button>
|
</Button>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
<h2 className="text-center text-xl font-semibold text-white">{cta}</h2>
|
<h2 className="text-center font-semibold text-white text-xl">{cta}</h2>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
);
|
);
|
||||||
|
|
@ -328,12 +328,12 @@ export const PrezziShow = () => {
|
||||||
secondPayment: s.prezzo_cent / 100,
|
secondPayment: s.prezzo_cent / 100,
|
||||||
}));
|
}));
|
||||||
return (
|
return (
|
||||||
<div className="text-primary mx-auto flex w-full flex-col items-center justify-center gap-8 py-6 sm:max-w-5xl sm:flex-row">
|
<div className="mx-auto flex w-full flex-col items-center justify-center gap-8 py-6 text-primary sm:max-w-5xl sm:flex-row">
|
||||||
<div className="flex w-full flex-col gap-2 text-start sm:w-2/5 sm:text-left">
|
<div className="flex w-full flex-col gap-2 text-start sm:w-2/5 sm:text-left">
|
||||||
<h1 className="text-primary text-3xl font-bold">
|
<h1 className="font-bold text-3xl text-primary">
|
||||||
Quanto costa il servizio?
|
Quanto costa il servizio?
|
||||||
</h1>
|
</h1>
|
||||||
<p className="text-muted-foreground text-lg">
|
<p className="text-lg text-muted-foreground">
|
||||||
Il nostro servizio è pensato per essere accessibile e conveniente, con
|
Il nostro servizio è pensato per essere accessibile e conveniente, con
|
||||||
tariffe chiare e senza sorprese. Basate sul tipo di affitto che
|
tariffe chiare e senza sorprese. Basate sul tipo di affitto che
|
||||||
desideri, le nostre tariffe sono suddivise in due categorie
|
desideri, le nostre tariffe sono suddivise in due categorie
|
||||||
|
|
|
||||||
|
|
@ -24,7 +24,7 @@ export function SchedaAnnuncioStampabile({ data }: { data: Annunci }) {
|
||||||
<div className="mx-auto max-w-4xl">
|
<div className="mx-auto max-w-4xl">
|
||||||
<div className="space-y-6">
|
<div className="space-y-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<h1 className="text-2xl font-bold">Scheda Annuncio Stampabile</h1>
|
<h1 className="font-bold text-2xl">Scheda Annuncio Stampabile</h1>
|
||||||
|
|
||||||
<Button className="print:hidden" onClick={() => reactToPrintFn()}>
|
<Button className="print:hidden" onClick={() => reactToPrintFn()}>
|
||||||
Stampa
|
Stampa
|
||||||
|
|
@ -49,19 +49,19 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
<div className="space-y-6">
|
<div className="space-y-6">
|
||||||
<div className="flex items-start justify-between">
|
<div className="flex items-start justify-between">
|
||||||
<div>
|
<div>
|
||||||
<LogoSvg className="[&>text]:fill-primary [&>text]:stroke-primary h-10 w-auto [&>g]:fill-red-500" />
|
<LogoSvg className="h-10 w-auto [&>g]:fill-red-500 [&>text]:fill-primary [&>text]:stroke-primary" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<p className="font-semibold text-lg text-right">Arcenia Srl</p>
|
<p className="text-right font-semibold text-lg">Arcenia Srl</p>
|
||||||
<p className="text-sm whitespace-pre-line text-right">
|
<p className="whitespace-pre-line text-right text-sm">
|
||||||
{companyAddress}
|
{companyAddress}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{/* Property Header */}
|
{/* Property Header */}
|
||||||
<div className="space-y-2 text-center">
|
<div className="space-y-2 text-center">
|
||||||
<h2 className="text-xl font-bold text-primary">
|
<h2 className="font-bold text-primary text-xl">
|
||||||
{data.titolo_it || "Immobile in Affitto"}
|
{data.titolo_it || "Immobile in Affitto"}
|
||||||
</h2>
|
</h2>
|
||||||
<p className="text-lg text-muted-foreground">
|
<p className="text-lg text-muted-foreground">
|
||||||
|
|
@ -73,7 +73,7 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
<div className="grid grid-cols-2 gap-6">
|
<div className="grid grid-cols-2 gap-6">
|
||||||
{/* Location Details */}
|
{/* Location Details */}
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
<h3 className="text-lg font-semibold border-b pb-1">
|
<h3 className="border-b pb-1 font-semibold text-lg">
|
||||||
📍 Ubicazione
|
📍 Ubicazione
|
||||||
</h3>
|
</h3>
|
||||||
<div className="space-y-2 text-sm">
|
<div className="space-y-2 text-sm">
|
||||||
|
|
@ -99,7 +99,7 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
|
|
||||||
{/* Property Characteristics */}
|
{/* Property Characteristics */}
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
<h3 className="text-lg font-semibold border-b pb-1">
|
<h3 className="border-b pb-1 font-semibold text-lg">
|
||||||
🏠 Caratteristiche
|
🏠 Caratteristiche
|
||||||
</h3>
|
</h3>
|
||||||
<div className="space-y-2 text-sm">
|
<div className="space-y-2 text-sm">
|
||||||
|
|
@ -135,23 +135,23 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
<div className="grid grid-cols-3 gap-4 text-sm">
|
<div className="grid grid-cols-3 gap-4 text-sm">
|
||||||
{data.tipo && (
|
{data.tipo && (
|
||||||
<div className="bg-gray-50 p-3 rounded">
|
<div className="rounded bg-gray-50 p-3">
|
||||||
<p className="font-medium text-primary">Tipologia</p>
|
<p className="font-medium text-primary">Tipologia</p>
|
||||||
<p className="text-xl font-bold">Affitto {data.tipo}</p>
|
<p className="font-bold text-xl">Affitto {data.tipo}</p>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{data.prezzo && (
|
{data.prezzo && (
|
||||||
<div className="bg-gray-50 p-3 rounded">
|
<div className="rounded bg-gray-50 p-3">
|
||||||
<p className="font-medium text-primary">Canone Mensile</p>
|
<p className="font-medium text-primary">Canone Mensile</p>
|
||||||
<p className="text-xl font-bold">
|
<p className="font-bold text-xl">
|
||||||
{formatCurrency(data.prezzo / 100)}
|
{formatCurrency(data.prezzo / 100)}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{(data.disponibile_da || data.consegna) && (
|
{(data.disponibile_da || data.consegna) && (
|
||||||
<div className="bg-gray-50 p-3 rounded">
|
<div className="rounded bg-gray-50 p-3">
|
||||||
<p className="font-medium text-primary">Disponibile da</p>
|
<p className="font-medium text-primary">Disponibile da</p>
|
||||||
<p className="text-xl font-bold">
|
<p className="font-bold text-xl">
|
||||||
{data.disponibile_da
|
{data.disponibile_da
|
||||||
? new Date(data.disponibile_da).toLocaleDateString()
|
? new Date(data.disponibile_da).toLocaleDateString()
|
||||||
: data.consegna &&
|
: data.consegna &&
|
||||||
|
|
@ -171,7 +171,7 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
{/* Additional Features */}
|
{/* Additional Features */}
|
||||||
|
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
<h3 className="text-lg font-semibold border-b pb-1">
|
<h3 className="border-b pb-1 font-semibold text-lg">
|
||||||
✨ Dotazioni e Servizi
|
✨ Dotazioni e Servizi
|
||||||
</h3>
|
</h3>
|
||||||
<div className="grid grid-cols-4 gap-2 text-sm">
|
<div className="grid grid-cols-4 gap-2 text-sm">
|
||||||
|
|
@ -181,7 +181,7 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
if (!item.value) return null;
|
if (!item.value) return null;
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="flex items-center gap-2 justify-center"
|
className="flex items-center justify-center gap-2"
|
||||||
key={index}
|
key={index}
|
||||||
>
|
>
|
||||||
<span className="">
|
<span className="">
|
||||||
|
|
@ -196,11 +196,11 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="bg-primary/5 p-4 rounded-lg">
|
<div className="rounded-lg bg-primary/5 p-4">
|
||||||
<h3 className="text-lg font-semibold text-primary mb-2">
|
<h3 className="mb-2 font-semibold text-lg text-primary">
|
||||||
📞 Contatti
|
📞 Contatti
|
||||||
</h3>
|
</h3>
|
||||||
<div className="text-sm space-y-1">
|
<div className="space-y-1 text-sm">
|
||||||
<p>{data.locatore}</p>
|
<p>{data.locatore}</p>
|
||||||
{data.numero && <p>Tel. {data.numero}</p>}
|
{data.numero && <p>Tel. {data.numero}</p>}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -209,10 +209,10 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
{data.desc_it && (
|
{data.desc_it && (
|
||||||
<>
|
<>
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
<h3 className="text-lg font-semibold border-b pb-1">
|
<h3 className="border-b pb-1 font-semibold text-lg">
|
||||||
📝 Descrizione
|
📝 Descrizione
|
||||||
</h3>
|
</h3>
|
||||||
<div className="text-sm leading-relaxed text-justify">
|
<div className="text-justify text-sm leading-relaxed">
|
||||||
<p
|
<p
|
||||||
dangerouslySetInnerHTML={{
|
dangerouslySetInnerHTML={{
|
||||||
__html: replaceWithBr(data.desc_it),
|
__html: replaceWithBr(data.desc_it),
|
||||||
|
|
@ -223,7 +223,7 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className="text-muted-foreground pt-2 text-center text-xs">
|
<div className="pt-2 text-center text-muted-foreground text-xs">
|
||||||
<p>{footer}</p>
|
<p>{footer}</p>
|
||||||
<p className="mt-1">
|
<p className="mt-1">
|
||||||
Documento generato in data: {new Date().toLocaleDateString("it-IT")}
|
Documento generato in data: {new Date().toLocaleDateString("it-IT")}
|
||||||
|
|
|
||||||
|
|
@ -912,7 +912,7 @@ const DocCombo = ({
|
||||||
{file.ext && <ExtIcon ext={file.ext} />}
|
{file.ext && <ExtIcon ext={file.ext} />}
|
||||||
<span className="block font-medium">{file.filename}</span>
|
<span className="block font-medium">{file.filename}</span>
|
||||||
{current === file.id && (
|
{current === file.id && (
|
||||||
<Check className="text-accent-foreground size-4" />
|
<Check className="size-4 text-accent-foreground" />
|
||||||
)}
|
)}
|
||||||
</span>
|
</span>
|
||||||
</CommandItem>
|
</CommandItem>
|
||||||
|
|
|
||||||
|
|
@ -234,14 +234,14 @@ const AnnuncioDettaglio = ({
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<dt className="sr-only">{t.card.codice}</dt>
|
<dt className="sr-only">{t.card.codice}</dt>
|
||||||
|
|
||||||
<dd className="text-lg font-semibold">
|
<dd className="font-semibold text-lg">
|
||||||
Cod: {data.codice}
|
Cod: {data.codice}
|
||||||
</dd>
|
</dd>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<dt className="sr-only">{t.card.prezzo}</dt>
|
<dt className="sr-only">{t.card.prezzo}</dt>
|
||||||
|
|
||||||
<dd className="text-lg font-semibold">
|
<dd className="font-semibold text-lg">
|
||||||
{formatCurrency(data.prezzo / 1e2)}
|
{formatCurrency(data.prezzo / 1e2)}
|
||||||
</dd>
|
</dd>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -250,7 +250,7 @@ const AnnuncioDettaglio = ({
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<dt className="sr-only">{t.card.titolo}</dt>
|
<dt className="sr-only">{t.card.titolo}</dt>
|
||||||
|
|
||||||
<dd className="text-base font-semibold md:text-lg">
|
<dd className="font-semibold text-base md:text-lg">
|
||||||
{locale === "it" ? data.titolo_it : data.titolo_en}
|
{locale === "it" ? data.titolo_it : data.titolo_en}
|
||||||
</dd>
|
</dd>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -589,7 +589,7 @@ const ContattiProprietarioData = () => {
|
||||||
)
|
)
|
||||||
</p>
|
</p>
|
||||||
<a
|
<a
|
||||||
className="border-border flex w-fit items-center gap-2 rounded-md border px-3 py-2"
|
className="flex w-fit items-center gap-2 rounded-md border border-border px-3 py-2"
|
||||||
href={navigationUrl}
|
href={navigationUrl}
|
||||||
rel="noreferrer"
|
rel="noreferrer"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
|
|
|
||||||
|
|
@ -116,7 +116,7 @@ export const ServizioContent = () => {
|
||||||
cardClassName="bg-neutral-100 border-neutral-300"
|
cardClassName="bg-neutral-100 border-neutral-300"
|
||||||
content={
|
content={
|
||||||
<>
|
<>
|
||||||
<p className="text-lg font-medium">Servizio interrotto</p>
|
<p className="font-medium text-lg">Servizio interrotto</p>
|
||||||
<p>
|
<p>
|
||||||
Non è possibile riutilizzare questo servizio, poichè è stato
|
Non è possibile riutilizzare questo servizio, poichè è stato
|
||||||
interrotto.
|
interrotto.
|
||||||
|
|
@ -127,11 +127,11 @@ export const ServizioContent = () => {
|
||||||
<>
|
<>
|
||||||
<div className="flex flex-col gap-4">
|
<div className="flex flex-col gap-4">
|
||||||
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
||||||
<Package className="text-primary size-6" />
|
<Package className="size-6 text-primary" />
|
||||||
Cerco Affitto {servizio.tipologia}
|
Cerco Affitto {servizio.tipologia}
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
|
|
||||||
<CardDescription className="text-foreground/70 space-y-2 pl-2">
|
<CardDescription className="space-y-2 pl-2 text-foreground/70">
|
||||||
<p>
|
<p>
|
||||||
aggiunto il{" "}
|
aggiunto il{" "}
|
||||||
{servizio.created_at.toLocaleDateString("it", {
|
{servizio.created_at.toLocaleDateString("it", {
|
||||||
|
|
@ -268,7 +268,7 @@ export const ServizioContent = () => {
|
||||||
<div className="flex flex-col gap-2">
|
<div className="flex flex-col gap-2">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<UserCircle className="text-primary size-6" />
|
<UserCircle className="size-6 text-primary" />
|
||||||
<span className="font-medium">Contatti sbloccati</span>
|
<span className="font-medium">Contatti sbloccati</span>
|
||||||
</div>
|
</div>
|
||||||
<span className="text-sm">{openContattiCount} / 10</span>
|
<span className="text-sm">{openContattiCount} / 10</span>
|
||||||
|
|
@ -281,7 +281,7 @@ export const ServizioContent = () => {
|
||||||
{annuncioConfermato.length > 0 && (
|
{annuncioConfermato.length > 0 && (
|
||||||
<div className="flex flex-col gap-2">
|
<div className="flex flex-col gap-2">
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<PackageCheck className="text-primary size-6" />
|
<PackageCheck className="size-6 text-primary" />
|
||||||
<span className="font-medium">Saldi in attesa:</span>
|
<span className="font-medium">Saldi in attesa:</span>
|
||||||
</div>
|
</div>
|
||||||
{servizio.annunci
|
{servizio.annunci
|
||||||
|
|
@ -381,7 +381,7 @@ const ServizioMain = () => {
|
||||||
cardClassName="bg-neutral-100 border-neutral-300"
|
cardClassName="bg-neutral-100 border-neutral-300"
|
||||||
content={
|
content={
|
||||||
<>
|
<>
|
||||||
<p className="text-lg font-medium">Servizio interrotto</p>
|
<p className="font-medium text-lg">Servizio interrotto</p>
|
||||||
<p>
|
<p>
|
||||||
Non è possibile riutilizzare questo servizio, poichè è stato
|
Non è possibile riutilizzare questo servizio, poichè è stato
|
||||||
interrotto.
|
interrotto.
|
||||||
|
|
@ -392,11 +392,11 @@ const ServizioMain = () => {
|
||||||
<>
|
<>
|
||||||
<div className="flex flex-col gap-4">
|
<div className="flex flex-col gap-4">
|
||||||
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
||||||
<Package className="text-primary size-6" />
|
<Package className="size-6 text-primary" />
|
||||||
Cerco Affitto {servizio.tipologia}
|
Cerco Affitto {servizio.tipologia}
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
|
|
||||||
<CardDescription className="text-foreground/70 space-y-2 pl-2">
|
<CardDescription className="space-y-2 pl-2 text-foreground/70">
|
||||||
<p>
|
<p>
|
||||||
aggiunto il{" "}
|
aggiunto il{" "}
|
||||||
{servizio.created_at.toLocaleDateString("it", {
|
{servizio.created_at.toLocaleDateString("it", {
|
||||||
|
|
@ -454,10 +454,10 @@ const ServizioMain = () => {
|
||||||
<>
|
<>
|
||||||
<div className="flex w-full flex-col gap-4">
|
<div className="flex w-full flex-col gap-4">
|
||||||
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
||||||
<Package className="text-primary size-6" />
|
<Package className="size-6 text-primary" />
|
||||||
Cerco Affitto {servizio.tipologia}
|
Cerco Affitto {servizio.tipologia}
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
<CardDescription className="text-foreground/70 pl-2">
|
<CardDescription className="pl-2 text-foreground/70">
|
||||||
<p>Servizio non attivo</p>
|
<p>Servizio non attivo</p>
|
||||||
</CardDescription>
|
</CardDescription>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -489,11 +489,11 @@ const ServizioMain = () => {
|
||||||
<>
|
<>
|
||||||
<div className="flex w-full flex-wrap items-center gap-2">
|
<div className="flex w-full flex-wrap items-center gap-2">
|
||||||
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
||||||
<Package className="text-primary size-6" />
|
<Package className="size-6 text-primary" />
|
||||||
Cerco Affitto {servizio.tipologia}
|
Cerco Affitto {servizio.tipologia}
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
|
|
||||||
<CardDescription className="text-foreground/70 space-y-2 pl-2">
|
<CardDescription className="space-y-2 pl-2 text-foreground/70">
|
||||||
<p>
|
<p>
|
||||||
aggiunto il{" "}
|
aggiunto il{" "}
|
||||||
{servizio.created_at.toLocaleDateString("it", {
|
{servizio.created_at.toLocaleDateString("it", {
|
||||||
|
|
@ -530,7 +530,7 @@ const ServizioMain = () => {
|
||||||
<div className="flex flex-col gap-2">
|
<div className="flex flex-col gap-2">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<UserCircle className="text-primary size-6" />
|
<UserCircle className="size-6 text-primary" />
|
||||||
<span className="font-medium">Contatti sbloccati</span>
|
<span className="font-medium">Contatti sbloccati</span>
|
||||||
</div>
|
</div>
|
||||||
<span className="text-sm">{openContattiCount} / 10</span>
|
<span className="text-sm">{openContattiCount} / 10</span>
|
||||||
|
|
@ -543,7 +543,7 @@ const ServizioMain = () => {
|
||||||
{annuncioConfermato.length > 0 && (
|
{annuncioConfermato.length > 0 && (
|
||||||
<div className="flex flex-col gap-2">
|
<div className="flex flex-col gap-2">
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<PackageCheck className="text-primary size-6" />
|
<PackageCheck className="size-6 text-primary" />
|
||||||
<span className="font-medium">Saldi in attesa:</span>
|
<span className="font-medium">Saldi in attesa:</span>
|
||||||
</div>
|
</div>
|
||||||
{servizio.annunci
|
{servizio.annunci
|
||||||
|
|
@ -591,11 +591,11 @@ const ServizioMain = () => {
|
||||||
<>
|
<>
|
||||||
<div className="flex w-full flex-col gap-2">
|
<div className="flex w-full flex-col gap-2">
|
||||||
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
<CardTitle className="flex items-center gap-2 text-xl sm:text-2xl">
|
||||||
<Package className="text-primary size-6" />
|
<Package className="size-6 text-primary" />
|
||||||
Cerco Affitto {servizio.tipologia}
|
Cerco Affitto {servizio.tipologia}
|
||||||
</CardTitle>
|
</CardTitle>
|
||||||
|
|
||||||
<CardDescription className="text-foreground/70 space-y-2 pl-2">
|
<CardDescription className="space-y-2 pl-2 text-foreground/70">
|
||||||
<p>
|
<p>
|
||||||
aggiunto il{" "}
|
aggiunto il{" "}
|
||||||
{servizio.created_at.toLocaleDateString("it", {
|
{servizio.created_at.toLocaleDateString("it", {
|
||||||
|
|
|
||||||
|
|
@ -27,8 +27,8 @@ export const ServizioDuration = ({
|
||||||
>
|
>
|
||||||
<AccordionItem value="validity">
|
<AccordionItem value="validity">
|
||||||
<AccordionTrigger>
|
<AccordionTrigger>
|
||||||
<div className="flex items-center gap-2 text-base font-medium">
|
<div className="flex items-center gap-2 font-medium text-base">
|
||||||
<Clock className="text-primary size-6" />
|
<Clock className="size-6 text-primary" />
|
||||||
Validità servizio
|
Validità servizio
|
||||||
</div>
|
</div>
|
||||||
</AccordionTrigger>
|
</AccordionTrigger>
|
||||||
|
|
@ -70,10 +70,10 @@ function ServiceDurationDisplay({
|
||||||
<CardContent className="flex flex-col gap-5 px-1">
|
<CardContent className="flex flex-col gap-5 px-1">
|
||||||
<div className="flex w-full flex-col justify-between gap-4 sm:flex-row sm:items-center">
|
<div className="flex w-full flex-col justify-between gap-4 sm:flex-row sm:items-center">
|
||||||
<div className="flex items-center gap-4">
|
<div className="flex items-center gap-4">
|
||||||
<CalendarDays aria-hidden="true" className="text-primary h-6 w-6" />
|
<CalendarDays aria-hidden="true" className="h-6 w-6 text-primary" />
|
||||||
<div>
|
<div>
|
||||||
<div className="text-muted-foreground text-sm">Decorrenza</div>
|
<div className="text-muted-foreground text-sm">Decorrenza</div>
|
||||||
<div className="text-foreground text-lg font-semibold">
|
<div className="font-semibold text-foreground text-lg">
|
||||||
{decorrenza.toLocaleDateString("it-IT", {
|
{decorrenza.toLocaleDateString("it-IT", {
|
||||||
day: "2-digit",
|
day: "2-digit",
|
||||||
month: "long",
|
month: "long",
|
||||||
|
|
@ -85,11 +85,11 @@ function ServiceDurationDisplay({
|
||||||
<div className="flex items-center gap-4">
|
<div className="flex items-center gap-4">
|
||||||
<CalendarClock
|
<CalendarClock
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
className="text-primary h-6 w-6"
|
className="h-6 w-6 text-primary"
|
||||||
/>
|
/>
|
||||||
<div>
|
<div>
|
||||||
<div className="text-muted-foreground text-sm">Scadenza</div>
|
<div className="text-muted-foreground text-sm">Scadenza</div>
|
||||||
<div className="text-foreground text-lg font-semibold">
|
<div className="font-semibold text-foreground text-lg">
|
||||||
{scadenza.toLocaleDateString("it-IT", {
|
{scadenza.toLocaleDateString("it-IT", {
|
||||||
day: "2-digit",
|
day: "2-digit",
|
||||||
month: "long",
|
month: "long",
|
||||||
|
|
@ -99,12 +99,12 @@ function ServiceDurationDisplay({
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex items-center gap-4">
|
<div className="flex items-center gap-4">
|
||||||
<Hourglass aria-hidden="true" className="text-primary h-6 w-6" />
|
<Hourglass aria-hidden="true" className="h-6 w-6 text-primary" />
|
||||||
<div>
|
<div>
|
||||||
<div className="text-muted-foreground text-sm">
|
<div className="text-muted-foreground text-sm">
|
||||||
Periodo di recesso
|
Periodo di recesso
|
||||||
</div>
|
</div>
|
||||||
<div className="text-foreground text-lg font-semibold">
|
<div className="font-semibold text-foreground text-lg">
|
||||||
{recessoDays} giorni
|
{recessoDays} giorni
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -118,7 +118,7 @@ function ServiceDurationDisplay({
|
||||||
className="h-2"
|
className="h-2"
|
||||||
value={progressPercentage}
|
value={progressPercentage}
|
||||||
/>
|
/>
|
||||||
<div className="text-muted-foreground mt-1 text-right text-sm">
|
<div className="mt-1 text-right text-muted-foreground text-sm">
|
||||||
{remainingDaysText}
|
{remainingDaysText}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ export const Status500 = () => {
|
||||||
<div className="mx-auto flex h-screen max-w-screen-xl items-center justify-start px-4 md:px-8">
|
<div className="mx-auto flex h-screen max-w-screen-xl items-center justify-start px-4 md:px-8">
|
||||||
<div className="mx-auto max-w-lg space-y-3 text-center">
|
<div className="mx-auto max-w-lg space-y-3 text-center">
|
||||||
<ShieldExclamationIcon className="mx-auto size-20 text-red-600" />
|
<ShieldExclamationIcon className="mx-auto size-20 text-red-600" />
|
||||||
<h3 className="text-accent-foreground text-4xl font-semibold sm:text-5xl">
|
<h3 className="font-semibold text-4xl text-accent-foreground sm:text-5xl">
|
||||||
{t[500].titolo}
|
{t[500].titolo}
|
||||||
</h3>
|
</h3>
|
||||||
<p className="text-neutral-600">{t[500].sottotitolo}</p>
|
<p className="text-neutral-600">{t[500].sottotitolo}</p>
|
||||||
|
|
|
||||||
|
|
@ -69,13 +69,13 @@ const Row = ({
|
||||||
userId={userId}
|
userId={userId}
|
||||||
>
|
>
|
||||||
<Collapsible onOpenChange={setIsOpen} open={isOpen}>
|
<Collapsible onOpenChange={setIsOpen} open={isOpen}>
|
||||||
<div className="border-border flex items-center rounded-md border py-2 shadow-sm hover:shadow-md">
|
<div className="flex items-center rounded-md border border-border py-2 shadow-sm hover:shadow-md">
|
||||||
<CollapsibleTrigger className="grid w-full cursor-pointer grid-cols-10 items-center">
|
<CollapsibleTrigger className="grid w-full cursor-pointer grid-cols-10 items-center">
|
||||||
<div className="col-span-2 sm:col-span-1">
|
<div className="col-span-2 sm:col-span-1">
|
||||||
<span className="text-xl">{isOpen ? "👇" : "👉"}</span>
|
<span className="text-xl">{isOpen ? "👇" : "👉"}</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-6 flex items-center gap-2 font-semibold sm:text-lg">
|
<div className="col-span-6 flex items-center gap-2 font-semibold sm:text-lg">
|
||||||
<Package className="text-primary size-6" />
|
<Package className="size-6 text-primary" />
|
||||||
Affitto {servizio.tipologia}
|
Affitto {servizio.tipologia}
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-2">
|
<div className="col-span-2">
|
||||||
|
|
@ -97,7 +97,7 @@ const Row = ({
|
||||||
</CollapsibleTrigger>
|
</CollapsibleTrigger>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<CollapsibleContent className="data-[state=open]:animate-collapsible-down data-[state=closed]:animate-collapsible-up mt-2 overflow-hidden transition-all duration-300 ease-in-out">
|
<CollapsibleContent className="mt-2 overflow-hidden transition-all duration-300 ease-in-out data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down">
|
||||||
<ServizioProvider
|
<ServizioProvider
|
||||||
isAdmin={isAdmin}
|
isAdmin={isAdmin}
|
||||||
servizio={servizio}
|
servizio={servizio}
|
||||||
|
|
|
||||||
|
|
@ -107,7 +107,6 @@ export const TabServizio = ({
|
||||||
<TableBody>
|
<TableBody>
|
||||||
{data.map((servizio, idx) => {
|
{data.map((servizio, idx) => {
|
||||||
const onboardDone =
|
const onboardDone =
|
||||||
servizio.isSent ||
|
|
||||||
servizio.isInterrotto ||
|
servizio.isInterrotto ||
|
||||||
servizio.isOkAcconto ||
|
servizio.isOkAcconto ||
|
||||||
servizio.decorrenza !== null;
|
servizio.decorrenza !== null;
|
||||||
|
|
@ -173,8 +172,10 @@ export const TabServizio = ({
|
||||||
size="sm"
|
size="sm"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
>
|
>
|
||||||
<Mail className="stroke-foreground size-5" />
|
<Mail className="size-5 stroke-foreground" />
|
||||||
Invia all'utente
|
{servizio.isSent
|
||||||
|
? "Re-Invia all'utente"
|
||||||
|
: "Invia all'utente"}
|
||||||
</Button>
|
</Button>
|
||||||
</Confirm>
|
</Confirm>
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
|
|
@ -190,7 +191,7 @@ export const TabServizio = ({
|
||||||
size="sm"
|
size="sm"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
>
|
>
|
||||||
<ExternalLink className="stroke-foreground size-5" />
|
<ExternalLink className="size-5 stroke-foreground" />
|
||||||
Apri Onboarding
|
Apri Onboarding
|
||||||
</Button>
|
</Button>
|
||||||
</Link>
|
</Link>
|
||||||
|
|
@ -211,14 +212,14 @@ export const TabServizio = ({
|
||||||
size="sm"
|
size="sm"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
>
|
>
|
||||||
<Copy className="stroke-foreground size-5" />
|
<Copy className="size-5 stroke-foreground" />
|
||||||
Copia Link
|
Copia Link
|
||||||
</Button>
|
</Button>
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
<DropdownMenuSeparator />
|
<DropdownMenuSeparator />
|
||||||
<DropdownMenuSub>
|
<DropdownMenuSub>
|
||||||
<DropdownMenuSubTrigger className="flex items-center gap-3 hover:cursor-pointer">
|
<DropdownMenuSubTrigger className="flex items-center gap-3 hover:cursor-pointer">
|
||||||
<Wrench className="stroke-foreground size-5" />
|
<Wrench className="size-5 stroke-foreground" />
|
||||||
<span className="text-foreground">Status Servizio</span>
|
<span className="text-foreground">Status Servizio</span>
|
||||||
</DropdownMenuSubTrigger>
|
</DropdownMenuSubTrigger>
|
||||||
<DropdownMenuPortal>
|
<DropdownMenuPortal>
|
||||||
|
|
@ -249,7 +250,7 @@ export const TabServizio = ({
|
||||||
</DropdownMenuSub>
|
</DropdownMenuSub>
|
||||||
<DropdownMenuSub>
|
<DropdownMenuSub>
|
||||||
<DropdownMenuSubTrigger className="flex items-center gap-3 hover:cursor-pointer">
|
<DropdownMenuSubTrigger className="flex items-center gap-3 hover:cursor-pointer">
|
||||||
<Wrench className="stroke-foreground size-5" />
|
<Wrench className="size-5 stroke-foreground" />
|
||||||
<span className="text-foreground">Interruzione</span>
|
<span className="text-foreground">Interruzione</span>
|
||||||
</DropdownMenuSubTrigger>
|
</DropdownMenuSubTrigger>
|
||||||
<DropdownMenuPortal>
|
<DropdownMenuPortal>
|
||||||
|
|
@ -285,7 +286,7 @@ export const TabServizio = ({
|
||||||
setOpen(true);
|
setOpen(true);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Wrench className="stroke-foreground size-5" />
|
<Wrench className="size-5 stroke-foreground" />
|
||||||
Modifica parametri
|
Modifica parametri
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
<DropdownMenuItem
|
<DropdownMenuItem
|
||||||
|
|
@ -296,7 +297,7 @@ export const TabServizio = ({
|
||||||
remove({ servizioId: servizio.servizio_id })
|
remove({ servizioId: servizio.servizio_id })
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<Trash2 className="stroke-foreground size-5" />
|
<Trash2 className="size-5 stroke-foreground" />
|
||||||
Elimina Servizio
|
Elimina Servizio
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
</DropdownMenuContent>
|
</DropdownMenuContent>
|
||||||
|
|
|
||||||
|
|
@ -97,7 +97,7 @@ export const UsersTable = (props: { data: UserWChatInfo[] }) => {
|
||||||
userId={user.id}
|
userId={user.id}
|
||||||
username={user.username}
|
username={user.username}
|
||||||
/>
|
/>
|
||||||
<span className="text-sm font-semibold">{user.username}</span>
|
<span className="font-semibold text-sm">{user.username}</span>
|
||||||
</Link>
|
</Link>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -138,7 +138,7 @@ function TimelineConnector({
|
||||||
return (
|
return (
|
||||||
<Comp
|
<Comp
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-border flex-1",
|
"flex-1 bg-border",
|
||||||
orientation === "vertical" && "my-2 w-0.5",
|
orientation === "vertical" && "my-2 w-0.5",
|
||||||
orientation === "horizontal" && "mx-2 h-0.5",
|
orientation === "horizontal" && "mx-2 h-0.5",
|
||||||
className,
|
className,
|
||||||
|
|
@ -210,7 +210,7 @@ function TimelineDescription({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Comp
|
<Comp
|
||||||
className={cn("text-muted-foreground text-[0.8em]", className)}
|
className={cn("text-[0.8em] text-muted-foreground", className)}
|
||||||
data-orientation={orientation}
|
data-orientation={orientation}
|
||||||
data-slot="timeline-description"
|
data-slot="timeline-description"
|
||||||
{...props}
|
{...props}
|
||||||
|
|
|
||||||
|
|
@ -75,12 +75,12 @@ export default function TimeserieBarChart({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card className="@container/card w-full pb-4">
|
<Card className="@container/card w-full pb-4">
|
||||||
<CardHeader className="flex flex-col border-b @md/card:grid">
|
<CardHeader className="flex @md/card:grid flex-col border-b">
|
||||||
<CardTitle>{title}</CardTitle>
|
<CardTitle>{title}</CardTitle>
|
||||||
<CardDescription className={cn(!description && "sr-only")}>
|
<CardDescription className={cn(!description && "sr-only")}>
|
||||||
{description || "Analytics for the selected period."}
|
{description || "Analytics for the selected period."}
|
||||||
</CardDescription>
|
</CardDescription>
|
||||||
<CardAction className="mt-2 @md/card:mt-0">
|
<CardAction className="@md/card:mt-0 mt-2">
|
||||||
<Popover>
|
<Popover>
|
||||||
<PopoverTrigger asChild>
|
<PopoverTrigger asChild>
|
||||||
<Button variant="outline">
|
<Button variant="outline">
|
||||||
|
|
@ -111,7 +111,7 @@ export default function TimeserieBarChart({
|
||||||
config={chartConfig}
|
config={chartConfig}
|
||||||
>
|
>
|
||||||
{filteredData.length === 0 ? (
|
{filteredData.length === 0 ? (
|
||||||
<div className="text-muted-foreground flex h-full items-center justify-center text-base">
|
<div className="flex h-full items-center justify-center text-base text-muted-foreground">
|
||||||
Nessun dato disponibile per il periodo selezionato.
|
Nessun dato disponibile per il periodo selezionato.
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
|
|
@ -144,7 +144,7 @@ export default function TimeserieBarChart({
|
||||||
)}
|
)}
|
||||||
</ChartContainer>
|
</ChartContainer>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
<CardFooter className="flex justify-end border-t !pt-4">
|
<CardFooter className="!pt-4 flex justify-end border-t">
|
||||||
<span className="text-muted-foreground text-sm">
|
<span className="text-muted-foreground text-sm">
|
||||||
Totale:{" "}
|
Totale:{" "}
|
||||||
<strong>
|
<strong>
|
||||||
|
|
|
||||||
|
|
@ -89,12 +89,12 @@ export default function TimeserieBarChartStacked({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card className="@container/card w-full pb-4">
|
<Card className="@container/card w-full pb-4">
|
||||||
<CardHeader className="flex flex-col border-b @md/card:grid">
|
<CardHeader className="flex @md/card:grid flex-col border-b">
|
||||||
<CardTitle>{title}</CardTitle>
|
<CardTitle>{title}</CardTitle>
|
||||||
<CardDescription className={cn(!description && "sr-only")}>
|
<CardDescription className={cn(!description && "sr-only")}>
|
||||||
{description || "Analytics for the selected period."}
|
{description || "Analytics for the selected period."}
|
||||||
</CardDescription>
|
</CardDescription>
|
||||||
<CardAction className="mt-2 @md/card:mt-0">
|
<CardAction className="@md/card:mt-0 mt-2">
|
||||||
<Popover>
|
<Popover>
|
||||||
<PopoverTrigger asChild>
|
<PopoverTrigger asChild>
|
||||||
<Button variant="outline">
|
<Button variant="outline">
|
||||||
|
|
@ -125,7 +125,7 @@ export default function TimeserieBarChartStacked({
|
||||||
config={chartConfig}
|
config={chartConfig}
|
||||||
>
|
>
|
||||||
{filteredData.length === 0 ? (
|
{filteredData.length === 0 ? (
|
||||||
<div className="text-muted-foreground flex h-full items-center justify-center text-base">
|
<div className="flex h-full items-center justify-center text-base text-muted-foreground">
|
||||||
Nessun dato disponibile per il periodo selezionato.
|
Nessun dato disponibile per il periodo selezionato.
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
|
|
@ -169,7 +169,7 @@ export default function TimeserieBarChartStacked({
|
||||||
)}
|
)}
|
||||||
</ChartContainer>
|
</ChartContainer>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
<CardFooter className="flex justify-end border-t !pt-4">
|
<CardFooter className="!pt-4 flex justify-end border-t">
|
||||||
<span className="text-muted-foreground text-sm">
|
<span className="text-muted-foreground text-sm">
|
||||||
Totale: <strong>{filteredData.reduce((acc) => acc + 1, 0)}</strong>
|
Totale: <strong>{filteredData.reduce((acc) => acc + 1, 0)}</strong>
|
||||||
</span>
|
</span>
|
||||||
|
|
|
||||||
|
|
@ -55,7 +55,7 @@ function ToolBar({ editor }: { editor: Editor }) {
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="border-input my-2 flex flex-wrap gap-3 rounded-lg border p-1">
|
<div className="my-2 flex flex-wrap gap-3 rounded-lg border border-input p-1">
|
||||||
<Toggle
|
<Toggle
|
||||||
onPressedChange={() => editor.chain().focus().setParagraph().run()}
|
onPressedChange={() => editor.chain().focus().setParagraph().run()}
|
||||||
pressed={editorState.isParagraph}
|
pressed={editorState.isParagraph}
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@ const Infoalloggi = (props: { opt?: string }) => {
|
||||||
return (
|
return (
|
||||||
<span
|
<span
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-3xl font-bold tracking-wide text-primary antialiased",
|
"font-bold text-3xl text-primary tracking-wide antialiased",
|
||||||
props.opt,
|
props.opt,
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -32,14 +32,14 @@ function AccordionTrigger({
|
||||||
<AccordionPrimitive.Header className="flex">
|
<AccordionPrimitive.Header className="flex">
|
||||||
<AccordionPrimitive.Trigger
|
<AccordionPrimitive.Trigger
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium outline-hidden transition-all hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
|
"flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left font-medium text-sm outline-hidden transition-all hover:underline focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="accordion-trigger"
|
data-slot="accordion-trigger"
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
<ChevronDownIcon className="text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" />
|
<ChevronDownIcon className="pointer-events-none size-4 shrink-0 translate-y-0.5 text-muted-foreground transition-transform duration-200" />
|
||||||
</AccordionPrimitive.Trigger>
|
</AccordionPrimitive.Trigger>
|
||||||
</AccordionPrimitive.Header>
|
</AccordionPrimitive.Header>
|
||||||
);
|
);
|
||||||
|
|
@ -52,7 +52,7 @@ function AccordionContent({
|
||||||
}: React.ComponentProps<typeof AccordionPrimitive.Content>) {
|
}: React.ComponentProps<typeof AccordionPrimitive.Content>) {
|
||||||
return (
|
return (
|
||||||
<AccordionPrimitive.Content
|
<AccordionPrimitive.Content
|
||||||
className="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm"
|
className="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
|
||||||
data-slot="accordion-content"
|
data-slot="accordion-content"
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -32,7 +32,7 @@ function AlertDialogOverlay({
|
||||||
return (
|
return (
|
||||||
<AlertDialogPrimitive.Overlay
|
<AlertDialogPrimitive.Overlay
|
||||||
className={cn(
|
className={cn(
|
||||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="alert-dialog-overlay"
|
data-slot="alert-dialog-overlay"
|
||||||
|
|
@ -50,7 +50,7 @@ function AlertDialogContent({
|
||||||
<AlertDialogOverlay />
|
<AlertDialogOverlay />
|
||||||
<AlertDialogPrimitive.Content
|
<AlertDialogPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 data-[state=closed]:animate-out data-[state=open]:animate-in sm:max-w-lg",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="alert-dialog-content"
|
data-slot="alert-dialog-content"
|
||||||
|
|
@ -95,7 +95,7 @@ function AlertDialogTitle({
|
||||||
}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {
|
}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {
|
||||||
return (
|
return (
|
||||||
<AlertDialogPrimitive.Title
|
<AlertDialogPrimitive.Title
|
||||||
className={cn("text-lg font-semibold", className)}
|
className={cn("font-semibold text-lg", className)}
|
||||||
data-slot="alert-dialog-title"
|
data-slot="alert-dialog-title"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -39,7 +39,7 @@ function AvatarFallback({
|
||||||
return (
|
return (
|
||||||
<AvatarPrimitive.Fallback
|
<AvatarPrimitive.Fallback
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-muted flex size-full items-center justify-center rounded-full",
|
"flex size-full items-center justify-center rounded-full bg-muted",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="avatar-fallback"
|
data-slot="avatar-fallback"
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@ function BreadcrumbList({ className, ...props }: React.ComponentProps<"ol">) {
|
||||||
return (
|
return (
|
||||||
<ol
|
<ol
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5",
|
"flex flex-wrap items-center gap-1.5 break-words text-muted-foreground text-sm sm:gap-2.5",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="breadcrumb-list"
|
data-slot="breadcrumb-list"
|
||||||
|
|
@ -42,7 +42,7 @@ function BreadcrumbLink({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Comp
|
<Comp
|
||||||
className={cn("hover:text-foreground transition-colors", className)}
|
className={cn("transition-colors hover:text-foreground", className)}
|
||||||
data-slot="breadcrumb-link"
|
data-slot="breadcrumb-link"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
@ -55,7 +55,7 @@ function BreadcrumbPage({ className, ...props }: React.ComponentProps<"span">) {
|
||||||
<span
|
<span
|
||||||
aria-current="page"
|
aria-current="page"
|
||||||
aria-disabled="true"
|
aria-disabled="true"
|
||||||
className={cn("text-foreground font-normal", className)}
|
className={cn("font-normal text-foreground", className)}
|
||||||
data-slot="breadcrumb-page"
|
data-slot="breadcrumb-page"
|
||||||
role="link"
|
role="link"
|
||||||
{...props}
|
{...props}
|
||||||
|
|
|
||||||
|
|
@ -405,7 +405,7 @@ function CaptionLabel({
|
||||||
if (!showYearSwitcher) return <span {...props}>{children}</span>;
|
if (!showYearSwitcher) return <span {...props}>{children}</span>;
|
||||||
return (
|
return (
|
||||||
<Button
|
<Button
|
||||||
className="h-7 w-full truncate text-sm font-medium"
|
className="h-7 w-full truncate font-medium text-sm"
|
||||||
onClick={() => setNavView((prev) => (prev === "days" ? "years" : "days"))}
|
onClick={() => setNavView((prev) => (prev === "days" ? "years" : "days"))}
|
||||||
size="sm"
|
size="sm"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
|
|
@ -496,9 +496,9 @@ function YearGrid({
|
||||||
return (
|
return (
|
||||||
<Button
|
<Button
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-foreground h-7 w-full text-sm font-normal",
|
"h-7 w-full font-normal text-foreground text-sm",
|
||||||
displayYears.from + i === new Date().getFullYear() &&
|
displayYears.from + i === new Date().getFullYear() &&
|
||||||
"bg-accent text-accent-foreground font-medium",
|
"bg-accent font-medium text-accent-foreground",
|
||||||
)}
|
)}
|
||||||
disabled={navView === "years" ? isDisabled : undefined}
|
disabled={navView === "years" ? isDisabled : undefined}
|
||||||
key={i}
|
key={i}
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ function Card({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
|
"flex flex-col gap-6 rounded-xl border bg-card py-6 text-card-foreground shadow-sm",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="card"
|
data-slot="card"
|
||||||
|
|
@ -31,7 +31,7 @@ function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
|
function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn("leading-none font-semibold", className)}
|
className={cn("font-semibold leading-none", className)}
|
||||||
data-slot="card-title"
|
data-slot="card-title"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -183,8 +183,8 @@ function CarouselPrevious({
|
||||||
className={cn(
|
className={cn(
|
||||||
"absolute size-8 rounded-full",
|
"absolute size-8 rounded-full",
|
||||||
orientation === "horizontal"
|
orientation === "horizontal"
|
||||||
? "top-1/2 -left-12 -translate-y-1/2"
|
? "-left-12 -translate-y-1/2 top-1/2"
|
||||||
: "-top-12 left-1/2 -translate-x-1/2 rotate-90",
|
: "-top-12 -translate-x-1/2 left-1/2 rotate-90",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="carousel-previous"
|
data-slot="carousel-previous"
|
||||||
|
|
@ -213,8 +213,8 @@ function CarouselNext({
|
||||||
className={cn(
|
className={cn(
|
||||||
"absolute size-8 rounded-full",
|
"absolute size-8 rounded-full",
|
||||||
orientation === "horizontal"
|
orientation === "horizontal"
|
||||||
? "top-1/2 -right-12 -translate-y-1/2"
|
? "-right-12 -translate-y-1/2 top-1/2"
|
||||||
: "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
|
: "-bottom-12 -translate-x-1/2 left-1/2 rotate-90",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="carousel-next"
|
data-slot="carousel-next"
|
||||||
|
|
|
||||||
|
|
@ -53,7 +53,7 @@ function ChartContainer({
|
||||||
<ChartContext.Provider value={{ config }}>
|
<ChartContext.Provider value={{ config }}>
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden",
|
"flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-hidden [&_.recharts-surface]:outline-hidden",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-chart={chartId}
|
data-chart={chartId}
|
||||||
|
|
@ -173,7 +173,7 @@ function ChartTooltipContent({
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl",
|
"grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|
@ -187,7 +187,7 @@ function ChartTooltipContent({
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5",
|
"flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground",
|
||||||
indicator === "dot" && "items-center",
|
indicator === "dot" && "items-center",
|
||||||
)}
|
)}
|
||||||
key={item.dataKey}
|
key={item.dataKey}
|
||||||
|
|
@ -233,7 +233,7 @@ function ChartTooltipContent({
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
{item.value && (
|
{item.value && (
|
||||||
<span className="text-foreground font-mono font-medium tabular-nums">
|
<span className="font-medium font-mono text-foreground tabular-nums">
|
||||||
{item.value.toLocaleString()}
|
{item.value.toLocaleString()}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
|
|
@ -282,7 +282,7 @@ function ChartLegendContent({
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
"[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3",
|
"flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground",
|
||||||
)}
|
)}
|
||||||
key={item.value}
|
key={item.value}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@ function Checkbox({
|
||||||
return (
|
return (
|
||||||
<CheckboxPrimitive.Root
|
<CheckboxPrimitive.Root
|
||||||
className={cn(
|
className={cn(
|
||||||
"peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs outline-hidden transition-shadow focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
"peer size-4 shrink-0 rounded-[4px] border border-input shadow-xs outline-hidden transition-shadow focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:bg-input/30 dark:data-[state=checked]:bg-primary dark:aria-invalid:ring-destructive/40",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="checkbox"
|
data-slot="checkbox"
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,7 @@ function Command({
|
||||||
return (
|
return (
|
||||||
<CommandPrimitive
|
<CommandPrimitive
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md",
|
"flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="command"
|
data-slot="command"
|
||||||
|
|
@ -49,7 +49,7 @@ function CommandDialog({
|
||||||
className={cn("overflow-hidden p-0", className)}
|
className={cn("overflow-hidden p-0", className)}
|
||||||
showCloseButton={showCloseButton}
|
showCloseButton={showCloseButton}
|
||||||
>
|
>
|
||||||
<Command className="[&_[cmdk-group-heading]]:text-muted-foreground **:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5">
|
<Command className="**:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5">
|
||||||
{children}
|
{children}
|
||||||
</Command>
|
</Command>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
|
|
@ -69,7 +69,7 @@ function CommandInput({
|
||||||
<SearchIcon className="size-4 shrink-0 opacity-50" />
|
<SearchIcon className="size-4 shrink-0 opacity-50" />
|
||||||
<CommandPrimitive.Input
|
<CommandPrimitive.Input
|
||||||
className={cn(
|
className={cn(
|
||||||
"placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50",
|
"flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="command-input"
|
data-slot="command-input"
|
||||||
|
|
@ -86,7 +86,7 @@ function CommandList({
|
||||||
return (
|
return (
|
||||||
<CommandPrimitive.List
|
<CommandPrimitive.List
|
||||||
className={cn(
|
className={cn(
|
||||||
"max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto",
|
"max-h-[300px] scroll-py-1 overflow-y-auto overflow-x-hidden",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="command-list"
|
data-slot="command-list"
|
||||||
|
|
@ -114,7 +114,7 @@ function CommandGroup({
|
||||||
return (
|
return (
|
||||||
<CommandPrimitive.Group
|
<CommandPrimitive.Group
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium",
|
"overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group-heading]]:text-xs",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="command-group"
|
data-slot="command-group"
|
||||||
|
|
@ -129,7 +129,7 @@ function CommandSeparator({
|
||||||
}: React.ComponentProps<typeof CommandPrimitive.Separator>) {
|
}: React.ComponentProps<typeof CommandPrimitive.Separator>) {
|
||||||
return (
|
return (
|
||||||
<CommandPrimitive.Separator
|
<CommandPrimitive.Separator
|
||||||
className={cn("bg-border -mx-1 h-px", className)}
|
className={cn("-mx-1 h-px bg-border", className)}
|
||||||
data-slot="command-separator"
|
data-slot="command-separator"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
@ -143,7 +143,7 @@ function CommandItem({
|
||||||
return (
|
return (
|
||||||
<CommandPrimitive.Item
|
<CommandPrimitive.Item
|
||||||
className={cn(
|
className={cn(
|
||||||
"data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="command-item"
|
data-slot="command-item"
|
||||||
|
|
@ -159,7 +159,7 @@ function CommandShortcut({
|
||||||
return (
|
return (
|
||||||
<span
|
<span
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-muted-foreground ml-auto text-xs tracking-widest",
|
"ml-auto text-muted-foreground text-xs tracking-widest",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="command-shortcut"
|
data-slot="command-shortcut"
|
||||||
|
|
|
||||||
|
|
@ -62,7 +62,7 @@ function ContextMenuSubTrigger({
|
||||||
return (
|
return (
|
||||||
<ContextMenuPrimitive.SubTrigger
|
<ContextMenuPrimitive.SubTrigger
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[inset]:pl-8 data-[state=open]:text-accent-foreground [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-inset={inset}
|
data-inset={inset}
|
||||||
|
|
@ -82,7 +82,7 @@ function ContextMenuSubContent({
|
||||||
return (
|
return (
|
||||||
<ContextMenuPrimitive.SubContent
|
<ContextMenuPrimitive.SubContent
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="context-menu-sub-content"
|
data-slot="context-menu-sub-content"
|
||||||
|
|
@ -99,7 +99,7 @@ function ContextMenuContent({
|
||||||
<ContextMenuPrimitive.Portal>
|
<ContextMenuPrimitive.Portal>
|
||||||
<ContextMenuPrimitive.Content
|
<ContextMenuPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="context-menu-content"
|
data-slot="context-menu-content"
|
||||||
|
|
@ -121,7 +121,7 @@ function ContextMenuItem({
|
||||||
return (
|
return (
|
||||||
<ContextMenuPrimitive.Item
|
<ContextMenuPrimitive.Item
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"data-[variant=destructive]:*:[svg]:!text-destructive relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[disabled]:opacity-50 data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-inset={inset}
|
data-inset={inset}
|
||||||
|
|
@ -142,7 +142,7 @@ function ContextMenuCheckboxItem({
|
||||||
<ContextMenuPrimitive.CheckboxItem
|
<ContextMenuPrimitive.CheckboxItem
|
||||||
checked={checked}
|
checked={checked}
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="context-menu-checkbox-item"
|
data-slot="context-menu-checkbox-item"
|
||||||
|
|
@ -166,7 +166,7 @@ function ContextMenuRadioItem({
|
||||||
return (
|
return (
|
||||||
<ContextMenuPrimitive.RadioItem
|
<ContextMenuPrimitive.RadioItem
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="context-menu-radio-item"
|
data-slot="context-menu-radio-item"
|
||||||
|
|
@ -192,7 +192,7 @@ function ContextMenuLabel({
|
||||||
return (
|
return (
|
||||||
<ContextMenuPrimitive.Label
|
<ContextMenuPrimitive.Label
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-foreground px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
|
"px-2 py-1.5 font-medium text-foreground text-sm data-[inset]:pl-8",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-inset={inset}
|
data-inset={inset}
|
||||||
|
|
@ -208,7 +208,7 @@ function ContextMenuSeparator({
|
||||||
}: React.ComponentProps<typeof ContextMenuPrimitive.Separator>) {
|
}: React.ComponentProps<typeof ContextMenuPrimitive.Separator>) {
|
||||||
return (
|
return (
|
||||||
<ContextMenuPrimitive.Separator
|
<ContextMenuPrimitive.Separator
|
||||||
className={cn("bg-border -mx-1 my-1 h-px", className)}
|
className={cn("-mx-1 my-1 h-px bg-border", className)}
|
||||||
data-slot="context-menu-separator"
|
data-slot="context-menu-separator"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
@ -222,7 +222,7 @@ function ContextMenuShortcut({
|
||||||
return (
|
return (
|
||||||
<span
|
<span
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-muted-foreground ml-auto text-xs tracking-widest",
|
"ml-auto text-muted-foreground text-xs tracking-widest",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="context-menu-shortcut"
|
data-slot="context-menu-shortcut"
|
||||||
|
|
|
||||||
|
|
@ -35,7 +35,7 @@ function DialogOverlay({
|
||||||
return (
|
return (
|
||||||
<DialogPrimitive.Overlay
|
<DialogPrimitive.Overlay
|
||||||
className={cn(
|
className={cn(
|
||||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="dialog-overlay"
|
data-slot="dialog-overlay"
|
||||||
|
|
@ -57,7 +57,7 @@ function DialogContent({
|
||||||
<DialogOverlay />
|
<DialogOverlay />
|
||||||
<DialogPrimitive.Content
|
<DialogPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border bg-background p-6 shadow-lg duration-200 data-[state=closed]:animate-out data-[state=open]:animate-in sm:max-w-lg",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="dialog-content"
|
data-slot="dialog-content"
|
||||||
|
|
@ -66,7 +66,7 @@ function DialogContent({
|
||||||
{children}
|
{children}
|
||||||
{showCloseButton && (
|
{showCloseButton && (
|
||||||
<DialogPrimitive.Close
|
<DialogPrimitive.Close
|
||||||
className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
|
className="absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0"
|
||||||
data-slot="dialog-close"
|
data-slot="dialog-close"
|
||||||
>
|
>
|
||||||
<XIcon />
|
<XIcon />
|
||||||
|
|
@ -107,7 +107,7 @@ function DialogTitle({
|
||||||
}: React.ComponentProps<typeof DialogPrimitive.Title>) {
|
}: React.ComponentProps<typeof DialogPrimitive.Title>) {
|
||||||
return (
|
return (
|
||||||
<DialogPrimitive.Title
|
<DialogPrimitive.Title
|
||||||
className={cn("text-lg leading-none font-semibold", className)}
|
className={cn("font-semibold text-lg leading-none", className)}
|
||||||
data-slot="dialog-title"
|
data-slot="dialog-title"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -54,7 +54,7 @@ function DrawerOverlay({
|
||||||
return (
|
return (
|
||||||
<DrawerPrimitive.Overlay
|
<DrawerPrimitive.Overlay
|
||||||
className={cn(
|
className={cn(
|
||||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="drawer-overlay"
|
data-slot="drawer-overlay"
|
||||||
|
|
@ -73,7 +73,7 @@ function DrawerContent({
|
||||||
<DrawerOverlay />
|
<DrawerOverlay />
|
||||||
<DrawerPrimitive.Content
|
<DrawerPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"group/drawer-content bg-background fixed z-50 flex h-auto flex-col",
|
"group/drawer-content fixed z-50 flex h-auto flex-col bg-background",
|
||||||
"data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b",
|
"data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b",
|
||||||
"data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t",
|
"data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t",
|
||||||
"data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm",
|
"data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm",
|
||||||
|
|
@ -83,7 +83,7 @@ function DrawerContent({
|
||||||
data-slot="drawer-content"
|
data-slot="drawer-content"
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
<div className="bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block" />
|
<div className="mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" />
|
||||||
{children}
|
{children}
|
||||||
</DrawerPrimitive.Content>
|
</DrawerPrimitive.Content>
|
||||||
</DrawerPortal>
|
</DrawerPortal>
|
||||||
|
|
@ -119,7 +119,7 @@ function DrawerTitle({
|
||||||
}: React.ComponentProps<typeof DrawerPrimitive.Title>) {
|
}: React.ComponentProps<typeof DrawerPrimitive.Title>) {
|
||||||
return (
|
return (
|
||||||
<DrawerPrimitive.Title
|
<DrawerPrimitive.Title
|
||||||
className={cn("text-foreground font-semibold", className)}
|
className={cn("font-semibold text-foreground", className)}
|
||||||
data-slot="drawer-title"
|
data-slot="drawer-title"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -38,7 +38,7 @@ function DropdownMenuContent({
|
||||||
<DropdownMenuPrimitive.Portal>
|
<DropdownMenuPrimitive.Portal>
|
||||||
<DropdownMenuPrimitive.Content
|
<DropdownMenuPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="dropdown-menu-content"
|
data-slot="dropdown-menu-content"
|
||||||
|
|
@ -69,7 +69,7 @@ function DropdownMenuItem({
|
||||||
return (
|
return (
|
||||||
<DropdownMenuPrimitive.Item
|
<DropdownMenuPrimitive.Item
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"data-[variant=destructive]:*:[svg]:!text-destructive relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[disabled]:opacity-50 data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-inset={inset}
|
data-inset={inset}
|
||||||
|
|
@ -90,7 +90,7 @@ function DropdownMenuCheckboxItem({
|
||||||
<DropdownMenuPrimitive.CheckboxItem
|
<DropdownMenuPrimitive.CheckboxItem
|
||||||
checked={checked}
|
checked={checked}
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="dropdown-menu-checkbox-item"
|
data-slot="dropdown-menu-checkbox-item"
|
||||||
|
|
@ -125,7 +125,7 @@ function DropdownMenuRadioItem({
|
||||||
return (
|
return (
|
||||||
<DropdownMenuPrimitive.RadioItem
|
<DropdownMenuPrimitive.RadioItem
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="dropdown-menu-radio-item"
|
data-slot="dropdown-menu-radio-item"
|
||||||
|
|
@ -151,7 +151,7 @@ function DropdownMenuLabel({
|
||||||
return (
|
return (
|
||||||
<DropdownMenuPrimitive.Label
|
<DropdownMenuPrimitive.Label
|
||||||
className={cn(
|
className={cn(
|
||||||
"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
|
"px-2 py-1.5 font-medium text-sm data-[inset]:pl-8",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-inset={inset}
|
data-inset={inset}
|
||||||
|
|
@ -167,7 +167,7 @@ function DropdownMenuSeparator({
|
||||||
}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {
|
}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {
|
||||||
return (
|
return (
|
||||||
<DropdownMenuPrimitive.Separator
|
<DropdownMenuPrimitive.Separator
|
||||||
className={cn("bg-border -mx-1 my-1 h-px", className)}
|
className={cn("-mx-1 my-1 h-px bg-border", className)}
|
||||||
data-slot="dropdown-menu-separator"
|
data-slot="dropdown-menu-separator"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
@ -181,7 +181,7 @@ function DropdownMenuShortcut({
|
||||||
return (
|
return (
|
||||||
<span
|
<span
|
||||||
className={cn(
|
className={cn(
|
||||||
"text-muted-foreground ml-auto text-xs tracking-widest",
|
"ml-auto text-muted-foreground text-xs tracking-widest",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="dropdown-menu-shortcut"
|
data-slot="dropdown-menu-shortcut"
|
||||||
|
|
@ -207,7 +207,7 @@ function DropdownMenuSubTrigger({
|
||||||
return (
|
return (
|
||||||
<DropdownMenuPrimitive.SubTrigger
|
<DropdownMenuPrimitive.SubTrigger
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8",
|
"flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[inset]:pl-8 data-[state=open]:text-accent-foreground",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-inset={inset}
|
data-inset={inset}
|
||||||
|
|
@ -227,7 +227,7 @@ function DropdownMenuSubContent({
|
||||||
return (
|
return (
|
||||||
<DropdownMenuPrimitive.SubContent
|
<DropdownMenuPrimitive.SubContent
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="dropdown-menu-sub-content"
|
data-slot="dropdown-menu-sub-content"
|
||||||
|
|
|
||||||
|
|
@ -6,9 +6,9 @@ function Input({ className, type, ...props }: React.ComponentProps<"input">) {
|
||||||
return (
|
return (
|
||||||
<input
|
<input
|
||||||
className={cn(
|
className={cn(
|
||||||
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs outline-hidden transition-[color,box-shadow] file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
"flex h-9 w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs outline-hidden transition-[color,box-shadow] selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:font-medium file:text-foreground file:text-sm placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:bg-input/30",
|
||||||
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
|
"focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50",
|
||||||
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
"aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="input"
|
data-slot="input"
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ function Label({
|
||||||
return (
|
return (
|
||||||
<LabelPrimitive.Root
|
<LabelPrimitive.Root
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
|
"flex select-none items-center gap-2 font-medium text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-50 group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="label"
|
data-slot="label"
|
||||||
|
|
|
||||||
|
|
@ -28,7 +28,7 @@ function PopoverContent({
|
||||||
<PopoverPrimitive.Content
|
<PopoverPrimitive.Content
|
||||||
align={align}
|
align={align}
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="popover-content"
|
data-slot="popover-content"
|
||||||
|
|
|
||||||
|
|
@ -11,14 +11,14 @@ function Progress({
|
||||||
return (
|
return (
|
||||||
<ProgressPrimitive.Root
|
<ProgressPrimitive.Root
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-primary/20 relative h-2 w-full overflow-hidden rounded-full",
|
"relative h-2 w-full overflow-hidden rounded-full bg-primary/20",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="progress"
|
data-slot="progress"
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
<ProgressPrimitive.Indicator
|
<ProgressPrimitive.Indicator
|
||||||
className="bg-primary h-full w-full flex-1 transition-all"
|
className="h-full w-full flex-1 bg-primary transition-all"
|
||||||
data-slot="progress-indicator"
|
data-slot="progress-indicator"
|
||||||
style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
|
style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@ function ScrollArea({
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
<ScrollAreaPrimitive.Viewport
|
<ScrollAreaPrimitive.Viewport
|
||||||
className="focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1"
|
className="size-full rounded-[inherit] outline-none transition-[color,box-shadow] focus-visible:outline-1 focus-visible:ring-[3px] focus-visible:ring-ring/50"
|
||||||
data-slot="scroll-area-viewport"
|
data-slot="scroll-area-viewport"
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
|
|
@ -34,7 +34,7 @@ function ScrollBar({
|
||||||
return (
|
return (
|
||||||
<ScrollAreaPrimitive.ScrollAreaScrollbar
|
<ScrollAreaPrimitive.ScrollAreaScrollbar
|
||||||
className={cn(
|
className={cn(
|
||||||
"flex touch-none p-px transition-colors select-none",
|
"flex touch-none select-none p-px transition-colors",
|
||||||
orientation === "vertical" &&
|
orientation === "vertical" &&
|
||||||
"h-full w-2.5 border-l border-l-transparent",
|
"h-full w-2.5 border-l border-l-transparent",
|
||||||
orientation === "horizontal" &&
|
orientation === "horizontal" &&
|
||||||
|
|
@ -46,7 +46,7 @@ function ScrollBar({
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
<ScrollAreaPrimitive.ScrollAreaThumb
|
<ScrollAreaPrimitive.ScrollAreaThumb
|
||||||
className="bg-border relative flex-1 rounded-full"
|
className="relative flex-1 rounded-full bg-border"
|
||||||
data-slot="scroll-area-thumb"
|
data-slot="scroll-area-thumb"
|
||||||
/>
|
/>
|
||||||
</ScrollAreaPrimitive.ScrollAreaScrollbar>
|
</ScrollAreaPrimitive.ScrollAreaScrollbar>
|
||||||
|
|
|
||||||
|
|
@ -35,7 +35,7 @@ function SelectTrigger({
|
||||||
return (
|
return (
|
||||||
<SelectPrimitive.Trigger
|
<SelectPrimitive.Trigger
|
||||||
className={cn(
|
className={cn(
|
||||||
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs outline-hidden transition-[color,box-shadow] focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
"flex w-fit items-center justify-between gap-2 whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-xs outline-hidden transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[size=default]:h-9 data-[size=sm]:h-8 data-[placeholder]:text-muted-foreground *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 dark:bg-input/30 dark:aria-invalid:ring-destructive/40 dark:hover:bg-input/50 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-size={size}
|
data-size={size}
|
||||||
|
|
@ -60,9 +60,9 @@ function SelectContent({
|
||||||
<SelectPrimitive.Portal>
|
<SelectPrimitive.Portal>
|
||||||
<SelectPrimitive.Content
|
<SelectPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-y-auto overflow-x-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
position === "popper" &&
|
position === "popper" &&
|
||||||
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
"data-[side=left]:-translate-x-1 data-[side=top]:-translate-y-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="select-content"
|
data-slot="select-content"
|
||||||
|
|
@ -91,7 +91,7 @@ function SelectLabel({
|
||||||
}: React.ComponentProps<typeof SelectPrimitive.Label>) {
|
}: React.ComponentProps<typeof SelectPrimitive.Label>) {
|
||||||
return (
|
return (
|
||||||
<SelectPrimitive.Label
|
<SelectPrimitive.Label
|
||||||
className={cn("text-muted-foreground px-2 py-1.5 text-xs", className)}
|
className={cn("px-2 py-1.5 text-muted-foreground text-xs", className)}
|
||||||
data-slot="select-label"
|
data-slot="select-label"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
@ -106,7 +106,7 @@ function SelectItem({
|
||||||
return (
|
return (
|
||||||
<SelectPrimitive.Item
|
<SelectPrimitive.Item
|
||||||
className={cn(
|
className={cn(
|
||||||
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
"relative flex w-full cursor-default select-none items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="select-item"
|
data-slot="select-item"
|
||||||
|
|
@ -128,7 +128,7 @@ function SelectSeparator({
|
||||||
}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
|
}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
|
||||||
return (
|
return (
|
||||||
<SelectPrimitive.Separator
|
<SelectPrimitive.Separator
|
||||||
className={cn("bg-border pointer-events-none -mx-1 my-1 h-px", className)}
|
className={cn("-mx-1 pointer-events-none my-1 h-px bg-border", className)}
|
||||||
data-slot="select-separator"
|
data-slot="select-separator"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@ function Separator({
|
||||||
return (
|
return (
|
||||||
<SeparatorPrimitive.Root
|
<SeparatorPrimitive.Root
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
|
"shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=vertical]:h-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="separator"
|
data-slot="separator"
|
||||||
|
|
|
||||||
|
|
@ -35,7 +35,7 @@ function SheetOverlay({
|
||||||
return (
|
return (
|
||||||
<SheetPrimitive.Overlay
|
<SheetPrimitive.Overlay
|
||||||
className={cn(
|
className={cn(
|
||||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=open]:animate-in",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="sheet-overlay"
|
data-slot="sheet-overlay"
|
||||||
|
|
@ -57,7 +57,7 @@ function SheetContent({
|
||||||
<SheetOverlay />
|
<SheetOverlay />
|
||||||
<SheetPrimitive.Content
|
<SheetPrimitive.Content
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
|
"fixed z-50 flex flex-col gap-4 bg-background shadow-lg transition ease-in-out data-[state=closed]:animate-out data-[state=open]:animate-in data-[state=closed]:duration-300 data-[state=open]:duration-500",
|
||||||
side === "right" &&
|
side === "right" &&
|
||||||
"data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
|
"data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
|
||||||
side === "left" &&
|
side === "left" &&
|
||||||
|
|
@ -72,7 +72,7 @@ function SheetContent({
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
<SheetPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none">
|
<SheetPrimitive.Close className="absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
|
||||||
<XIcon className="size-4" />
|
<XIcon className="size-4" />
|
||||||
<span className="sr-only">Close</span>
|
<span className="sr-only">Close</span>
|
||||||
</SheetPrimitive.Close>
|
</SheetPrimitive.Close>
|
||||||
|
|
@ -107,7 +107,7 @@ function SheetTitle({
|
||||||
}: React.ComponentProps<typeof SheetPrimitive.Title>) {
|
}: React.ComponentProps<typeof SheetPrimitive.Title>) {
|
||||||
return (
|
return (
|
||||||
<SheetPrimitive.Title
|
<SheetPrimitive.Title
|
||||||
className={cn("text-foreground font-semibold", className)}
|
className={cn("font-semibold text-foreground", className)}
|
||||||
data-slot="sheet-title"
|
data-slot="sheet-title"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,7 @@ import { cn } from "~/lib/utils";
|
||||||
function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
|
function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn("bg-accent animate-pulse rounded-md", className)}
|
className={cn("animate-pulse rounded-md bg-accent", className)}
|
||||||
data-slot="skeleton"
|
data-slot="skeleton"
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -27,7 +27,7 @@ function Slider({
|
||||||
return (
|
return (
|
||||||
<SliderPrimitive.Root
|
<SliderPrimitive.Root
|
||||||
className={cn(
|
className={cn(
|
||||||
"relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
|
"relative flex w-full touch-none select-none items-center data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col data-[disabled]:opacity-50",
|
||||||
className,
|
className,
|
||||||
)}
|
)}
|
||||||
data-slot="slider"
|
data-slot="slider"
|
||||||
|
|
@ -39,13 +39,13 @@ function Slider({
|
||||||
>
|
>
|
||||||
<SliderPrimitive.Track
|
<SliderPrimitive.Track
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5",
|
"relative grow overflow-hidden rounded-full bg-muted data-[orientation=horizontal]:h-1.5 data-[orientation=vertical]:h-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-1.5",
|
||||||
)}
|
)}
|
||||||
data-slot="slider-track"
|
data-slot="slider-track"
|
||||||
>
|
>
|
||||||
<SliderPrimitive.Range
|
<SliderPrimitive.Range
|
||||||
className={cn(
|
className={cn(
|
||||||
"bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full",
|
"absolute bg-primary data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full",
|
||||||
rangeClassName,
|
rangeClassName,
|
||||||
)}
|
)}
|
||||||
data-slot="slider-range"
|
data-slot="slider-range"
|
||||||
|
|
@ -54,7 +54,7 @@ function Slider({
|
||||||
{Array.from({ length: _values.length }, (_, index) => (
|
{Array.from({ length: _values.length }, (_, index) => (
|
||||||
<SliderPrimitive.Thumb
|
<SliderPrimitive.Thumb
|
||||||
className={cn(
|
className={cn(
|
||||||
"border-primary bg-background ring-ring/50 block size-4 shrink-0 rounded-full border shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50",
|
"block size-4 shrink-0 rounded-full border border-primary bg-background shadow-sm ring-ring/50 transition-[color,box-shadow] hover:ring-4 focus-visible:outline-hidden focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50",
|
||||||
thumbClassName,
|
thumbClassName,
|
||||||
)}
|
)}
|
||||||
data-slot="slider-thumb"
|
data-slot="slider-thumb"
|
||||||
|
|
|
||||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Reference in a new issue