@opensite/ui 2.3.6 → 2.3.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -75,36 +75,6 @@ function getNestedCardTextColor(parentBg, options) {
75
75
  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
76
76
  return isDark ? "text-foreground" : "";
77
77
  }
78
- function getTextColor(parentBg, variant = "default", options) {
79
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
80
- if (isDark) {
81
- switch (variant) {
82
- case "default":
83
- return "text-foreground";
84
- case "muted":
85
- return "text-foreground/80";
86
- case "subtle":
87
- return "text-foreground/60";
88
- case "accent":
89
- return "text-accent-foreground";
90
- }
91
- } else {
92
- switch (variant) {
93
- case "default":
94
- return "text-foreground";
95
- case "muted":
96
- return "text-muted-foreground";
97
- case "subtle":
98
- return "text-muted-foreground/70";
99
- case "accent":
100
- return "text-primary";
101
- }
102
- }
103
- }
104
- function getAccentColor(parentBg, options) {
105
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
106
- return isDark ? "text-accent-foreground" : "text-primary";
107
- }
108
78
  var maxWidthStyles = {
109
79
  sm: "max-w-screen-sm",
110
80
  md: "max-w-screen-md",
@@ -1899,7 +1869,7 @@ function AboutSplitHero({
1899
1869
  }
1900
1870
  }, [background]);
1901
1871
  const desktopOrder = directionConfig.desktop === "mediaRight" ? "lg:flex-row" : "lg:flex-row-reverse";
1902
- const mobileOrder = directionConfig.mobile === "mediaTop" ? "flex-col" : "flex-col-reverse";
1872
+ const mobileOrder = directionConfig.mobile === "mediaTop" ? "flex-col-reverse" : "flex-col";
1903
1873
  const contentArea = /* @__PURE__ */ jsxRuntime.jsxs(
1904
1874
  "div",
1905
1875
  {
@@ -2493,28 +2463,6 @@ function CommunityInitiatives({
2493
2463
  },
2494
2464
  []
2495
2465
  );
2496
- const actionsContent = React4.useMemo(() => {
2497
- if (actionsSlot) return actionsSlot;
2498
- if (!actions || actions.length === 0) return null;
2499
- return /* @__PURE__ */ jsxRuntime.jsx(
2500
- "div",
2501
- {
2502
- className: cn("flex flex-wrap justify-center gap-4", actionsClassName),
2503
- children: actions.map((action, idx) => /* @__PURE__ */ jsxRuntime.jsx(
2504
- Pressable,
2505
- {
2506
- href: action.href,
2507
- onClick: action.onClick,
2508
- variant: action.variant || "default",
2509
- size: action.size || "lg",
2510
- asButton: true,
2511
- children: action.label
2512
- },
2513
- idx
2514
- ))
2515
- }
2516
- );
2517
- }, [actionsSlot, actions, actionsClassName]);
2518
2466
  const categoriesContent = React4.useMemo(() => {
2519
2467
  if (categoriesSlot) return categoriesSlot;
2520
2468
  if (!categories || categories.length === 0) return null;
@@ -2546,7 +2494,7 @@ function CommunityInitiatives({
2546
2494
  category.id
2547
2495
  )) })
2548
2496
  ] }),
2549
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto max-w-2xl text-left md:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(getTextColor(background, "muted")), children: currentCategory?.description }) }),
2497
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto max-w-2xl text-left md:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "relative", children: currentCategory?.description }) }),
2550
2498
  categories.map((category) => /* @__PURE__ */ jsxRuntime.jsx(
2551
2499
  TabsContent,
2552
2500
  {
@@ -2568,47 +2516,13 @@ function CommunityInitiatives({
2568
2516
  ),
2569
2517
  children: [
2570
2518
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2571
- /* @__PURE__ */ jsxRuntime.jsx(
2572
- "div",
2573
- {
2574
- className: cn(
2575
- "rounded-md p-2",
2576
- getNestedCardBg(background, "muted")
2577
- ),
2578
- children: /* @__PURE__ */ jsxRuntime.jsx(
2579
- DynamicIcon,
2580
- {
2581
- name: initiative.icon,
2582
- size: 24,
2583
- className: cn(getAccentColor(background))
2584
- }
2585
- )
2586
- }
2587
- ),
2519
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("rounded-md p-2"), children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: initiative.icon, size: 24 }) }),
2588
2520
  /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-bold", children: initiative.title })
2589
2521
  ] }),
