@npm_leadtech/legal-lib-components 5.2.1 → 5.2.3

package/dist/css/styles.css

@@ -2554,6 +2554,9 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
   position: absolute;
   transform: translateY(-115%);
 }
+.expert-card__image img {
+  border-radius: 100%;
+}
 .expert-card__title {
   font-family: "Inter", sans-serif;
   font-size: 18px;
@@ -5073,7 +5076,7 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
   display: flex;
   flex-direction: column;
   justify-content: center;
-  transform: translateY(50px);
+  margin: 2rem 0 3rem 0;
 }
 @media (min-width: 720px) {
   .expert-card-list {
@@ -6403,9 +6406,11 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
+  align-items: center;
 }
 .trustworthy-websites__image {
   margin: 1.5rem;
+  max-width: 8rem;
 }
 .type-modules-list {
   display: flex;
@@ -6844,6 +6849,11 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
   align-self: stretch;
   color: var(--neutral-neutral-1);
 }
+.guidelines-section-main {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+}
 .guidelines-section__texts {
   flex-basis: 50%;
   display: flex;
@@ -6866,7 +6876,6 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
   font-family: "Lora", serif;
   margin-bottom: 2rem;
   text-align: center;
-  color: var(--neutral-neutral-2);
   font-size: 32px;
   font-style: normal;
   font-weight: 400;
@@ -6907,6 +6916,57 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
     display: none;
   }
 }
