fix: buttons clickable on every inch of it

This commit is contained in:
theoleuthardt 2025-02-08 14:21:46 +01:00
parent 39be7de9c0
commit 6da16f3858
2 changed files with 13 additions and 4 deletions

View file

@ -9,14 +9,15 @@ export default function Home() {
<div className="w-screen h-screen flex flex-col items-center justify-center"> <div className="w-screen h-screen flex flex-col items-center justify-center">
<div className="grid grid-cols-3 gap-6"> <div className="grid grid-cols-3 gap-6">
{toolLinks.map((tool) => ( {toolLinks.map((tool) => (
<div <a
key={tool.title} key={tool.title}
className="text-2xl border-2 border-white p-5 flex justify-center rounded-2xl shadow-md href={tool.link}
className="text-2xl border-2 border-white p-6 flex justify-center rounded-2xl shadow-md
shadow-white hover:scale-110 hover:transition-scale hover:duration-200 shadow-white hover:scale-110 hover:transition-scale hover:duration-200
hover:text-blue-400 hover:border-blue-400 hover:shadow-blue-400" hover:text-blue-400 hover:border-blue-400 hover:shadow-blue-400"
> >
<a href={tool.link}>{tool.title}</a> {tool.title}
</div> </a>
))} ))}
</div> </div>
</div> </div>

View file

@ -27,4 +27,12 @@ export const toolLinks = [
title: "qr-code-generator", title: "qr-code-generator",
link: "/qr-code-generator", link: "/qr-code-generator",
}, },
{
title: "word-counter",
link: "/word-counter",
},
{
title: "video-to-gif",
link: "/video-to-gif",
},
]; ];