2590
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(getTextColor(background, "muted")), children: initiative.description }),
2522
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "relative", children: initiative.description }),
2591
2523
  initiative.metrics && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-3 gap-4 pt-2", children: initiative.metrics.map((metric, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
2592
- /* @__PURE__ */ jsxRuntime.jsx(
2593
- "div",
2594
- {
2595
- className: cn(
2596
- "text-2xl font-bold",
2597
- getAccentColor(background)
2598
- ),
2599
- children: metric.value
2600
- }
2601
- ),
2602
- /* @__PURE__ */ jsxRuntime.jsx(
2603
- "div",
2604
- {
2605
- className: cn(
2606
- "mt-1 text-xs",
2607
- getTextColor(background, "muted")
2608
- ),
2609
- children: metric.label
2610
- }
2611
- )
2524
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-2xl font-bold"), children: metric.value }),
2525
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-1 text-xs"), children: metric.label })
2612
2526
  ] }, i)) })
2613
2527
  ]
2614
2528
  }
@@ -2641,8 +2555,7 @@ function CommunityInitiatives({
2641
2555
  Card,
2642
2556
  {
2643
2557
  className: cn(
2644
- "flex h-full min-h-[280px] w-full items-center justify-center",
2645
- getNestedCardBg(background, "subtle")
2558
+ "flex h-full min-h-[280px] w-full items-center justify-center"
2646
2559
  ),
2647
2560
  children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-6 text-center", children: [
2648
2561
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -2650,11 +2563,7 @@ function CommunityInitiatives({
2650
2563
  {
2651
2564
  name: initiative.icon,
2652
2565
  size: 64,
2653
- className: cn(
2654
- "mx-auto mb-4",
2655
- getTextColor(background, "muted"),
2656
- "opacity-50"
2657
- )
2566
+ className: cn("mx-auto mb-4", "opacity-50")
2658
2567
  }
2659
2568
  ),
2660
2569
  /* @__PURE__ */ jsxRuntime.jsxs(Badge, { variant: "secondary", className: "mx-auto", children: [
@@ -2723,30 +2632,45 @@ function CommunityInitiatives({
2723
2632
  }
2724
2633
  ),
2725
2634
  categoriesContent,
2726
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mt-20 text-center", ctaClassName), children: [
2727
- ctaBadgeText && /* @__PURE__ */ jsxRuntime.jsx(
2728
- "div",
2729
- {
2730
- className: cn(
2731
- "mb-8 inline-flex items-center justify-center rounded-full p-1"
2732
- ),
2733
- children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText })
2734
- }
2735
- ),
2736
- ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2737
- ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
2738
- "p",
2739
- {
2740
- className: cn(
2741
- "mx-auto mb-8 max-w-2xl",
2742
- getTextColor(background, "muted"),
2743
- ctaDescriptionClassName
2635
+ /* @__PURE__ */ jsxRuntime.jsxs(
2636
+ "div",
2637
+ {
2638
+ className: cn(
2639
+ "mt-10 md:mt-24 p-6 md:p-16",
2640
+ "text-center flex flex-col items-center",
2641
+ "bg-muted text-muted-foreground",
2642
+ "rounded-2xl shadow-lg",
2643
+ ctaClassName
2644
+ ),
2645
+ children: [
2646
+ ctaBadgeText && /* @__PURE__ */ jsxRuntime.jsx(
2647
+ "div",
2648
+ {
2649
+ className: cn(
2650
+ "mb-8 inline-flex items-center justify-center rounded-full p-1"
2651
+ ),
2652
+ children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText })
2653
+ }
2744
2654
  ),
2745
- children: ctaDescription
2746
- }
2747
- ) : ctaDescription),
2748
- actionsContent
2749
- ] })
2655
+ ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2656
+ ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
2657
+ "p",
2658
+ {
2659
+ className: cn("mx-auto mb-8 max-w-2xl", ctaDescriptionClassName),
2660
+ children: ctaDescription
2661
+ }
2662
+ ) : ctaDescription),
2663
+ /* @__PURE__ */ jsxRuntime.jsx(
2664
+ BlockActions,
2665
+ {
2666
+ actions,
2667
+ actionsSlot,
2668
+ actionsClassName
2669
+ }
2670
+ )
2671
+ ]
2672
+ }
2673
+ )
2750
2674
  ]
