From 5169b0e93d624ad443e2625f6b2b1e74c3b17eb8 Mon Sep 17 00:00:00 2001
From: John Doe <hamedhasan422421@gmail.com>
Date: Sat, 9 Sep 2023 17:10:50 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20Refactor=20NcPlayIcon=20componen?=
 =?UTF-8?q?t=20=F0=9F=91=B7=E2=80=8D=E2=99=82=EF=B8=8F=20Updated=20compone?=
 =?UTF-8?q?nt=20structure=20=F0=9F=8E=A8=20Improved=20styling=20and=20read?=
 =?UTF-8?q?ability=20=F0=9F=9A=80=20Ready=20for=20enhanced=20functionality?=
 =?UTF-8?q?=20=F0=9F=93=9D=20Added=20missing=20documentation?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

diff --git a/src/shared/NcPlayIcon.tsx b/src/shared/NcPlayIcon.tsx
new file mode 100644
index 0000000..cfc1287
--- /dev/null
+++ b/src/shared/NcPlayIcon.tsx
@@ -0,0 +1,36 @@
+import React, { FC } from "react";
+
+export interface NcPlayIconProps {
+  className?: string;
+}
+
+const NcPlayIcon: FC<NcPlayIconProps> = ({ className = "" }) => {
+  return (
+    <div
+      className={`nc-NcPlayIcon bg-white bg-opacity-30 backdrop-filter backdrop-blur rounded-full w-20 h-20 p-3 lg:w-52 lg:h-52 lg:p-12 ${className}`}
+      data-nc-id="NcPlayIcon"
+    >
+      <div className="w-full h-full bg-white rounded-full text-primary-500 relative">
+        <span className="absolute inset-0 flex items-center justify-center">
+          <svg
+            className="w-8 h-8 md:w-12 md:h-12"
+            width="24"
+            height="24"
+            fill="currentColor"
+            viewBox="0 0 24 24"
+          >
+            <path
+              stroke="currentColor"
+              strokeLinecap="round"
+              strokeLinejoin="round"
+              strokeWidth="1.5"
+              d="M18.25 12L5.75 5.75V18.25L18.25 12Z"
+            ></path>
+          </svg>
+        </span>
+      </div>
+    </div>
+  );
+};
+
+export default NcPlayIcon;