Knowledger Profile

src/components/cardknowledger/mockKnowledgers.ts

@@ -5,6 +5,10 @@ import knowledgerJoao from "../../assets/images/knowledgers/joao.png";
 import knowledgerDaniel from "../../assets/images/knowledgers/daniel.png";
 
 import LeonardoProfileImage from "../../assets/images/leonardo-profile-image.png";
+import AlvesProfileImage from "../../assets/images/image-alves-profile.png";
+import MoniqueProfileImage from "../../assets/images/image-monique-profile.png";
+import JoaoProfileImage from "../../assets/images/image-monique-profile.png";
+import DanielProfileImage from "../../assets/images/image-daniel-profile.png";
 
 import { GithubLogo, InstagramLogo, LinkedinLogo } from "@phosphor-icons/react";
 
@@ -13,6 +17,7 @@ export const mockKnowledgers = [
     id: 3,
     name: "Monique Campos",
     image: knowledgerMonique,
+    imageProfile: MoniqueProfileImage,
     flag: "alagoas",
     social: [
       { icon: GithubLogo, url: "" },
@@ -38,18 +43,20 @@ export const mockKnowledgers = [
     id: 7,
     name: "Alves Jhonata",
     image: knowledgerAlves,
+    imageProfile: AlvesProfileImage,
     flag: "para",
     social: [
-      { icon: GithubLogo, url: "" },
-      { icon: InstagramLogo, url: "" },
-      { icon: LinkedinLogo, url: "" },
+      { icon: GithubLogo, url: "https://github.com/4llves" },
+      { icon: InstagramLogo, url: "https://www.instagram.com/4llves_/" },
+      { icon: LinkedinLogo, url: "https://www.linkedin.com/in/4llves/" },
     ],
   },
 
   {
     id: 8,
     name: "João Jacinto",
     image: knowledgerJoao,
+    imageProfile: JoaoProfileImage,
     flag: "alagoas",
     social: [
       { icon: GithubLogo, url: "" },
@@ -62,6 +69,7 @@ export const mockKnowledgers = [
     id: 9,
     name: "Daniel Duarte",
     image: knowledgerDaniel,
+    imageProfile: DanielProfileImage,
     flag: "alagoas",
     social: [
       { icon: InstagramLogo, url: "" },

src/pages/Profile.tsx

@@ -71,7 +71,11 @@ export function Profile() {
         </div>
 
         <div>
-          <img src={knowledgerInfo?.imageProfile} alt="" />
+          <img
+            src={knowledgerInfo?.imageProfile}
+            className="transition-transform duration-300 hover:rotate-[1.5deg] hover:scale-105"
+            alt=""
+          />
 
           <div className="flex items-center justify-center gap-4 mt-4">
             {knowledgerInfo?.social?.map(