From 1470836462b1596a55cef4b13b6c3323353d6b6f Mon Sep 17 00:00:00 2001
From: John Doe <hamedhasan422421@gmail.com>
Date: Mon, 11 Sep 2023 17:26:02 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F=20Refactored=20the=20Back?=
 =?UTF-8?q?groundSection=20component=20=E2=9C=A8=20Added=20flexibility=20w?=
 =?UTF-8?q?ith=20className=20prop=20=F0=9F=94=8D=20Improved=20code=20reada?=
 =?UTF-8?q?bility=20=F0=9F=8C=88=20Enhanced=20styling=20options=20?=
 =?UTF-8?q?=F0=9F=9A=80=20Ready=20for=20action!?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/BackgroundSection.tsx | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)
 create mode 100644 src/components/BackgroundSection.tsx

diff --git a/src/components/BackgroundSection.tsx b/src/components/BackgroundSection.tsx
new file mode 100644
index 0000000..fbb36ef
--- /dev/null
+++ b/src/components/BackgroundSection.tsx
@@ -0,0 +1,22 @@
+import React, { FC } from "react";
+
+export interface BackgroundSectionProps {
+  className?: string;
+  children?: React.ReactNode;
+}
+
+const BackgroundSection: FC<BackgroundSectionProps> = ({
+  className = "bg-neutral-100 dark:bg-black dark:bg-opacity-20 ",
+  children,
+}) => {
+  return (
+    <div
+      className={`nc-BackgroundSection absolute inset-y-0 w-screen xl:max-w-[1340px] 2xl:max-w-screen-2xl left-1/2 transform -translate-x-1/2 xl:rounded-[40px] z-0 ${className}`}
+      data-nc-id="BackgroundSection"
+    >
+      {children}
+    </div>
+  );
+};
+
+export default BackgroundSection;