From 9867e7b0439706038d6c2e56502bde0ad7973dc3 Mon Sep 17 00:00:00 2001
From: Mohammad Jalali <muhammad.art79@gmail.com>
Date: Sat, 20 Jan 2024 14:33:21 +0330
Subject: [PATCH] Banner completed

---
 src/components/first/Banner.jsx | 16 ++++++++++++++++
 src/components/first/index.jsx  |  2 ++
 2 files changed, 18 insertions(+)
 create mode 100644 src/components/first/Banner.jsx

diff --git a/src/components/first/Banner.jsx b/src/components/first/Banner.jsx
new file mode 100644
index 0000000..3a8a26a
--- /dev/null
+++ b/src/components/first/Banner.jsx
@@ -0,0 +1,16 @@
+import {Box, Container} from "@mui/material";
+import {useConfig} from "@witel/webapp-builder";
+
+const Banner = () => {
+    const {config} = useConfig();
+    const bannerHTML = config.banner;
+    return (
+        <Box sx={{backgroundColor: "primary.light"}}>
+            <Container sx={{py: 0.7}} maxWidth="xl">
+                <div dangerouslySetInnerHTML={{__html: bannerHTML}}/>
+            </Container>
+        </Box>
+    );
+};
+
+export default Banner;
diff --git a/src/components/first/index.jsx b/src/components/first/index.jsx
index adc1d80..77214bf 100644
--- a/src/components/first/index.jsx
+++ b/src/components/first/index.jsx
@@ -6,6 +6,7 @@ import FooterDetails from "@/components/first/FooterDetails";
 import HeaderDetails from "@/components/first/HeaderDetails";
 import LoanDescription from "@/components/first/LoanDescription";
 import {FullPageLayout} from "@witel/webapp-builder";
+import Banner from "@/components/first/Banner";
 
 const FirstComponent = () => {
     const t = useTranslations();
@@ -14,6 +15,7 @@ const FirstComponent = () => {
         <FullPageLayout>
             <Stack>
                 <HeaderDetails/>
+                <Banner/>
                 <LoanRegister/>
                 <LoanDescription/>
                 <LoanCondition/>