SBIT-91: Crear y agregar componente text a home y landing Page

src/components/HomePage/HomeContainer/HomeContainer.js

@@ -12,14 +12,16 @@ import VideoBackground from "../../videoBackground/VideoBackground"
 import Hero from "../../Hero/Hero"
 import DualSection from "../../DualSection/DualSection"
 import OneSection from "../../DualSection/OneSection"
+import Text from "../../Text/Text"
 
 const bodyComponents = {
   "home.hero": data => <Hero data={data} />,
   "home.transition": data => <AnimatedTransitionContinous data={data} />,
   "home.quote": data => <Quote data={data} />,
   "home.video-background": data => <VideoBackground data={data} />,
+  "components.text": data => <Text data={data} />,
   "home.dual-section": data =>
-  data.dualSectionPart.length === 1 ? (
+    data.dualSectionPart.length === 1 ? (
       <OneSection data={data} />
     ) : (
       <DualSection data={data} />

src/components/Text/Text.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import MarkdownView from "react-showdown";
+import './Text.scss';
+
+export default function Text({ data }) {
+    console.log(data)
+    const title = data?.title;
+    const description = data?.text;
+
+    return (
+        <div className="text container my-3 d-flex flex-column flex-lg-row">
+
+            {title && (
+                <h2 className="title me-3 mt-5 p-lg-2">{title}</h2>
+            )}
+            {description && (
+                <MarkdownView markdown={description} className="description px-lg-5" />
+            )}
+        </div>
+    )
+}

src/components/Text/Text.scss

@@ -0,0 +1,7 @@
+@import "../../styles/global.scss";
+
+.text {
+  .title {
+    text-transform: uppercase;
+  }
+}

src/templates/LandingPage.js

@@ -9,6 +9,7 @@ import BannerList from "../components/BannerList/BannerLis"
 import ExpandGrid from "../components/expandGrid/ExpandGrid"
 import Catsone from "../components/Catsone/catsone"
 import BannerHead from '../components/BannerHead/BannerHead';
+import Text from '../components/Text/Text';
 
 const LandingPage = ({ data, location }) => {
   const pageData = data?.allStrapiLandingPage?.nodes[0]
@@ -42,7 +43,10 @@ const LandingPage = ({ data, location }) => {
       <BannerHead data={component} /> :
       null
 
-      const logosSection = component.strapi_component === "components.logos-section" ?
+    const text = component.strapi_component === "components.text" ?
+      <Text data={component} /> :
+      null
+    const logosSection = component.strapi_component === "components.logos-section" ?
       <LogosSection data={component} /> :
       null
 
@@ -56,6 +60,7 @@ const LandingPage = ({ data, location }) => {
           {casesList}
           {catsone}
           {bannerHead}
+          {text}
           {logosSection}
         </>
       </div>