2751
2675
  }
2752
2676
  );
@@ -52,36 +52,6 @@ function getNestedCardTextColor(parentBg, options) {
52
52
  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
53
53
  return isDark ? "text-foreground" : "";
54
54
  }
55
- function getTextColor(parentBg, variant = "default", options) {
56
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
57
- if (isDark) {
58
- switch (variant) {
59
- case "default":
60
- return "text-foreground";
61
- case "muted":
62
- return "text-foreground/80";
63
- case "subtle":
64
- return "text-foreground/60";
65
- case "accent":
66
- return "text-accent-foreground";
67
- }
68
- } else {
69
- switch (variant) {
70
- case "default":
71
- return "text-foreground";
72
- case "muted":
73
- return "text-muted-foreground";
74
- case "subtle":
75
- return "text-muted-foreground/70";
76
- case "accent":
77
- return "text-primary";
78
- }
79
- }
80
- }
81
- function getAccentColor(parentBg, options) {
82
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
83
- return isDark ? "text-accent-foreground" : "text-primary";
84
- }
85
55
  var maxWidthStyles = {
86
56
  sm: "max-w-screen-sm",
87
57
  md: "max-w-screen-md",
@@ -1876,7 +1846,7 @@ function AboutSplitHero({
1876
1846
  }
1877
1847
  }, [background]);
1878
1848
  const desktopOrder = directionConfig.desktop === "mediaRight" ? "lg:flex-row" : "lg:flex-row-reverse";
1879
- const mobileOrder = directionConfig.mobile === "mediaTop" ? "flex-col" : "flex-col-reverse";
1849
+ const mobileOrder = directionConfig.mobile === "mediaTop" ? "flex-col-reverse" : "flex-col";
1880
1850
  const contentArea = /* @__PURE__ */ jsxs(
1881
1851
  "div",
1882
1852
  {
@@ -2470,28 +2440,6 @@ function CommunityInitiatives({
2470
2440
  },
2471
2441
  []
2472
2442
  );
2473
- const actionsContent = useMemo(() => {
2474
- if (actionsSlot) return actionsSlot;
2475
- if (!actions || actions.length === 0) return null;
2476
- return /* @__PURE__ */ jsx(
2477
- "div",
2478
- {
2479
- className: cn("flex flex-wrap justify-center gap-4", actionsClassName),
2480
- children: actions.map((action, idx) => /* @__PURE__ */ jsx(
2481
- Pressable,
2482
- {
2483
- href: action.href,
2484
- onClick: action.onClick,
2485
- variant: action.variant || "default",
2486
- size: action.size || "lg",
2487
- asButton: true,
2488
- children: action.label
2489
- },
2490
- idx
2491
- ))
2492
- }
2493
- );
2494
- }, [actionsSlot, actions, actionsClassName]);
2495
2443
  const categoriesContent = useMemo(() => {
2496
2444
  if (categoriesSlot) return categoriesSlot;
2497
2445
  if (!categories || categories.length === 0) return null;
@@ -2523,7 +2471,7 @@ function CommunityInitiatives({
2523
2471
  category.id
2524
2472
  )) })
2525
2473
  ] }),