+.guidelines-section__image.is-mobile img {
+  display: none;
+}
+.guidelines-section-detail {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+  margin: 2rem 0 1rem 0;
+}
+@media (min-width: 960px) {
+  .guidelines-section-detail {
+    flex-direction: row;
+  }
+}
+.guidelines-section-detail__item {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  background: var(--others-white);
+  border-radius: 0.5rem;
+  padding: 1.5rem;
+}
+.guidelines-section-detail__item__image {
+  width: 100%;
+  border-radius: 0.5rem;
+}
+.guidelines-section-detail__item__title {
+  font-family: "Lora", serif;
+  font-style: normal;
+  font-weight: 400;
+  font-size: 24px;
+  line-height: 32px;
+  letter-spacing: -0.3px;
+  color: var(--neutral-neutral-1);
+  margin: 1.5rem 0 1rem 0;
+}
+.guidelines-section-detail__item ul {
+  list-style-type: disc;
+}
+.guidelines-section-detail__item ol {
+  list-style-type: decimal;
+}
+.guidelines-section-detail__item ul,
+.guidelines-section-detail__item ol {
+  margin-left: 1rem;
+  margin-bottom: 1rem;
+}
+.guidelines-section-detail__item ul li,
+.guidelines-section-detail__item ol li {
+  margin-bottom: 0;
+}
 .jumbotron-ratafia-content {
   display: flex;
   flex-direction: column;
@@ -7325,10 +7385,11 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
 }
 .try-our-free-legal-blogs-section__texts__title {
   font-family: "Lora", serif;
-  font-size: 28px;
+  font-size: 32px;
   line-height: 42px;
   margin-bottom: 2rem;
   text-align: center;
+  font-weight: 400;
 }
 @media (min-width: 720px) {
   .try-our-free-legal-blogs-section__texts__title {
@@ -7438,24 +7499,22 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
 }
 .as-seen-in-section-box {
   flex-shrink: 0;
-  border-radius: 4px;
-  background: #fff;
-  box-shadow: 0px 2px 6px 0px rgba(2, 55, 74, 0.25);
-  margin: 2rem;
-  padding: 1rem;
-  max-width: 1200px;
+  background-color: var(--secondary-main-light-5);
 }
 @media (min-width: 960px) {
   .as-seen-in-section-box {
-    margin: 2rem auto;
+    margin-top: 12rem;
   }
 }
 .as-seen-in-section-box .as-seen-in-section {
   display: flex;
   flex-direction: column;
+  box-shadow: 0px 2px 6px 0px rgba(2, 55, 74, 0.25);
+  background: var(--others-white);
+  transform: translateY(-50%);
+  padding: 1.5rem 0;
 }
 .as-seen-in-section-box .as-seen-in-section__title {
-  color: var(--neutral-neutral-2);
   text-align: center;
   font-size: 32px;
   font-family: "Lora", serif;
@@ -7636,8 +7695,8 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
   display: flex;
   justify-content: center;
   flex-direction: column;
-  background-color: var(--neutral-neutral-6);
-  margin-bottom: 8rem;
+  background-color: var(--primary-main-light-6);
+  margin-bottom: 4rem;
 }
 .experts-section__title {
   font-family: "Lora", serif;
@@ -7757,11 +7816,11 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
 .guidelines-section {
   display: flex;
   flex-direction: column;
-}
-@media (min-width: 720px) {
-  .guidelines-section {
-    flex-flow: row nowrap;
-  }
+  align-items: center;
+  background: var(--neutral-neutral-6);
+  padding-top: 2rem;
+  padding-bottom: 2rem;
+  margin-top: 3rem;
 }
 .how-it-works-wrapper {
   background-color: var(--neutral-neutral-6);
@@ -8117,6 +8176,11 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
   margin: 0 auto;
   text-align: center;
 }
+@media (min-width: 1200px) {
+  .people-say {
+    max-width: 1200px;
+  }
+}
 .people-say__title {
   font-family: "Lora", serif;
   font-size: 32px;
@@ -8125,6 +8189,19 @@ html[data-theme=lawdistrict] .document-status.--is-new .icon {
   letter-spacing: -0.3px;
   text-align: center;
 }
+.people-say .richt-text-strapi {
+  text-align: left;
+  margin-top: 2rem;
+}
+.people-say .richt-text-strapi > p,
+.people-say .richt-text-strapi > blockquote {
+  margin-top: 1.5rem;
+}
+.people-say .richt-text-strapi blockquote {
+  padding: 1rem;
+  background: var(--neutral-neutral-6);
+  border-radius: 4px;
+}
 .steps-ratafia-section {
   z-index: 999;
   width: 100%;

package/dist/src/components/atoms/ExpertCard/ExpertCard.scss

@@ -36,6 +36,10 @@
   &__image {
     position: absolute;
     transform: translateY(-115%);
+
+    img {
+      border-radius: 100%;
+    }
   }
 
   &__title {

package/dist/src/components/molecules/ExpertCardList/ExpertCardList.scss

@@ -5,7 +5,7 @@
   display: flex;
   flex-direction: column;
   justify-content: center;
-  transform: translateY(50px);
+  margin: 2rem 0 3rem 0;
 
   @include landscape-tablets {
     flex-direction: row;

package/dist/src/components/molecules/TrustworthyWebsites/TrustworthyWebsites.scss

@@ -5,8 +5,10 @@
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
+  align-items: center;
 
   &__image {
     margin: 1.5rem;
+    max-width: 8rem;
   }
 }

package/dist/src/components/organisms/GuidelinesContent/GuidelinesContent.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { RichTextInner } from '../../atoms';
+import { RichTextInner, RichTextStrapi } from '../../atoms';
 // import './GuidelinesContent.scss'
-const GuidelinesContent = ({ title, image, children }) => {
-    return (_jsxs(_Fragment, { children: [_jsx("div", { className: 'guidelines-section__image big-devices', children: image }), _jsxs("div", { className: 'guidelines-section__texts', children: [_jsx("h2", { className: 'guidelines-section__texts__title', children: title }), _jsx(RichTextInner, { customClass: 'guidelines-section__texts__body', children: children })] }), _jsx("div", { className: 'guidelines-section__image is-mobile', children: image })] }));
+const GuidelinesContent = ({ title, image, detail, children }) => {
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: 'guidelines-section-main wrapper', children: [_jsx("div", { className: 'guidelines-section__image big-devices', children: image }), _jsxs("div", { className: 'guidelines-section__texts', children: [_jsx("h2", { className: 'guidelines-section__texts__title', children: title }), _jsx(RichTextInner, { customClass: 'guidelines-section__texts__body', children: children })] }), _jsx("div", { className: 'guidelines-section__image is-mobile', children: image })] }), Array.isArray(detail) && (_jsx("div", { className: 'guidelines-section-detail wrapper', children: detail.map((item, index) => (_jsxs("div", { className: 'guidelines-section-detail__item', children: [_jsx("div", { className: 'guidelines-section-detail__item__image', children: item.image }), _jsx("div", { className: 'guidelines-section-detail__item__title', children: item.title }), _jsx(RichTextStrapi, { html: item.body?.data?.childMarkdownRemark?.html })] }, index))) }))] }));
 };
 export default GuidelinesContent;

