chore: updated initial animation state

Signed-off-by: Adithya Krishna <adithya@documenso.com>
This commit is contained in:
Adithya Krishna
2024-03-07 19:28:35 +05:30
parent 9ae51a0072
commit 0c426983bb
2 changed files with 35 additions and 36 deletions

View File

@ -69,26 +69,25 @@ export const DocumentDropzone = ({
});
return (
<motion.div
className={cn('flex', className)}
variants={DocumentDropzoneContainerVariants}
initial="initial"
animate="animate"
whileHover="hover"
<Card
role="button"
className={cn(
'focus-visible:ring-ring ring-offset-background flex flex flex-1 cursor-pointer flex-col items-center justify-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2',
className,
)}
gradient={!disabled}
degrees={120}
aria-disabled={disabled}
{...getRootProps()}
{...props}
>
<Card
role="button"
className={cn(
'focus-visible:ring-ring ring-offset-background flex flex-1 cursor-pointer flex-col items-center justify-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2',
className,
)}
gradient={!disabled}
degrees={120}
aria-disabled={disabled}
{...getRootProps()}
{...props}
>
<CardContent className="text-muted-foreground/40 flex flex-col items-center justify-center p-6">
<CardContent className="text-muted-foreground/40 flex flex-col items-center justify-center p-6">
<motion.div
variants={DocumentDropzoneContainerVariants}
initial="initial"
animate="animate"
whileHover="hover"
>
{disabled ? (
// Disabled State
<div className="flex">
@ -152,21 +151,21 @@ export const DocumentDropzone = ({
</motion.div>
</div>
)}
</motion.div>
<input {...getInputProps()} />
<input {...getInputProps()} />
<p className="text-foreground mt-8 font-medium">{DocumentDescription[type].headline}</p>
<p className="text-foreground mt-8 font-medium">{DocumentDescription[type].headline}</p>
<p className="text-muted-foreground/80 mt-1 text-sm">
{disabled ? disabledMessage : 'Drag & drop your PDF here.'}
</p>
{disabled && (
<Button className="hover:bg-warning/80 bg-warning mt-4 w-32" asChild>
<Link href="/settings/billing">Upgrade</Link>
</Button>
)}
</CardContent>
</Card>
</motion.div>
<p className="text-muted-foreground/80 mt-1 text-center text-sm">
{disabled ? disabledMessage : 'Drag & drop your PDF here.'}
</p>
{disabled && (
<Button className="hover:bg-warning/80 bg-warning mt-4 w-32" asChild>
<Link href="/settings/billing">Upgrade</Link>
</Button>
)}
</CardContent>
</Card>
);
};