From 87d34ab25a1f0936dad2b25a0206f16efc5252c5 Mon Sep 17 00:00:00 2001 From: jejolare Date: Thu, 20 Mar 2025 23:27:43 +0700 Subject: [PATCH] init banner --- src/assets/UI/banner_background.svg | 134 ++++++++++++++++++ src/assets/icons/continue.svg | 4 + src/components/StartArticle/StartArticle.jsx | 13 +- .../StartArticle/StartArticle.module.css | 6 + 4 files changed, 156 insertions(+), 1 deletion(-) create mode 100644 src/assets/UI/banner_background.svg create mode 100644 src/assets/icons/continue.svg diff --git a/src/assets/UI/banner_background.svg b/src/assets/UI/banner_background.svg new file mode 100644 index 0000000..fbe3aed --- /dev/null +++ b/src/assets/UI/banner_background.svg @@ -0,0 +1,134 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/icons/continue.svg b/src/assets/icons/continue.svg new file mode 100644 index 0000000..1b55a59 --- /dev/null +++ b/src/assets/icons/continue.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/components/StartArticle/StartArticle.jsx b/src/components/StartArticle/StartArticle.jsx index c72995d..c8aae2a 100644 --- a/src/components/StartArticle/StartArticle.jsx +++ b/src/components/StartArticle/StartArticle.jsx @@ -1,8 +1,12 @@ import React from "react"; import styles from "./StartArticle.module.css"; import TextBlock from "../TextBlock/TextBlock"; +import BannerBackground from "../../assets/UI/banner_background.svg"; function StartArticle({ content }) { + + const contentAfterBanner = content.slice(1); + return (
@@ -16,7 +20,14 @@ function StartArticle({ content }) { functionalities, and opportunities.
- {content.map((item) => ( + +
+
+ +
+
+ + {contentAfterBanner.map((item) => ( ))} diff --git a/src/components/StartArticle/StartArticle.module.css b/src/components/StartArticle/StartArticle.module.css index 1174ce4..b5eb093 100644 --- a/src/components/StartArticle/StartArticle.module.css +++ b/src/components/StartArticle/StartArticle.module.css @@ -12,3 +12,9 @@ display: flex; flex-direction: column; } + +.banner_wrapper { + display: flex; + justify-content: center; + align-items: center; +} \ No newline at end of file