package/dist/src/components/organisms/GuidelinesContent/GuidelinesContent.scss

@@ -2,6 +2,12 @@
 @import '../../../globalStyles/mediaqueries.scss';
 
 .guidelines-section {
+  &-main {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+  }
+
   &__texts {
     flex-basis: 50%;
     display: flex;
@@ -23,7 +29,6 @@
       font-family: $font-serif;
       margin-bottom: 2rem;
       text-align: center;
-      color: get-color(neutral, neutral-2);
       font-size: 32px;
       font-style: normal;
       font-weight: 400;
@@ -65,6 +70,64 @@
       @include landscape-tablets {
         display: none;
       }
+
+      img {
+        display: none;
+      }
+    }
+  }
+
+  &-detail {
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+    margin: 2rem 0 1rem 0;
+
+    @include laptop {
+      flex-direction: row;
+    }
+
+    &__item {
+      display: flex;
+      flex: 1;
+      flex-direction: column;
+      background: get-color(others, white);
+      border-radius: 0.5rem;
+      padding: 1.5rem;
+
+      &__image {
+        width: 100%;
+        border-radius: 0.5rem;
+      }
+
+      &__title {
+        font-family: $font-serif;
+        font-style: normal;
+        font-weight: 400;
+        font-size: 24px;
+        line-height: 32px;
+        letter-spacing: -0.3px;
+        color: get-color(neutral, neutral-1);
+        margin: 1.5rem 0 1rem 0;
+      }
+
+      ul {
+        list-style-type: disc;
+      }
+
+      ol {
+        list-style-type: decimal;
+      }
+
+      ul,
+      ol {
+        margin-left: 1rem;
+        margin-bottom: 1rem;
+
+        li {
+          margin-bottom: 0;
+        }
+      }
     }
   }
 }

package/dist/src/components/organisms/GuidelinesContent/GuidelinesContent.tsx

@@ -1,18 +1,32 @@
+/* eslint-disable @typescript-eslint/no-unsafe-member-access */
 import React, { type FC } from 'react'
 
+import { RichTextInner, RichTextStrapi } from '../../atoms'
 import { type GuidelinesContentProps } from './GuidelinesContentProps.types'
-import { RichTextInner } from '../../atoms'
 // import './GuidelinesContent.scss'
 
