From 99de2dea2e3a44cb1e26059d211d5f87dcb1187d Mon Sep 17 00:00:00 2001
From: "younghoon100.park" <younghoon100.park@lgepartner.com>
Date: Fri, 26 Jan 2024 13:50:25 +0900
Subject: [PATCH] =?UTF-8?q?[components]=20SectionTitle=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Detail Notes :

1. HomePaenl, FeaturedPanel, CategoryPanel 등에 사용되는 SectionTitle 추가
---
 .../components/SectionTitle/SectionTitle.jsx    | 17 +++++++++++++++++
 .../SectionTitle/SectionTitle.module.less       | 15 +++++++++++++++
 .../src/components/SectionTitle/package.json    |  6 ++++++
 3 files changed, 38 insertions(+)
 create mode 100644 com.twin.app.shoptime/src/components/SectionTitle/SectionTitle.jsx
 create mode 100644 com.twin.app.shoptime/src/components/SectionTitle/SectionTitle.module.less
 create mode 100644 com.twin.app.shoptime/src/components/SectionTitle/package.json

diff --git a/com.twin.app.shoptime/src/components/SectionTitle/SectionTitle.jsx b/com.twin.app.shoptime/src/components/SectionTitle/SectionTitle.jsx
new file mode 100644
index 00000000..994392a6
--- /dev/null
+++ b/com.twin.app.shoptime/src/components/SectionTitle/SectionTitle.jsx
@@ -0,0 +1,17 @@
+import React, { memo } from "react";
+
+import classNames from "classnames";
+
+import css from "./SectionTitle.module.less";
+
+export default memo(function SectionTitle({ className, title, ...rest }) {
+  return (
+    <h2
+      className={classNames(className ? className : css.sectionTitle)}
+      {...rest}
+    >
+      <span />
+      {title}
+    </h2>
+  );
+});
diff --git a/com.twin.app.shoptime/src/components/SectionTitle/SectionTitle.module.less b/com.twin.app.shoptime/src/components/SectionTitle/SectionTitle.module.less
new file mode 100644
index 00000000..27706026
--- /dev/null
+++ b/com.twin.app.shoptime/src/components/SectionTitle/SectionTitle.module.less
@@ -0,0 +1,15 @@
+@import "../../style/CommonStyle.module.less";
+@import "../../style/utils.module.less";
+
+.sectionTitle {
+  .flex(@justifyCenter: flex-start);
+  gap: 12px;
+  .font(@fontFamily: @baseFontBold, @fontSize: 42px);
+  color: @COLOR_GRAY08;
+
+  span {
+    display: inline-block;
+    .size(@w: 6px, @h: 36px);
+    background-color: @PRIMARY_COLOR_RED;
+  }
+}
diff --git a/com.twin.app.shoptime/src/components/SectionTitle/package.json b/com.twin.app.shoptime/src/components/SectionTitle/package.json
new file mode 100644
index 00000000..90dfcdc0
--- /dev/null
+++ b/com.twin.app.shoptime/src/components/SectionTitle/package.json
@@ -0,0 +1,6 @@
+{
+  "main": "SectionTitle.jsx",
+  "styles": [
+    "SectionTitle.module.less"
+  ]
+}