Update image scaling and hover effect

thebkht · Nov 28, 2023 · 301cc12 · 301cc12
1 parent ada00c0
commit 301cc12
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/components/blog/post.tsx b/components/blog/post.tsx
@@ -77,7 +77,7 @@ export default function SinglePost({ post: initialPost, author, sessionUser, tag
                          <div className="article__header lg:text-xl">
                               {
                                    post?.cover && (
-                                        <Image src={post?.cover} alt={post?.title} fill className="!relative w-full rounded-md" placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(1920, 1080))}`} />
+                                        <Image src={post?.cover} alt={post?.title} fill className="!relative w-full rounded-md hover:scale-105" placeholder={`data:image/svg+xml;base64,${toBase64(shimmer(1920, 1080))}`} />
                                    )
                               }
                               <h1 className="article__title">{post?.title}</h1>

diff --git a/components/image.tsx b/components/image.tsx
@@ -15,7 +15,7 @@ export function BlurImage(props: ComponentProps<typeof Image>) {
       alt={props.alt}
       className={cn(
         props.className,
-        "duration-700 ease-in-out",
+        "duration-700 ease-in-out hover:scale-105",
         isLoading ? "scale-105 blur-lg" : "scale-100 blur-0",
       )}
       onLoadingComplete={() => setLoading(false)}