feat: add user card component

reactplay · Jun 14, 2022 · 05c2857 · 05c2857
1 parent 47e0d37
commit 05c2857
Showing 1 changed file with 15 additions and 0 deletions.
diff --git a/src/plays/github-user-search/GitHubUserCard.jsx b/src/plays/github-user-search/GitHubUserCard.jsx
@@ -0,0 +1,15 @@
+export const GitHubUserCard = ({username, avatar, link}) => {
+ return (
+ <a
+ href={link}
+ target="_blank"
+ rel="noreferrer"
+ style={{backgroundImage: `url(${avatar})`}}
+ className=" bg-cover bg-center h-[15rem] w-[15rem] flex rounded-lg"
+ >
+ <h1 className="text-2xl p-2 w-full h-full text-white opacity-0 hover:opacity-80 hover:bg-black rounded-lg">
+ {username}
+ </h1>
+ </a>
+ );
+};