ADAPT-1997: extended Title and Intro text accross the entire section (#…

…173) * ADAPT-1997: extended Title and Intro text accross the entire section * ADAPT-1997: improved conditions to avoid regressions in other components * ADAPT-1997: improvement to avoid code duplication * ADAPT-1997: adjusted updates for Centered container for all types of Content width * Update src/components/layout/section.js Co-authored-by: Yvonne Tang <[email protected]> * Update src/components/layout/section.js Co-authored-by: Yvonne Tang <[email protected]> Co-authored-by: Yvonne Tang <[email protected]>
SU-SWS · Mar 31, 2021 · d3cf9a1 · d3cf9a1
1 parent 53627a9
commit d3cf9a1
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 7 deletions.
diff --git a/src/components/layout/section.js b/src/components/layout/section.js
@@ -26,18 +26,18 @@ const Section = (props) => {
            id={props.blok.id}
       >
         {(props.blok.title || props.blok.intro) && (
-          <CenteredContainer flex={true} srOnly={props.blok.srOnlyHeader} classes={"section__header"}>
+          <CenteredContainer flex={true} centered_disabled={props.blok.disableWrapping} srOnly={props.blok.srOnlyHeader} classes={"section__header"}>
             {props.blok.title &&
               <Heading
-                className={`section__title flex-lg-5-of-12 su-serif su-bold su-text-align-left
-                            ${props.blok.titleSize}
-                            su-before-bg-${props.blok.tabColor}
-                            ${titleStyleClassList(props.blok.titleStyle)}`}>
+                className={`section__title su-serif su-bold su-text-align-left
+                  ${props.blok.titleSize}
+                  su-before-bg-${props.blok.tabColor}
+                  ${titleStyleClassList(props.blok.titleStyle)}`}>
                 {props.blok.title}
               </Heading>
             }
             {props.blok.intro &&
-              <FlexCell lg={7} classes={"intro-text section__intro su-mr-none"}><RichTextField data={props.blok.intro}/></FlexCell>
+              <FlexCell classes={"intro-text section__intro su-ml-none"}><RichTextField data={props.blok.intro}/></FlexCell>
             }
           </CenteredContainer>
         )}

diff --git a/src/components/partials/centeredContainer.js b/src/components/partials/centeredContainer.js
@@ -4,7 +4,8 @@ const CenteredContainer = (props) => {
   const Element = props.element ?? "div";
 
   return (
-    <Element className={`centered-container
+    <Element className={`
+       ${props.centered_disabled ? "" : "centered-container"}
        ${props.flex ? "flex-container" : ""}
        ${props.srOnly ? "su-sr-only-element" : ""}
        ${props.classes ?? ""}