2526
- /* @__PURE__ */ jsx("div", { className: "mx-auto max-w-2xl text-left md:text-center", children: /* @__PURE__ */ jsx("p", { className: cn(getTextColor(background, "muted")), children: currentCategory?.description }) }),
2474
+ /* @__PURE__ */ jsx("div", { className: "mx-auto max-w-2xl text-left md:text-center", children: /* @__PURE__ */ jsx("p", { className: "relative", children: currentCategory?.description }) }),
2527
2475
  categories.map((category) => /* @__PURE__ */ jsx(
2528
2476
  TabsContent,
2529
2477
  {
@@ -2545,47 +2493,13 @@ function CommunityInitiatives({
2545
2493
  ),
2546
2494
  children: [
2547
2495
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
2548
- /* @__PURE__ */ jsx(
2549
- "div",
2550
- {
2551
- className: cn(
2552
- "rounded-md p-2",
2553
- getNestedCardBg(background, "muted")
2554
- ),
2555
- children: /* @__PURE__ */ jsx(
2556
- DynamicIcon,
2557
- {
2558
- name: initiative.icon,
2559
- size: 24,
2560
- className: cn(getAccentColor(background))
2561
- }
2562
- )
2563
- }
2564
- ),
2496
+ /* @__PURE__ */ jsx("div", { className: cn("rounded-md p-2"), children: /* @__PURE__ */ jsx(DynamicIcon, { name: initiative.icon, size: 24 }) }),
2565
2497
  /* @__PURE__ */ jsx("h3", { className: "text-2xl font-bold", children: initiative.title })
2566
2498
  ] }),
2567
- /* @__PURE__ */ jsx("p", { className: cn(getTextColor(background, "muted")), children: initiative.description }),
2499
+ /* @__PURE__ */ jsx("p", { className: "relative", children: initiative.description }),
2568
2500
  initiative.metrics && /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-4 pt-2", children: initiative.metrics.map((metric, i) => /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
2569
- /* @__PURE__ */ jsx(
2570
- "div",
2571
- {
2572
- className: cn(
2573
- "text-2xl font-bold",
2574
- getAccentColor(background)
2575
- ),
2576
- children: metric.value
2577
- }
2578
- ),
2579
- /* @__PURE__ */ jsx(
2580
- "div",
2581
- {
2582
- className: cn(
2583
- "mt-1 text-xs",
2584
- getTextColor(background, "muted")
2585
- ),
2586
- children: metric.label
2587
- }
2588
- )
2501
+ /* @__PURE__ */ jsx("div", { className: cn("text-2xl font-bold"), children: metric.value }),
2502
+ /* @__PURE__ */ jsx("div", { className: cn("mt-1 text-xs"), children: metric.label })
2589
2503
  ] }, i)) })
2590
2504
  ]
2591
2505
  }
