Bugfix/52 bundle fix

nextjs/src/app/homepage.tsx

@@ -125,21 +125,21 @@ export default async function Homepage({
                 </SectionCardWide>
               )
             })}
-            {meet_our_partners && (
-              <Container background="white" padding="both-padding">
-                <SectionGroup
-                  title={meet_our_partners.title}
-                  text={meet_our_partners.intro}
-                  align="center"
-                >
-                  <ButtonGroup
-                    ctas={meet_our_partners.ctas.map(mapCta)}
-                    align={"center"}
-                  />
-                  <Hallmarks hallmarksId={our_partners.documentId} />
-                </SectionGroup>
-              </Container>
-            )}
+          </SectionGroup>
+        </Container>
+      )}
+      {meet_our_partners && (
+        <Container background="white" padding="both-padding">
+          <SectionGroup
+            title={meet_our_partners.title}
+            text={meet_our_partners.intro}
+            align="center"
+          >
+            <ButtonGroup
+              ctas={meet_our_partners.ctas.map(mapCta)}
+              align={"center"}
+            />
+            <Hallmarks hallmarksId={our_partners.documentId} />
           </SectionGroup>
         </Container>
       )}

nextjs/src/components/cards/card-icon.tsx

@@ -32,19 +32,27 @@ const CardIcon: React.FC<CardIconProps> = ({
           src={imageUrl}
           width={300}
           height={300}
-          className="max-h-20"
+          className="h-20 mb-6 mx-auto"
         />
       )}
-      <Title level={3} boldness={"semibold"} align={"center"}>
+      <Title
+        level={3}
+        boldness={"semibold"}
+        align={"center"}
+        className="mb-6 lg:mb-1 lg:min-h-[2lh]"
+      >
         {title}
       </Title>
-      <Text markdown={description} className="text-center " />
+      <Text
+        markdown={description}
+        className="text-center self-start lg:flex-grow mb-6"
+      />
       {cta && (
         <Link
           href={cta.href}
           variant={"secondary"}
           size={"small"}
-          className="px-4"
+          className="px-4 self-center"
         >
           {cta.text}
         </Link>

nextjs/src/components/title.tsx

@@ -1,4 +1,5 @@
 import { cva, VariantProps } from "class-variance-authority"
+import clsx from "clsx"
 import React from "react"
 import Markdown from "react-markdown"
 import remarkGfm from "remark-gfm"
@@ -34,10 +35,18 @@ type ChildrenORString =
   | {
       children: React.ReactNode
       markdown?: never
+      /**
+       * @warning only use className for positioning utilities.
+       */
+      className?: string
     }
   | {
       markdown: string
       children?: never
+      /**
+       * @warning only use className for positioning utilities.
+       */
+      className?: string
     }
 type TitleProps = VariantProps<typeof titleStyles> & ChildrenORString
 
@@ -53,6 +62,7 @@ const Title: React.FC<TitleProps> = ({
   children,
   markdown,
   boldness,
+  className,
 }) => {
   if (markdown) {
     const headingLevel = markdown.startsWith("###")
@@ -64,15 +74,20 @@ const Title: React.FC<TitleProps> = ({
     return (
       <Markdown
         remarkPlugins={[remarkGfm]}
-        className={titleStyles({ level: headingLevel, align, boldness })}
+        className={clsx([
+          titleStyles({ level: headingLevel, align, boldness }),
+          className,
+        ])}
       >
         {markdown}
       </Markdown>
     )
   }
   const Tag = `h${level || 2}` as keyof JSX.IntrinsicElements
   return (
-    <Tag className={titleStyles({ level, align, boldness })}>{children}</Tag>
+    <Tag className={clsx([titleStyles({ level, align, boldness })], className)}>
+      {children}
+    </Tag>
   )
 }