@opensite/ui 0.6.6 → 0.6.7

package/dist/blog-featured-popular.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
-import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CEpDen8-.cjs';
+import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-ez1YunjX.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-Dk2BrJ5f.cjs';
 import 'class-variance-authority/types';
 
 interface BlogFeaturedPopularProps {

package/dist/blog-featured-popular.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
-import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-C3GSBVWt.js';
+import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-BoTnHIZ4.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-Dk2BrJ5f.js';
 import 'class-variance-authority/types';
 
 interface BlogFeaturedPopularProps {

package/dist/blog-featured-popular.js

@@ -882,7 +882,7 @@ function BlogFeaturedPopular({
               src: featuredPost.image,
               alt: typeof featuredPost.title === "string" ? featuredPost.title : "Featured post",
               className: cn(
-                "aspect-video rounded-lg object-cover",
+                "aspect-video rounded-lg object-cover w-full h-auto",
                 featuredImageClassName
               ),
               optixFlowConfig
@@ -954,28 +954,37 @@ function BlogFeaturedPopular({
       pattern,
       patternOpacity,
       children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
-        (heading || description) && /* @__PURE__ */ jsxs("div", { className: cn("mb-16 text-center", headerClassName), children: [
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
-            "h1",
-            {
-              className: cn(
-                "text-5xl font-medium md:text-6xl",
-                headingClassName
-              ),
-              children: heading
-            }
-          ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx(
-            "p",
-            {
-              className: cn(
-                "mx-auto mt-4 max-w-xl text-lg text-muted-foreground",
-                descriptionClassName
-              ),
-              children: description
-            }
-          ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
-        ] }),
+        (heading || description) && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "mb-6 md:mb-16 text-center px-8 md:px-0",
+              headerClassName
+            ),
+            children: [
+              heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+                "h1",
+                {
+                  className: cn(
+                    "text-4xl font-bold md:text-5xl text-balance",
+                    headingClassName
+                  ),
+                  children: heading
+                }
+              ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsx(
+                "p",
+                {
+                  className: cn(
+                    "mx-auto mt-4 max-w-xl text-lg text-muted-foreground text-balance",
+                    descriptionClassName
+                  ),
+                  children: description
+                }
+              ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
+            ]
+          }
+        ),
         /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-7xl", children: [
           renderedFeaturedPost,
           popularHeading && (typeof popularHeading === "string" ? /* @__PURE__ */ jsx(

package/dist/blog-filtered-results.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
-import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CEpDen8-.cjs';
+import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-ez1YunjX.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-Dk2BrJ5f.cjs';
 import 'class-variance-authority/types';
 
 /**

package/dist/blog-filtered-results.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
-import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-C3GSBVWt.js';
+import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-BoTnHIZ4.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-Dk2BrJ5f.js';
 import 'class-variance-authority/types';
 
 /**

package/dist/blog-grid-author-cards.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
-import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CEpDen8-.cjs';
+import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-ez1YunjX.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-Dk2BrJ5f.cjs';
 import 'class-variance-authority/types';
 
 interface BlogGridAuthorCardsProps {

package/dist/blog-grid-author-cards.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
-import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-C3GSBVWt.js';
+import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-BoTnHIZ4.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-Dk2BrJ5f.js';
 import 'class-variance-authority/types';
 
 interface BlogGridAuthorCardsProps {

package/dist/blog-grid-nine-posts.cjs

@@ -972,7 +972,7 @@ function BlogGridNinePosts({
               }
             ) }) }),
             (post.label || post.category) && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: post.label || post.category }) }),
-            post.title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 line-clamp-3 pt-4 text-lg font-medium wrap-break-word md:mb-3 md:pt-4 md:text-2xl lg:pt-4 lg:text-3xl", children: post.title }),
+            post.title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 line-clamp-3 pt-4 text-lg font-medium wrap-break-word md:mb-3", children: post.title }),
             (post.summary || post.description) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 line-clamp-2 text-sm text-muted-foreground md:mb-5 md:text-base", children: post.summary || post.description }),
             (post.author || post.authorAvatar) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsxRuntime.jsxs(Avatar, { className: "size-12", children: [
@@ -1000,11 +1000,11 @@ function BlogGridNinePosts({
       patternOpacity,
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-8 md:mb-14 lg:mb-16", headerClassName), children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start justify-between gap-8", children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start justify-between gap:4 md:gap-8", children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "h2",
             {
               className: cn(
-                "mb-4 w-full text-4xl font-medium md:mb-5 md:text-5xl lg:mb-6 lg:text-6xl",
+                "mb-4 w-full text-4xl font-bold md:mb-5 lg:mb-6 lg:text-5xl text-balance",
                 headingClassName
               ),
               children: heading
@@ -1016,7 +1016,7 @@ function BlogGridNinePosts({
           "div",
           {
             className: cn(
-              "grid gap-x-4 gap-y-8 md:grid-cols-2 lg:gap-x-6 lg:gap-y-12 2xl:grid-cols-3",
+              "grid gap-x-4 gap-y-8 md:grid-cols-2 lg:gap-x-6 lg:gap-y-12 lg:grid-cols-3",
               postsClassName
             ),
             children: renderedPosts

package/dist/blog-grid-nine-posts.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
-import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CEpDen8-.cjs';
+import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-ez1YunjX.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-Dk2BrJ5f.cjs';
 import 'class-variance-authority/types';
 
 interface BlogGridNinePostsProps {

package/dist/blog-grid-nine-posts.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
-import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-C3GSBVWt.js';
+import { e as BlogPostItem, A as ActionConfig, O as OptixFlowConfig } from './blocks-BoTnHIZ4.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-Dk2BrJ5f.js';
 import 'class-variance-authority/types';
 
 interface BlogGridNinePostsProps {

package/dist/blog-grid-nine-posts.js

@@ -950,7 +950,7 @@ function BlogGridNinePosts({
               }
             ) }) }),
             (post.label || post.category) && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: post.label || post.category }) }),
-            post.title && /* @__PURE__ */ jsx("div", { className: "mb-2 line-clamp-3 pt-4 text-lg font-medium wrap-break-word md:mb-3 md:pt-4 md:text-2xl lg:pt-4 lg:text-3xl", children: post.title }),
+            post.title && /* @__PURE__ */ jsx("div", { className: "mb-2 line-clamp-3 pt-4 text-lg font-medium wrap-break-word md:mb-3", children: post.title }),
             (post.summary || post.description) && /* @__PURE__ */ jsx("div", { className: "mb-4 line-clamp-2 text-sm text-muted-foreground md:mb-5 md:text-base", children: post.summary || post.description }),
             (post.author || post.authorAvatar) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsxs(Avatar, { className: "size-12", children: [
@@ -978,11 +978,11 @@ function BlogGridNinePosts({
       patternOpacity,
       children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
         /* @__PURE__ */ jsxs("div", { className: cn("mb-8 md:mb-14 lg:mb-16", headerClassName), children: [
-          /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between gap-8", children: /* @__PURE__ */ jsx("div", { children: heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between gap:4 md:gap-8", children: /* @__PURE__ */ jsx("div", { children: heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
             "h2",
             {
               className: cn(
-                "mb-4 w-full text-4xl font-medium md:mb-5 md:text-5xl lg:mb-6 lg:text-6xl",
+                "mb-4 w-full text-4xl font-bold md:mb-5 lg:mb-6 lg:text-5xl text-balance",
                 headingClassName
               ),
               children: heading
@@ -994,7 +994,7 @@ function BlogGridNinePosts({
           "div",
           {
             className: cn(
-              "grid gap-x-4 gap-y-8 md:grid-cols-2 lg:gap-x-6 lg:gap-y-12 2xl:grid-cols-3",
+              "grid gap-x-4 gap-y-8 md:grid-cols-2 lg:gap-x-6 lg:gap-y-12 lg:grid-cols-3",
               postsClassName
             ),
             children: renderedPosts

package/dist/blog-horizontal-cards.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
-import { A as ActionConfig, e as BlogPostItem, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CEpDen8-.cjs';
+import { A as ActionConfig, e as BlogPostItem, O as OptixFlowConfig } from './blocks-ez1YunjX.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-Dk2BrJ5f.cjs';
 import 'class-variance-authority/types';
 
 interface BlogHorizontalCardsProps {

package/dist/blog-horizontal-cards.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
-import { A as ActionConfig, e as BlogPostItem, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-C3GSBVWt.js';
+import { A as ActionConfig, e as BlogPostItem, O as OptixFlowConfig } from './blocks-BoTnHIZ4.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-Dk2BrJ5f.js';
 import 'class-variance-authority/types';
 
 interface BlogHorizontalCardsProps {

package/dist/blog-horizontal-timeline.cjs

@@ -982,7 +982,7 @@ function BlogHorizontalTimelineComponent({
         "div",
         {
           className: cn(
-            "flex flex-col items-center gap-16 md:flex-row",
+            "flex flex-col items-center gap-6 md:flex-row md:gap-16",
             postItemClassName
           ),
           children: [
@@ -990,7 +990,7 @@ function BlogHorizontalTimelineComponent({
               "div",
               {
                 className: cn(
-                  "flex h-80 w-full items-center justify-center overflow-hidden rounded-3xl bg-muted md:w-140",
+                  "flex h-48 w-full shrink-0 items-center justify-center overflow-hidden rounded-2xl bg-muted md:h-80 md:w-140 md:rounded-3xl",
                   postImageClassName
                 ),
                 children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -1004,36 +1004,42 @@ function BlogHorizontalTimelineComponent({
                 )
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("border-none shadow-none", postCardClassName), children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(
-              "div",
+            /* @__PURE__ */ jsxRuntime.jsx(
+              Card,
               {
-                className: cn(
-                  "mb-5 flex h-90 items-start border-b py-10 md:mb-0 lg:gap-32",
-                  index === 0 && "md:border-t"
-                ),
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col items-start justify-between pr-8", children: [
-                    post.title && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-2xl font-bold tracking-tight text-foreground md:text-3xl", children: post.title }),
-                    postDate && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-sm font-semibold tracking-widest text-muted-foreground uppercase", children: postDate })
-                  ] }),
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col items-start justify-between gap-6", children: [
-                    postDescription && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg leading-relaxed font-normal tracking-tight text-muted-foreground md:text-xl", children: postDescription }),
-                    readText && /* @__PURE__ */ jsxRuntime.jsxs(
-                      Pressable,
-                      {
-                        href: postHref,
-                        variant: "ghost",
-                        className: "inline-flex items-center justify-center gap-4 px-0 text-primary transition-all ease-in-out hover:gap-6 hover:text-accent-foreground",
-                        children: [
-                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg font-semibold tracking-tight", children: readText }),
-                          /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-right", size: 20 })
-                        ]
-                      }
-                    )
-                  ] })
-                ]
+                className: cn("w-full border-none shadow-none", postCardClassName),
+                children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(
+                  "div",
+                  {
+                    className: cn(
+                      "flex flex-col gap-4 border-b py-4 md:h-90 md:flex-row md:items-start md:gap-0 md:py-10 lg:gap-32",
+                      index === 0 && "md:border-t"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-start gap-2 md:h-full md:justify-between md:pr-8", children: [
+                        post.title && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-bold tracking-tight text-foreground md:text-3xl", children: post.title }),
+                        postDate && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold tracking-widest text-muted-foreground uppercase md:mt-2 md:text-sm", children: postDate })
+                      ] }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-start gap-4 md:h-full md:justify-between md:gap-6", children: [
+                        postDescription && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base leading-relaxed font-normal tracking-tight text-muted-foreground md:text-xl", children: postDescription }),
+                        readText && /* @__PURE__ */ jsxRuntime.jsxs(
+                          Pressable,
+                          {
+                            href: postHref,
+                            variant: "ghost",
+                            className: "inline-flex items-center justify-center gap-4 px-0 text-primary transition-all ease-in-out hover:gap-6 hover:text-accent-foreground",
+                            children: [
+                              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base font-semibold tracking-tight md:text-lg", children: readText }),
+                              /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-right", size: 20 })
+                            ]
+                          }
+                        )
+                      ] })
+                    ]
+                  }
+                ) })
               }
-            ) }) })
+            )
           ]
         },
         postId

package/dist/blog-horizontal-timeline.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
-import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CEpDen8-.cjs';
+import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-ez1YunjX.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-Dk2BrJ5f.cjs';
 import 'class-variance-authority/types';
 
 interface BlogHorizontalTimelineProps {

package/dist/blog-horizontal-timeline.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
-import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-C3GSBVWt.js';
+import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-BoTnHIZ4.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-Dk2BrJ5f.js';
 import 'class-variance-authority/types';
 
 interface BlogHorizontalTimelineProps {

package/dist/blog-horizontal-timeline.js

@@ -961,7 +961,7 @@ function BlogHorizontalTimelineComponent({
         "div",
         {
           className: cn(
-            "flex flex-col items-center gap-16 md:flex-row",
+            "flex flex-col items-center gap-6 md:flex-row md:gap-16",
             postItemClassName
           ),
           children: [
@@ -969,7 +969,7 @@ function BlogHorizontalTimelineComponent({
               "div",
               {
                 className: cn(
-                  "flex h-80 w-full items-center justify-center overflow-hidden rounded-3xl bg-muted md:w-140",
+                  "flex h-48 w-full shrink-0 items-center justify-center overflow-hidden rounded-2xl bg-muted md:h-80 md:w-140 md:rounded-3xl",
                   postImageClassName
                 ),
                 children: /* @__PURE__ */ jsx(
@@ -983,36 +983,42 @@ function BlogHorizontalTimelineComponent({
                 )
               }
             ),
-            /* @__PURE__ */ jsx(Card, { className: cn("border-none shadow-none", postCardClassName), children: /* @__PURE__ */ jsx(CardContent, { className: "p-0", children: /* @__PURE__ */ jsxs(
-              "div",
+            /* @__PURE__ */ jsx(
+              Card,
               {
-                className: cn(
-                  "mb-5 flex h-90 items-start border-b py-10 md:mb-0 lg:gap-32",
-                  index === 0 && "md:border-t"
-                ),
-                children: [
-                  /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full flex-col items-start justify-between pr-8", children: [
-                    post.title && /* @__PURE__ */ jsx("h2", { className: "text-2xl font-bold tracking-tight text-foreground md:text-3xl", children: post.title }),
-                    postDate && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm font-semibold tracking-widest text-muted-foreground uppercase", children: postDate })
-                  ] }),
-                  /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full flex-col items-start justify-between gap-6", children: [
-                    postDescription && /* @__PURE__ */ jsx("p", { className: "text-lg leading-relaxed font-normal tracking-tight text-muted-foreground md:text-xl", children: postDescription }),
-                    readText && /* @__PURE__ */ jsxs(
-                      Pressable,
-                      {
-                        href: postHref,
-                        variant: "ghost",
-                        className: "inline-flex items-center justify-center gap-4 px-0 text-primary transition-all ease-in-out hover:gap-6 hover:text-accent-foreground",
-                        children: [
-                          /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold tracking-tight", children: readText }),
-                          /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/arrow-right", size: 20 })
-                        ]
-                      }
-                    )
-                  ] })
-                ]
+                className: cn("w-full border-none shadow-none", postCardClassName),
+                children: /* @__PURE__ */ jsx(CardContent, { className: "p-0", children: /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: cn(
+                      "flex flex-col gap-4 border-b py-4 md:h-90 md:flex-row md:items-start md:gap-0 md:py-10 lg:gap-32",
+                      index === 0 && "md:border-t"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-start gap-2 md:h-full md:justify-between md:pr-8", children: [
+                        post.title && /* @__PURE__ */ jsx("h2", { className: "text-xl font-bold tracking-tight text-foreground md:text-3xl", children: post.title }),
+                        postDate && /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold tracking-widest text-muted-foreground uppercase md:mt-2 md:text-sm", children: postDate })
+                      ] }),
+                      /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-start gap-4 md:h-full md:justify-between md:gap-6", children: [
+                        postDescription && /* @__PURE__ */ jsx("p", { className: "text-base leading-relaxed font-normal tracking-tight text-muted-foreground md:text-xl", children: postDescription }),
+                        readText && /* @__PURE__ */ jsxs(
+                          Pressable,
+                          {
+                            href: postHref,
+                            variant: "ghost",
+                            className: "inline-flex items-center justify-center gap-4 px-0 text-primary transition-all ease-in-out hover:gap-6 hover:text-accent-foreground",
+                            children: [
+                              /* @__PURE__ */ jsx("span", { className: "text-base font-semibold tracking-tight md:text-lg", children: readText }),
+                              /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/arrow-right", size: 20 })
+                            ]
+                          }
+                        )
+                      ] })
+                    ]
+                  }
+                ) })
               }
-            ) }) })
+            )
           ]
         },
         postId

package/dist/blog-masonry-featured.cjs

@@ -941,7 +941,7 @@ function BlogMasonryFeaturedComponent({
           "h1",
           {
             className: cn(
-              "mb-12 text-center text-4xl font-medium md:text-7xl",
+              "mb-6 md:mb-12 text-center text-4xl font-medium md:text-6xl text-balance",
               headingClassName
             ),
             children: heading
@@ -951,7 +951,7 @@ function BlogMasonryFeaturedComponent({
           "div",
           {
             className: cn(
-              "xs:grid-cols-1 mt-24 grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
+              "xs:grid-cols-1 mt-6 md:mt-16 grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
               postsClassName
             ),
             children: [

package/dist/blog-masonry-featured.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
-import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CEpDen8-.cjs';
+import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-ez1YunjX.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-Dk2BrJ5f.cjs';
 import 'class-variance-authority/types';
 
 interface BlogMasonryFeaturedProps {

package/dist/blog-masonry-featured.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
-import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-C3GSBVWt.js';
+import { e as BlogPostItem, O as OptixFlowConfig } from './blocks-BoTnHIZ4.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-Dk2BrJ5f.js';
 import 'class-variance-authority/types';
 
 interface BlogMasonryFeaturedProps {

package/dist/blog-masonry-featured.js

@@ -920,7 +920,7 @@ function BlogMasonryFeaturedComponent({
           "h1",
           {
             className: cn(
-              "mb-12 text-center text-4xl font-medium md:text-7xl",
+              "mb-6 md:mb-12 text-center text-4xl font-medium md:text-6xl text-balance",
               headingClassName
             ),
             children: heading
@@ -930,7 +930,7 @@ function BlogMasonryFeaturedComponent({
           "div",
           {
             className: cn(
-              "xs:grid-cols-1 mt-24 grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
+              "xs:grid-cols-1 mt-6 md:mt-16 grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
               postsClassName
             ),
             children: [

package/dist/blog-related-articles.cjs

@@ -926,7 +926,7 @@ function BlogRelatedArticles({
           "div",
           {
             className: cn(
-              "grid grid-cols-1 gap-16 md:grid-cols-2 lg:grid-cols-4 lg:gap-10",
+              "grid grid-cols-1 gap-12 md:grid-cols-2 lg:grid-cols-4 lg:gap-10",
               articlesClassName
             ),
             children: renderedArticles

package/dist/blog-related-articles.d.cts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.cjs';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CODGexkN.cjs';
-import { A as ActionConfig, e as BlogPostItem, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-CEpDen8-.cjs';
+import { A as ActionConfig, e as BlogPostItem, O as OptixFlowConfig } from './blocks-ez1YunjX.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.cjs';
+import './button-variants-Dk2BrJ5f.cjs';
 import 'class-variance-authority/types';
 
 interface BlogRelatedArticlesProps {

package/dist/blog-related-articles.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { P as PatternName } from './pattern-background-a7gKHzHy.js';
-import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-31vhKBa1.js';
-import { A as ActionConfig, e as BlogPostItem, O as OptixFlowConfig } from './blocks-k17uluAz.js';
+import { f as SectionBackground, g as SectionSpacing } from './community-initiatives-C3GSBVWt.js';
+import { A as ActionConfig, e as BlogPostItem, O as OptixFlowConfig } from './blocks-BoTnHIZ4.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-lRElsmTc.js';
+import './button-variants-Dk2BrJ5f.js';
 import 'class-variance-authority/types';
 
 interface BlogRelatedArticlesProps {