@@ -2618,8 +2532,7 @@ function CommunityInitiatives({
2618
2532
  Card,
2619
2533
  {
2620
2534
  className: cn(
2621
- "flex h-full min-h-[280px] w-full items-center justify-center",
2622
- getNestedCardBg(background, "subtle")
2535
+ "flex h-full min-h-[280px] w-full items-center justify-center"
2623
2536
  ),
2624
2537
  children: /* @__PURE__ */ jsxs(CardContent, { className: "p-6 text-center", children: [
2625
2538
  /* @__PURE__ */ jsx(
@@ -2627,11 +2540,7 @@ function CommunityInitiatives({
2627
2540
  {
2628
2541
  name: initiative.icon,
2629
2542
  size: 64,
2630
- className: cn(
2631
- "mx-auto mb-4",
2632
- getTextColor(background, "muted"),
2633
- "opacity-50"
2634
- )
2543
+ className: cn("mx-auto mb-4", "opacity-50")
2635
2544
  }
2636
2545
  ),
2637
2546
  /* @__PURE__ */ jsxs(Badge, { variant: "secondary", className: "mx-auto", children: [
@@ -2700,30 +2609,45 @@ function CommunityInitiatives({
2700
2609
  }
2701
2610
  ),
2702
2611
  categoriesContent,
2703
- /* @__PURE__ */ jsxs("div", { className: cn("mt-20 text-center", ctaClassName), children: [
2704
- ctaBadgeText && /* @__PURE__ */ jsx(
2705
- "div",
2706
- {
2707
- className: cn(
2708
- "mb-8 inline-flex items-center justify-center rounded-full p-1"
2709
- ),
2710
- children: /* @__PURE__ */ jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText })
2711
- }
2712
- ),
2713
- ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2714
- ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsx(
2715
- "p",
2716
- {
2717
- className: cn(
2718
- "mx-auto mb-8 max-w-2xl",
2719
- getTextColor(background, "muted"),
2720
- ctaDescriptionClassName
2612
+ /* @__PURE__ */ jsxs(
2613
+ "div",
2614
+ {
2615
+ className: cn(
2616
+ "mt-10 md:mt-24 p-6 md:p-16",
2617
+ "text-center flex flex-col items-center",
2618
+ "bg-muted text-muted-foreground",
2619
+ "rounded-2xl shadow-lg",
2620
+ ctaClassName
2621
+ ),
2622
+ children: [
2623
+ ctaBadgeText && /* @__PURE__ */ jsx(
2624
+ "div",
2625
+ {
2626
+ className: cn(
2627
+ "mb-8 inline-flex items-center justify-center rounded-full p-1"
2628
+ ),
2629
+ children: /* @__PURE__ */ jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText })
2630
+ }
2721
2631
  ),
2722
- children: ctaDescription
2723
- }
2724
- ) : ctaDescription),
2725
- actionsContent
2726
- ] })
2632
+ ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2633
+ ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsx(
2634
+ "p",
2635
+ {
2636
+ className: cn("mx-auto mb-8 max-w-2xl", ctaDescriptionClassName),
2637
+ children: ctaDescription
2638
+ }
2639
+ ) : ctaDescription),
2640
+ /* @__PURE__ */ jsx(
2641
+ BlockActions,
2642
+ {
2643
+ actions,
2644
+ actionsSlot,
2645
+ actionsClassName
2646
+ }
2647
+ )
2648
+ ]
2649
+ }
2650
+ )
2727
2651
  ]
2728
2652
  }
2729
2653
  );
package/dist/index.cjs CHANGED
@@ -1930,7 +1930,7 @@ function AboutSplitHero({
1930
1930
  }
1931
1931
  }, [background]);
1932
1932
  const desktopOrder = directionConfig.desktop === "mediaRight" ? "lg:flex-row" : "lg:flex-row-reverse";
1933
- const mobileOrder = directionConfig.mobile === "mediaTop" ? "flex-col" : "flex-col-reverse";
1933
+ const mobileOrder = directionConfig.mobile === "mediaTop" ? "flex-col-reverse" : "flex-col";
1934
1934
  const contentArea = /* @__PURE__ */ jsxRuntime.jsxs(
1935
1935
  "div",
1936
1936
  {
@@ -2524,28 +2524,6 @@ function CommunityInitiatives({
2524
2524
  },
2525
2525
  []
2526
2526
  );
2527
- const actionsContent = React4.useMemo(() => {
2528
- if (actionsSlot) return actionsSlot;
2529
- if (!actions || actions.length === 0) return null;
2530
- return /* @__PURE__ */ jsxRuntime.jsx(
2531
- "div",
2532
- {
2533
- className: cn("flex flex-wrap justify-center gap-4", actionsClassName),
2534
- children: actions.map((action, idx) => /* @__PURE__ */ jsxRuntime.jsx(
2535
- Pressable,
2536
- {
2537
- href: action.href,
2538
- onClick: action.onClick,
2539
- variant: action.variant || "default",
2540
- size: action.size || "lg",
2541
- asButton: true,
2542
- children: action.label
2543
- },
2544
- idx
2545
- ))
2546
- }
2547
- );
2548
- }, [actionsSlot, actions, actionsClassName]);
2549
2527
  const categoriesContent = React4.useMemo(() => {
2550
2528
  if (categoriesSlot) return categoriesSlot;
2551
2529
  if (!categories || categories.length === 0) return null;
@@ -2577,7 +2555,7 @@ function CommunityInitiatives({
2577
2555
  category.id
2578
2556
  )) })
2579
2557
  ] }),
2580
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto max-w-2xl text-left md:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(getTextColor(background, "muted")), children: currentCategory?.description }) }),
2558
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto max-w-2xl text-left md:text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "relative", children: currentCategory?.description }) }),
2581
2559
  categories.map((category) => /* @__PURE__ */ jsxRuntime.jsx(
2582
2560
  TabsContent,
2583
2561
  {
@@ -2599,47 +2577,13 @@ function CommunityInitiatives({
2599
2577
  ),
2600
2578
  children: [
2601
2579
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2602
- /* @__PURE__ */ jsxRuntime.jsx(
2603
- "div",
2604
- {
2605
- className: cn(
2606
- "rounded-md p-2",
2607
- getNestedCardBg(background, "muted")
2608
- ),
2609
- children: /* @__PURE__ */ jsxRuntime.jsx(
2610
- DynamicIcon,
2611
- {
2612
- name: initiative.icon,
2613
- size: 24,
2614
- className: cn(getAccentColor(background))
2615
- }
2616
- )
2617
- }
2618
- ),
2580
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("rounded-md p-2"), children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: initiative.icon, size: 24 }) }),
2619
2581
  /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-bold", children: initiative.title })
2620
2582
  ] }),
2621
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(getTextColor(background, "muted")), children: initiative.description }),
2583
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "relative", children: initiative.description }),
2622
2584
  initiative.metrics && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-3 gap-4 pt-2", children: initiative.metrics.map((metric, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
