From 26e4c4ece463dbdf7d1453c98e68013756de996d Mon Sep 17 00:00:00 2001
From: John Doe <hamedhasan422421@gmail.com>
Date: Sat, 9 Sep 2023 17:01:41 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20Updated=20SocialsList1=20compone?=
 =?UTF-8?q?nt=20=F0=9F=9A=80=20Added=20icons=20and=20links=20=F0=9F=8E=A8?=
 =?UTF-8?q?=20Improved=20styling=20=F0=9F=90=9B=20Fixed=20a=20bug=20in=20S?=
 =?UTF-8?q?ocialsList1=20=E2=9C=A8=20Ready=20for=20social=20sharing!?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/shared/SocialsList1.tsx | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 src/shared/SocialsList1.tsx

diff --git a/src/shared/SocialsList1.tsx b/src/shared/SocialsList1.tsx
new file mode 100644
index 0000000..4f73105
--- /dev/null
+++ b/src/shared/SocialsList1.tsx
@@ -0,0 +1,36 @@
+import { SocialType } from "@/shared/SocialsShare";
+import React, { FC } from "react";
+
+export interface SocialsList1Props {
+  className?: string;
+}
+
+const socials: SocialType[] = [
+  { name: "Facebook", icon: "lab la-facebook-square", href: "#" },
+  { name: "Twitter", icon: "lab la-twitter", href: "#" },
+  { name: "Youtube", icon: "lab la-youtube", href: "#" },
+  { name: "Instagram", icon: "lab la-instagram", href: "#" },
+];
+
+const SocialsList1: FC<SocialsList1Props> = ({ className = "space-y-2.5" }) => {
+  const renderItem = (item: SocialType, index: number) => {
+    return (
+      <a
+        href={item.href}
+        className="flex items-center text-2xl text-neutral-700 hover:text-black dark:text-neutral-300 dark:hover:text-white leading-none space-x-2 group"
+        key={index}
+      >
+        <i className={item.icon}></i>
+        <span className="hidden lg:block text-sm">{item.name}</span>
+      </a>
+    );
+  };
+
+  return (
+    <div className={`nc-SocialsList1 ${className}`} data-nc-id="SocialsList1">
+      {socials.map(renderItem)}
+    </div>
+  );
+};
+
+export default SocialsList1;