From e4fbfed901d895ed43123bff816f41f5a2839e8f Mon Sep 17 00:00:00 2001
From: abhishek maurya <abhishekrmaurya2020@gmail.com>
Date: Tue, 3 Feb 2026 20:32:28 +0530
Subject: [PATCH] changed twitter icon successfully

---
 src/components/Footer.jsx |  7 ++++---
 src/components/XIcon.jsx  | 13 +++++++++++++
 src/pages/index.jsx       |  6 +++---
 3 files changed, 20 insertions(+), 6 deletions(-)
 create mode 100644 src/components/XIcon.jsx

diff --git a/src/components/Footer.jsx b/src/components/Footer.jsx
index ea36f59c..e5c25b51 100644
--- a/src/components/Footer.jsx
+++ b/src/components/Footer.jsx
@@ -1,9 +1,10 @@
 import Link from 'next/link'
 
 import { Container } from '@/components/Container'
+import { XIcon } from '@/components/XIcon'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faEnvelope } from '@fortawesome/free-solid-svg-icons'
-import { faDiscord, faGithub, faGitlab, faTwitter } from '@fortawesome/free-brands-svg-icons'
+import { faDiscord, faGithub, faGitlab } from '@fortawesome/free-brands-svg-icons'
 
 function NavLink({ href, children }) {
   return (
@@ -45,8 +46,8 @@ export function Footer() {
                 <Link aria-label="Join on Discord" className=' text-zinc-400 hover:text-[#00843D] dark:text-zinc-400 dark:hover:text-yellow-400 transition' href='https://discord.gg/hjUhu33uAn'>
                   <FontAwesomeIcon icon={faDiscord} size='xl' />
                 </Link>
-                <Link aria-label="Follow on Twitter" className=' text-zinc-400 hover:text-[#00843D] dark:text-zinc-400 dark:hover:text-yellow-400 transition' href='https://twitter.com/aossie_org'>
-                  <FontAwesomeIcon icon={faTwitter} size='xl' />
+                <Link aria-label="Follow on X (Twitter)" className=' text-zinc-400 hover:text-[#00843D] dark:text-zinc-400 dark:hover:text-yellow-400 transition' href='https://twitter.com/aossie_org'>
+                  <XIcon className="h-6 w-6" />
                 </Link>
               </div>
             </div>
diff --git a/src/components/XIcon.jsx b/src/components/XIcon.jsx
new file mode 100644
index 00000000..5eefa086
--- /dev/null
+++ b/src/components/XIcon.jsx
@@ -0,0 +1,13 @@
+export function XIcon({ className }) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      aria-hidden="true"
+      className={className}
+      fill="currentColor"
+    >
+      <path d="M4 3.5h3.1L12 10.25 16.6 3.5H20l-6 8.5 6.5 8.5h-3.6L12 13.75 7 20.5H4l6-8.5L4 3.5z" />
+    </svg>
+  )
+}
+
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index 14e063cd..7a9d59ff 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -4,13 +4,13 @@ import Image from 'next/image'
 import { useState, useEffect } from 'react'
 
 import { Container } from '@/components/Container'
+import { XIcon } from '@/components/XIcon'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faEnvelope } from '@fortawesome/free-solid-svg-icons'
 import {
   faDiscord,
   faGithub,
   faGitlab,
-  faTwitter,
 } from '@fortawesome/free-brands-svg-icons'
 import { CardEffect } from '@/components/CardEffect'
 import { Banner } from '@/components/Banner'
@@ -88,11 +88,11 @@ export default function Home() {
                     <FontAwesomeIcon icon={faDiscord} size="2xl" />
                   </Link>
                   <Link
-                    aria-label="Follow on Twitter"
+                    aria-label="Follow on X (Twitter)"
                     className="text-zinc-500 transition hover:text-[#00843D] dark:text-zinc-400 dark:hover:text-yellow-400"
                     href="https://twitter.com/aossie_org"
                   >
-                    <FontAwesomeIcon icon={faTwitter} size="2xl" />
+                    <XIcon className="h-7 w-7" />
                   </Link>
                 </div>
                 <div className="mt-12 mx-4 md:mx-0 md:mt-8 text-left ">