feat: refactor remove heading bold (#208)

Author: thedaviddias

app/_components/social.tsx

@@ -1,4 +1,4 @@
-import { siGithub, siReddit, siX } from 'simple-icons';
+import { siGithub, siInstagram, siReddit, siX } from 'simple-icons';
 import { SimpleIconComponent } from './browser-support';
 
 interface SocialLink {
@@ -10,11 +10,23 @@ interface SocialLink {
 }
 
 export const SOCIAL_LINKS: SocialLink[] = [
+  {
+    label: 'Instagram',
+    link: 'https://www.instagram.com/uxpatternsfordevs',
+    shortlink: 'https://www.instagram.com/uxpatternsfordevs',
+    rel: 'me' as const,
+    icon: (
+      <SimpleIconComponent
+        icon={siInstagram}
+        className="w-10 h-10 p-1.5 border rounded-full transition-colors duration-200 hover:bg-gray-100 dark:hover:bg-gray-800 border-gray-200 dark:border-gray-700"
+      />
+    ),
+  },
   {
     label: 'Reddit',
     link: 'https://www.reddit.com/r/UXPatterns/',
     shortlink: 'https://ddias.link/ux-reddit',
-    rel: 'me',
+    rel: 'me' as const,
     icon: (
       <SimpleIconComponent
         icon={siReddit}
@@ -26,7 +38,7 @@ export const SOCIAL_LINKS: SocialLink[] = [
     label: 'X',
     link: 'https://x.com/thedaviddias',
     shortlink: 'https://x.com/thedaviddias',
-    rel: 'me',
+    rel: 'me' as const,
     icon: (
       <SimpleIconComponent
         icon={siX}
@@ -38,13 +50,13 @@ export const SOCIAL_LINKS: SocialLink[] = [
     label: 'LinkedIn',
     link: 'https://www.linkedin.com/in/thedaviddias',
     shortlink: 'https://www.linkedin.com/in/thedaviddias/',
-    rel: 'me',
+    rel: 'me' as const,
   },
   {
     label: 'Github',
     link: 'https://github.com/thedaviddias',
     shortlink: 'https://github.com/thedaviddias',
-    rel: 'me',
+    rel: 'me' as const,
     icon: (
       <SimpleIconComponent
         icon={siGithub}