feat: img animation

This commit is contained in:
Artemy 2022-10-17 17:50:44 +03:00
parent 7cafb9d840
commit 672da699f3
2 changed files with 5 additions and 2 deletions

View file

@ -4,7 +4,7 @@ function Button(props) {
return ( return (
<Link to={props.href} className={props.className}> <Link to={props.href} className={props.className}>
<div <div
className={`transition-transform w-48 ease-[cubic-bezier(.69,.58,.32,1.69)] delay-60 hover:scale-105 p-2 pl-6 text-lg bg-zinc-100 hover:bg-zinc-300 dark:bg-zinc-600 dark:hover:bg-zinc-800 rounded-2xl ${props.className}`} className={`transition-transform w-48 ease-[cubic-bezier(.69,.58,.32,1.69)] hover:scale-105 p-2 pl-6 text-lg bg-zinc-100 hover:bg-zinc-300 dark:bg-zinc-600 dark:hover:bg-zinc-800 rounded-2xl ${props.className}`}
> >
{props.children} {props.children}
</div> </div>
@ -16,7 +16,7 @@ function ButtonWithAction(props) {
return ( return (
<div <div
onClick={props.onClick} onClick={props.onClick}
className={`transition-transform w-48 ease-[cubic-bezier(.69,.58,.32,1.69)] delay-60 hover:scale-105 p-2 pl-6 text-lg bg-zinc-100 hover:bg-zinc-300 dark:bg-zinc-600 dark:hover:bg-zinc-800 rounded-2xl ${props.className}`} className={`transition-transform w-48 ease-[cubic-bezier(.69,.58,.32,1.69)] hover:scale-105 p-2 pl-6 text-lg bg-zinc-100 hover:bg-zinc-300 dark:bg-zinc-600 dark:hover:bg-zinc-800 rounded-2xl ${props.className}`}
> >
{props.children} {props.children}
</div> </div>

View file

@ -61,4 +61,7 @@
@apply inline-block bg-transparent text-blue-600; @apply inline-block bg-transparent text-blue-600;
} }
.md img {
@apply transition-transform w-96 ease-[cubic-bezier(.69,.58,.32,1.69)] hover:scale-105 rounded-2xl;
}
} }