feat ❇️ : Add x_handle link to Member component in About page

geeksblabla · Oct 19, 2024 · 5bab125 · 5bab125
1 parent 18e1bbd
commit 5bab125
Showing 1 changed file with 10 additions and 1 deletion.
diff --git a/src/components/about/member.astro b/src/components/about/member.astro
@@ -1,5 +1,6 @@
 ---
 import { Image } from "astro:assets";
+import { Icon } from "astro-icon/components";
 
 export interface MemberProps {
   name: string;
@@ -22,6 +23,14 @@ const { name, x_handle, profile_image } = Astro.props;
   />
   <div class="mx-auto rounded-b-[4px] bg-[#0E0F10] p-4">
     <h3 class="mb-2 truncate text-xl font-semibold text-white">{name}</h3>
-    <p class="text-gray-400">{x_handle}</p>
+    <div class="flex items-center space-x-2">
+      <a
+        href={`https://x.com/${x_handle}`}
+        class="text-gray-600 hover:text-gray-800"
+      >
+        <Icon name="x" class="h-5 w-5" />
+      </a>
+      <p class="text-gray-400">{x_handle}</p>
+    </div>
   </div>
 </div>