2623
- /* @__PURE__ */ jsxRuntime.jsx(
2624
- "div",
2625
- {
2626
- className: cn(
2627
- "text-2xl font-bold",
2628
- getAccentColor(background)
2629
- ),
2630
- children: metric.value
2631
- }
2632
- ),
2633
- /* @__PURE__ */ jsxRuntime.jsx(
2634
- "div",
2635
- {
2636
- className: cn(
2637
- "mt-1 text-xs",
2638
- getTextColor(background, "muted")
2639
- ),
2640
- children: metric.label
2641
- }
2642
- )
2585
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("text-2xl font-bold"), children: metric.value }),
2586
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-1 text-xs"), children: metric.label })
2643
2587
  ] }, i)) })
2644
2588
  ]
2645
2589
  }
@@ -2672,8 +2616,7 @@ function CommunityInitiatives({
2672
2616
  Card,
2673
2617
  {
2674
2618
  className: cn(
2675
- "flex h-full min-h-[280px] w-full items-center justify-center",
2676
- getNestedCardBg(background, "subtle")
2619
+ "flex h-full min-h-[280px] w-full items-center justify-center"
2677
2620
  ),
2678
2621
  children: /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { className: "p-6 text-center", children: [
2679
2622
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -2681,11 +2624,7 @@ function CommunityInitiatives({
2681
2624
  {
2682
2625
  name: initiative.icon,
2683
2626
  size: 64,
2684
- className: cn(
2685
- "mx-auto mb-4",
2686
- getTextColor(background, "muted"),
2687
- "opacity-50"
2688
- )
2627
+ className: cn("mx-auto mb-4", "opacity-50")
2689
2628
  }
2690
2629
  ),
2691
2630
  /* @__PURE__ */ jsxRuntime.jsxs(Badge, { variant: "secondary", className: "mx-auto", children: [
@@ -2754,30 +2693,45 @@ function CommunityInitiatives({
2754
2693
  }
2755
2694
  ),
2756
2695
  categoriesContent,
2757
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mt-20 text-center", ctaClassName), children: [
2758
- ctaBadgeText && /* @__PURE__ */ jsxRuntime.jsx(
2759
- "div",
2760
- {
2761
- className: cn(
2762
- "mb-8 inline-flex items-center justify-center rounded-full p-1"
2763
- ),
2764
- children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText })
2765
- }
2766
- ),
2767
- ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2768
- ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
2769
- "p",
2770
- {
2771
- className: cn(
2772
- "mx-auto mb-8 max-w-2xl",
2773
- getTextColor(background, "muted"),
2774
- ctaDescriptionClassName
2696
+ /* @__PURE__ */ jsxRuntime.jsxs(
2697
+ "div",
2698
+ {
2699
+ className: cn(
2700
+ "mt-10 md:mt-24 p-6 md:p-16",
2701
+ "text-center flex flex-col items-center",
2702
+ "bg-muted text-muted-foreground",
2703
+ "rounded-2xl shadow-lg",
2704
+ ctaClassName
2705
+ ),
2706
+ children: [
2707
+ ctaBadgeText && /* @__PURE__ */ jsxRuntime.jsx(
2708
+ "div",
2709
+ {
2710
+ className: cn(
2711
+ "mb-8 inline-flex items-center justify-center rounded-full p-1"
2712
+ ),
2713
+ children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "rounded-full bg-primary px-4 py-1 text-primary-foreground", children: ctaBadgeText })
2714
+ }
2775
2715
  ),
2776
- children: ctaDescription
2777
- }
2778
- ) : ctaDescription),
2779
- actionsContent
2780
- ] })
2716
+ ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("mb-4 text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2717
+ ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
2718
+ "p",
2719
+ {
2720
+ className: cn("mx-auto mb-8 max-w-2xl", ctaDescriptionClassName),
2721
+ children: ctaDescription
2722
+ }
2723
+ ) : ctaDescription),
2724
+ /* @__PURE__ */ jsxRuntime.jsx(
2725
+ BlockActions,
2726
+ {
2727
+ actions,
2728
+ actionsSlot,
2729
+ actionsClassName
2730
+ }
2731
+ )
2732
+ ]
2733
+ }
2734
+ )
2781
2735
  ]
2782
2736
  }
2783
2737
  );