feat(WEB-250): overview hero final ui

components/Loyalty/Blocks/DynamicContent/index.tsx

@@ -1,5 +1,6 @@
 import Link from "@/components/TempDesignSystem/Link"
-import Title from "@/components/Title"
+import Subtitle from "@/components/TempDesignSystem/Subtitle"
+import Title from "@/components/TempDesignSystem/Title"
 
 import HowItWorks from "./HowItWorks"
 import LoyaltyLevels from "./LoyaltyLevels"
@@ -36,36 +37,21 @@ export default function DynamicContent({
   )
   return (
     <section className={styles.container}>
-      {displayHeader && (
+      {displayHeader ? (
         <header className={styles.titleContainer}>
-          {dynamicContent.title && (
-            <Title
-              as="h3"
-              level="h2"
-              className={styles.title}
-              weight="semiBold"
-              uppercase
-            >
-              {dynamicContent.title}
-            </Title>
-          )}
+          <Title as="h3" className={styles.title} level="h2">
+            {dynamicContent.title}
+          </Title>
           {dynamicContent.link ? (
             <Link className={styles.link} href={dynamicContent.link.href}>
               {dynamicContent.link.text}
             </Link>
           ) : null}
-          {dynamicContent.subtitle && (
-            <Title
-              as="h5"
-              level="h3"
-              weight="regular"
-              className={styles.subtitle}
-            >
-              {dynamicContent.subtitle}
-            </Title>
-          )}
+          <Subtitle className={styles.subtitle}>
+            {dynamicContent.subtitle}
+          </Subtitle>
         </header>
-      )}
+      ) : null}
       <DynamicComponentBlock component={dynamicContent.component} />
     </section>
   )