-const GuidelinesContent: FC<GuidelinesContentProps> = ({ title, image, children }) => {
+const GuidelinesContent: FC<GuidelinesContentProps> = ({ title, image, detail, children }) => {
   return (
     <>
-      <div className='guidelines-section__image big-devices'>{image}</div>
-      <div className='guidelines-section__texts'>
-        <h2 className='guidelines-section__texts__title'>{title}</h2>
-        <RichTextInner customClass='guidelines-section__texts__body'>{children}</RichTextInner>
+      <div className='guidelines-section-main wrapper'>
+        <div className='guidelines-section__image big-devices'>{image}</div>
+        <div className='guidelines-section__texts'>
+          <h2 className='guidelines-section__texts__title'>{title}</h2>
+          <RichTextInner customClass='guidelines-section__texts__body'>{children}</RichTextInner>
+        </div>
+        <div className='guidelines-section__image is-mobile'>{image}</div>
       </div>
-      <div className='guidelines-section__image is-mobile'>{image}</div>
+      {Array.isArray(detail) && (
+        <div className='guidelines-section-detail wrapper'>
+          {detail.map((item, index) => (
+            <div className='guidelines-section-detail__item' key={index}>
+              <div className='guidelines-section-detail__item__image'>{item.image}</div>
+              <div className='guidelines-section-detail__item__title'>{item.title}</div>
+              <RichTextStrapi html={item.body?.data?.childMarkdownRemark?.html as string} />
+            </div>
+          ))}
+        </div>
+      )}
     </>
   )
 }

package/dist/src/components/organisms/GuidelinesContent/GuidelinesContentProps.types.d.ts

@@ -2,4 +2,5 @@ export interface GuidelinesContentProps {
     title: string;
     image: React.ReactNode;
     children: React.ReactNode;
+    detail?: React.ReactNode;
 }

package/dist/src/components/organisms/GuidelinesContent/GuidelinesContentProps.types.ts

@@ -2,4 +2,5 @@ export interface GuidelinesContentProps {
   title: string
   image: React.ReactNode
   children: React.ReactNode
+  detail?: React.ReactNode
 }

package/dist/src/components/organisms/TryOurFreeLegalBlogsContent/TryOurFreeLegalBlogsContent.scss

@@ -21,10 +21,11 @@
 
     &__title {
       font-family: $font-serif;
-      font-size: 28px;
+      font-size: 32px;
       line-height: 42px;
       margin-bottom: 2rem;
       text-align: center;
+      font-weight: 400;
 
       @include landscape-tablets {
         text-align: left;

package/dist/src/components/pages/AboutUsPage/AboutUsPage.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { AboutUsSection, AsSeeInSection, ExpertsSection, GuidelinesSection, PeopleSayAboutUsSection, TryOurFreeLegalBlogsSection, TryUsSection } from '../../sections';
-export const AboutUsPage = ({ aboutUsSectionProps, tryOurFreeLegalBlogsSectionProps, peopleSayAboutUsSectionProps, guidelinesSectionProps, tryUsSectionProps, expertsSectionProps, asSeeInSectionProps, isJonSnow = false }) => {
-    return (_jsxs(_Fragment, { children: [aboutUsSectionProps != null && _jsx(AboutUsSection, { ...aboutUsSectionProps }), tryOurFreeLegalBlogsSectionProps != null && (_jsx(TryOurFreeLegalBlogsSection, { ...tryOurFreeLegalBlogsSectionProps })), !isJonSnow && peopleSayAboutUsSectionProps != null && (_jsx(PeopleSayAboutUsSection, { ...peopleSayAboutUsSectionProps })), guidelinesSectionProps != null && (_jsx(GuidelinesSection, { ...guidelinesSectionProps, children: guidelinesSectionProps.contentGuidelines?.children })), tryUsSectionProps != null && _jsx(TryUsSection, { ...tryUsSectionProps, children: tryUsSectionProps.children }), expertsSectionProps != null && _jsx(ExpertsSection, { ...expertsSectionProps }), !isJonSnow && asSeeInSectionProps != null && _jsx(AsSeeInSection, { ...asSeeInSectionProps })] }));
+import { AboutUsSection, AsSeeInSection, ExpertsSection, GuidelinesSection, PeopleSayAboutUsSection, TryOurFreeLegalBlogsSection } from '../../sections';
+export const AboutUsPage = ({ aboutUsSectionProps, tryOurFreeLegalBlogsSectionProps, peopleSayAboutUsSectionProps, guidelinesSectionProps, expertsSectionProps, asSeeInSectionProps, isJonSnow = false }) => {
+    return (_jsxs(_Fragment, { children: [aboutUsSectionProps != null && _jsx(AboutUsSection, { ...aboutUsSectionProps }), tryOurFreeLegalBlogsSectionProps != null && (_jsx(TryOurFreeLegalBlogsSection, { ...tryOurFreeLegalBlogsSectionProps })), guidelinesSectionProps != null && (_jsx(GuidelinesSection, { ...guidelinesSectionProps, children: guidelinesSectionProps.contentGuidelines?.children })), expertsSectionProps != null && _jsx(ExpertsSection, { ...expertsSectionProps }), !isJonSnow && peopleSayAboutUsSectionProps != null && (_jsx(PeopleSayAboutUsSection, { ...peopleSayAboutUsSectionProps })), !isJonSnow && asSeeInSectionProps != null && _jsx(AsSeeInSection, { ...asSeeInSectionProps })] }));
 };

package/dist/src/components/pages/AboutUsPage/AboutUsPage.tsx

@@ -7,8 +7,7 @@ import {
   ExpertsSection,
   GuidelinesSection,
   PeopleSayAboutUsSection,
-  TryOurFreeLegalBlogsSection,
-  TryUsSection
+  TryOurFreeLegalBlogsSection
 } from '../../sections'
 import { type AboutUsPageProps } from './AboutUsPageProps'
 
@@ -17,7 +16,6 @@ export const AboutUsPage: React.FC<AboutUsPageProps> = ({
   tryOurFreeLegalBlogsSectionProps,
   peopleSayAboutUsSectionProps,
   guidelinesSectionProps,
-  tryUsSectionProps,
   expertsSectionProps,
   asSeeInSectionProps,
   isJonSnow = false
@@ -28,16 +26,15 @@ export const AboutUsPage: React.FC<AboutUsPageProps> = ({
       {tryOurFreeLegalBlogsSectionProps != null && (
         <TryOurFreeLegalBlogsSection {...tryOurFreeLegalBlogsSectionProps} />
       )}
-      {!isJonSnow && peopleSayAboutUsSectionProps != null && (
-        <PeopleSayAboutUsSection {...peopleSayAboutUsSectionProps} />
-      )}
       {guidelinesSectionProps != null && (
         <GuidelinesSection {...guidelinesSectionProps}>
           {guidelinesSectionProps.contentGuidelines?.children}
         </GuidelinesSection>
       )}
-      {tryUsSectionProps != null && <TryUsSection {...tryUsSectionProps}>{tryUsSectionProps.children}</TryUsSection>}
       {expertsSectionProps != null && <ExpertsSection {...expertsSectionProps} />}
+      {!isJonSnow && peopleSayAboutUsSectionProps != null && (
+        <PeopleSayAboutUsSection {...peopleSayAboutUsSectionProps} />
+      )}
       {!isJonSnow && asSeeInSectionProps != null && <AsSeeInSection {...asSeeInSectionProps} />}
     </>
   )

package/dist/src/components/sections/AsSeeInSection/AsSeeInSection.js

@@ -5,6 +5,6 @@ const AsSeeInSection = ({ title, contentAsSeeIn }) => {
     if (contentAsSeeIn.trustWorthyImages.images.length === 0) {
         return null;
     }
-    return (_jsx("section", { className: 'as-seen-in-section-box', children: _jsxs("div", { className: 'as-seen-in-section', children: [_jsx("h2", { className: 'as-seen-in-section__title', children: title }), _jsx(AsSeeInContent, { trustWorthyImages: contentAsSeeIn.trustWorthyImages, children: contentAsSeeIn.children })] }) }));
+    return (_jsx("section", { className: 'as-seen-in-section-box', children: _jsxs("div", { className: 'as-seen-in-section wrapper', children: [_jsx("h2", { className: 'as-seen-in-section__title', children: title }), _jsx(AsSeeInContent, { trustWorthyImages: contentAsSeeIn.trustWorthyImages, children: contentAsSeeIn.children })] }) }));
 };
 export default AsSeeInSection;

package/dist/src/components/sections/AsSeeInSection/AsSeeInSection.scss

@@ -3,23 +3,21 @@
 
 .as-seen-in-section-box {
   flex-shrink: 0;
-  border-radius: 4px;
-  background: #fff;
-  box-shadow: 0px 2px 6px 0px rgba(2, 55, 74, 0.25);
-  margin: 2rem;
-  padding: 1rem;
-  max-width: 1200px;
+  background-color: get-color(secondary, main-light-5);
 
   @include laptop {
-    margin: 2rem auto;
+    margin-top: 12rem;
   }
 
   .as-seen-in-section {
     display: flex;
     flex-direction: column;
+    box-shadow: 0px 2px 6px 0px rgba(2, 55, 74, 0.25);
+    background: get-color(others, white);
+    transform: translateY(-50%);
+    padding: 1.5rem 0;
 
     &__title {
-      color: get-color(neutral, neutral-2);
       text-align: center;
       font-size: 32px;
       font-family: $font-serif;

package/dist/src/components/sections/AsSeeInSection/AsSeeInSection.tsx

@@ -11,7 +11,7 @@ const AsSeeInSection: FC<AsSeeInSectionProps> = ({ title, contentAsSeeIn }) => {
 
   return (
     <section className='as-seen-in-section-box'>
-      <div className='as-seen-in-section'>
+      <div className='as-seen-in-section wrapper'>
         <h2 className='as-seen-in-section__title'>{title}</h2>
         <AsSeeInContent trustWorthyImages={contentAsSeeIn.trustWorthyImages}>{contentAsSeeIn.children}</AsSeeInContent>
       </div>

package/dist/src/components/sections/ExpertsSection/ExpertsSection.scss

@@ -5,8 +5,8 @@
   display: flex;
   justify-content: center;
   flex-direction: column;
-  background-color: get-color(neutral, neutral-6);
-  margin-bottom: 8rem;
+  background-color: get-color(primary, main-light-6);
+  margin-bottom: 4rem;
 
   &__title {
     font-family: $font-serif;

package/dist/src/components/sections/GuidelinesSection/GuidelinesSection.js

@@ -2,6 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { GuidelinesContent } from '../../organisms/GuidelinesContent';
 // import './GuidelinesSection.scss'
 const GuidelinesSection = ({ contentGuidelines }) => {
-    return (_jsx("section", { className: 'guidelines-section wrapper wrapper--responsive', children: _jsx(GuidelinesContent, { title: contentGuidelines.title, image: contentGuidelines.image, children: contentGuidelines.children }) }));
+    return (_jsx("section", { className: 'guidelines-section', children: _jsx(GuidelinesContent, { title: contentGuidelines.title, image: contentGuidelines.image, detail: contentGuidelines.detail, children: contentGuidelines.children }) }));
 };
 export default GuidelinesSection;

package/dist/src/components/sections/GuidelinesSection/GuidelinesSection.scss

@@ -4,8 +4,9 @@
 .guidelines-section {
   display: flex;
   flex-direction: column;
-
-  @include landscape-tablets {
-    flex-flow: row nowrap;
-  }
+  align-items: center;
+  background: get-color(neutral, neutral-6);
+  padding-top: 2rem;
+  padding-bottom: 2rem;
+  margin-top: 3rem;
 }

package/dist/src/components/sections/GuidelinesSection/GuidelinesSection.tsx

@@ -6,8 +6,12 @@ import { type GuidelinesSectionProps } from './GuidelinesSectionProps.types'
 
 const GuidelinesSection: FC<GuidelinesSectionProps> = ({ contentGuidelines }) => {
   return (
-    <section className='guidelines-section wrapper wrapper--responsive'>
-      <GuidelinesContent title={contentGuidelines.title} image={contentGuidelines.image}>
+    <section className='guidelines-section'>
+      <GuidelinesContent
+        title={contentGuidelines.title}
+        image={contentGuidelines.image}
+        detail={contentGuidelines.detail}
+      >
         {contentGuidelines.children}
       </GuidelinesContent>
     </section>

package/dist/src/components/sections/PeopleSayAboutUsSection/PeopleSayAboutUsSection.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { TrustPilot } from '../../atoms';
 // import './PeopleSayAboutUsSection.scss'
-const PeopleSayAboutUsSection = ({ title, contentTrustPilot }) => {
-    return (_jsxs("section", { className: 'people-say', children: [Boolean(title) && _jsx("h2", { className: 'people-say__title', children: title }), _jsx(TrustPilot, { children: contentTrustPilot.children })] }));
+const PeopleSayAboutUsSection = ({ title, testimonialsSectionContent, contentTrustPilot }) => {
+    return (_jsxs("section", { className: 'people-say', children: [Boolean(title) && _jsx("h2", { className: 'people-say__title', children: title }), testimonialsSectionContent, _jsx(TrustPilot, { children: contentTrustPilot.children })] }));
 };
 export default PeopleSayAboutUsSection;

package/dist/src/components/sections/PeopleSayAboutUsSection/PeopleSayAboutUsSection.scss

@@ -6,6 +6,10 @@
   margin: 0 auto;
   text-align: center;
 
+  @include desktop {
+    max-width: $max-width;
+  }
+
   &__title {
     font-family: $font-serif;
     font-size: 32px;
@@ -14,4 +18,20 @@
     letter-spacing: -0.3px;
     text-align: center;
   }
+
+  .richt-text-strapi {
+    text-align: left;
+    margin-top: 2rem;
+
+    > p,
+    > blockquote {
+      margin-top: 1.5rem;
+    }
+
+    blockquote {
+      padding: 1rem;
+      background: var(--neutral-neutral-6);
+      border-radius: 4px;
+    }
+  }
 }

package/dist/src/components/sections/PeopleSayAboutUsSection/PeopleSayAboutUsSection.tsx

@@ -4,10 +4,15 @@ import { type PeopleSayAboutUsSectionProps } from './PeopleSayAboutUsSectionProp
 import { TrustPilot } from '../../atoms'
 // import './PeopleSayAboutUsSection.scss'
 
-const PeopleSayAboutUsSection: FC<PeopleSayAboutUsSectionProps> = ({ title, contentTrustPilot }) => {
+const PeopleSayAboutUsSection: FC<PeopleSayAboutUsSectionProps> = ({
+  title,
+  testimonialsSectionContent,
+  contentTrustPilot
+}) => {
   return (
     <section className='people-say'>
       {Boolean(title) && <h2 className='people-say__title'>{title}</h2>}
+      {testimonialsSectionContent}
       <TrustPilot>{contentTrustPilot.children}</TrustPilot>
     </section>
   )

package/dist/src/components/sections/PeopleSayAboutUsSection/PeopleSayAboutUsSectionProps.types.d.ts

@@ -1,5 +1,6 @@
 import { type TrustPilotProps } from '../../atoms/TrustPilot';
 export interface PeopleSayAboutUsSectionProps {
     title?: string;
+    testimonialsSectionContent?: string;
     contentTrustPilot: TrustPilotProps;
 }

package/dist/src/components/sections/PeopleSayAboutUsSection/PeopleSayAboutUsSectionProps.types.ts

@@ -2,5 +2,6 @@ import { type TrustPilotProps } from '../../atoms/TrustPilot'
 
 export interface PeopleSayAboutUsSectionProps {
   title?: string
+  testimonialsSectionContent?: string
   contentTrustPilot: TrustPilotProps
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@npm_leadtech/legal-lib-components",
-  "version": "5.2.1",
+  "version": "5.2.3",
   "license": "ISC",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",