updates(static page): align templates according to new template requi…

…rement (#371)
eclipse-tractusx · Nov 28, 2023 · 8728693 · 8728693
1 parent fdbad96
commit 8728693
Show file tree

Hide file tree

Showing 2 changed files with 82 additions and 72 deletions.
diff --git a/...nents/shared/templates/StaticTemplateResponsive/Cards/TextImageSideBySideWithSections.tsx b/...nents/shared/templates/StaticTemplateResponsive/Cards/TextImageSideBySideWithSections.tsx
@@ -56,54 +56,6 @@ export default function TextImageSideBySideWithSections({
             provider={provider}
             scrollTop={scrollTop}
           />
-          {provider.subDescriptions && (
-            <>
-              <Typography className={'providerDescription'}>
-                <Trans
-                  key={provider.subDescriptions.title}
-                  i18nKey={provider.subDescriptions.title}
-                  components={[
-                    <span key={provider.subDescriptions.title}></span>,
-                    <br key={provider.subDescriptions.title} />,
-                    <p
-                      key={provider.subDescriptions.title}
-                      className="padding-left-30"
-                    ></p>,
-                  ]}
-                ></Trans>
-              </Typography>
-              {provider?.subDescriptions?.sections?.length > 0 &&
-                provider?.subDescriptions?.sections.map(
-                  (section: { title: string; link: string; value: string }) => (
-                    <>
-                      <Typography>
-                        <Trans
-                          key={section.title}
-                          i18nKey={section.title}
-                          components={[
-                            <span key={section.title}></span>,
-                            <br key={section.title} />,
-                            <span
-                              key={section.title}
-                              className="subDescription"
-                            ></span>,
-                          ]}
-                        ></Trans>
-                      </Typography>
-                      <Typography
-                        className={
-                          'padding-left-30 highlightText padding-bottom-20'
-                        }
-                        onClick={() => window.open(section.link, '_blank')}
-                        key={section.value}
-                      >
-                        {section.value}
-                      </Typography>
-                    </>
-                  )
-                )}
-            </>
-          )}
           {provider.detailsWithoutImageRow1 && (
             <Box
               className={'gridStyle'}
@@ -134,6 +86,60 @@ export default function TextImageSideBySideWithSections({
           />
         )}
       </div>
+      <div
+        style={{
+          margin: isMobile ? '0px 0px 0px 20px' : '-20px 0px 0px 70px',
+        }}
+      >
+        {provider.subDescriptions && (
+          <>
+            <Typography className={'providerDescription'}>
+              <Trans
+                key={provider.subDescriptions.title}
+                i18nKey={provider.subDescriptions.title}
+                components={[
+                  <span key={provider.subDescriptions.title}></span>,
+                  <br key={provider.subDescriptions.title} />,
+                  <p
+                    key={provider.subDescriptions.title}
+                    className="padding-left-30"
+                  ></p>,
+                ]}
+              ></Trans>
+            </Typography>
+            {provider?.subDescriptions?.sections?.length > 0 &&
+              provider?.subDescriptions?.sections.map(
+                (section: { title: string; link: string; value: string }) => (
+                  <>
+                    <Typography>
+                      <Trans
+                        key={section.title}
+                        i18nKey={section.title}
+                        components={[
+                          <span key={section.title}></span>,
+                          <br key={section.title} />,
+                          <span
+                            key={section.title}
+                            className="subDescription"
+                          ></span>,
+                        ]}
+                      ></Trans>
+                    </Typography>
+                    <Typography
+                      className={
+                        'padding-left-30 highlightText padding-bottom-20'
+                      }
+                      onClick={() => window.open(section.link, '_blank')}
+                      key={section.value}
+                    >
+                      {section.value}
+                    </Typography>
+                  </>
+                )
+              )}
+          </>
+        )}
+      </div>
       {provider.subsections && (
         <>
           {provider.subsections.map((section) => (

diff --git a/...onents/shared/templates/StaticTemplateResponsive/Cards/TitleDescriptionAndSectionlink.tsx b/...onents/shared/templates/StaticTemplateResponsive/Cards/TitleDescriptionAndSectionlink.tsx
@@ -48,30 +48,34 @@ export default function TitleDescriptionAndSectionlink({
   }
   return (
     <>
-      <div className="titleWithIcon sideBySideTitle">
-        {defaultTitleVariation ? (
-          <>
-            <Typography variant="h2">{provider.title}</Typography>
-            {showScroll && (
-              <IconButton onClick={scrollTop}>
-                <ArrowUpwardIcon />
-              </IconButton>
-            )}
-          </>
-        ) : (
-          <Typography variant="h3">{provider.title}</Typography>
-        )}
-      </div>
-      <Typography className={'providerDescription'}>
-        <Trans
-          key={provider.description}
-          i18nKey={provider.description}
-          components={[
-            <span key={provider.description}></span>,
-            <br key={provider.description} />,
-          ]}
-        ></Trans>
-      </Typography>
+      {provider.title !== '' && (
+        <div className="titleWithIcon sideBySideTitle">
+          {defaultTitleVariation ? (
+            <>
+              <Typography variant="h2">{provider.title}</Typography>
+              {showScroll && (
+                <IconButton onClick={scrollTop}>
+                  <ArrowUpwardIcon />
+                </IconButton>
+              )}
+            </>
+          ) : (
+            <Typography variant="h3">{provider.title}</Typography>
+          )}
+        </div>
+      )}
+      {provider.description !== '' && (
+        <Typography className={'providerDescription'}>
+          <Trans
+            key={provider.description}
+            i18nKey={provider.description}
+            components={[
+              <span key={provider.description}></span>,
+              <br key={provider.description} />,
+            ]}
+          ></Trans>
+        </Typography>
+      )}
       {provider.sectionLink && (
         <>
           {provider.sectionLink.data.map((link) => (