@snow-labs/brutal-ui 0.3.0 → 0.3.2

package/dist/templates/saas-launch.js

@@ -263,6 +263,9 @@ var colorMap = {
   white: "bg-background text-foreground",
   brand: "bg-brand",
   "brand-muted": "bg-brand-muted text-foreground",
+  blue: "bg-section-blue",
+  gray: "bg-section-gray text-foreground",
+  cream: "bg-section-cream text-foreground",
   black: "bg-foreground text-background",
   cta: "bg-cta"
 };
@@ -356,7 +359,7 @@ function BrutalHero({
       variant === "centered" && "mx-auto"
     ), children: description }),
     /* @__PURE__ */ jsxs("div", { className: cn(
-      "flex flex-col gap-4 sm:flex-row sm:flex-wrap",
+      "flex flex-col gap-3 sm:flex-row sm:gap-4",
       variant === "centered" && "sm:justify-center"
     ), children: [
       /* @__PURE__ */ jsx(Button, { variant: ctaVariant, size: "xl", className: "w-full sm:w-auto", render: /* @__PURE__ */ jsx("a", { href: ctaHref }), children: ctaText }),
@@ -779,7 +782,7 @@ function BrutalTestimonials({
   headline,
   testimonials,
   variant = "masonry",
-  color = "brand-muted",
+  color = "blue",
   pattern,
   className
 }) {
@@ -1021,7 +1024,7 @@ function CTAButtons({
   secondaryText,
   secondaryHref
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:flex-wrap sm:items-center sm:justify-center", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 sm:flex-row sm:justify-center sm:gap-4", children: [
     /* @__PURE__ */ jsx(
       Button,
       {
@@ -1067,7 +1070,7 @@ function SplitCTA(props) {
       /* @__PURE__ */ jsx("h2", { className: "brutal-h1 mb-6", children: props.headline }),
       props.description && /* @__PURE__ */ jsx("p", { className: "brutal-body mb-4 opacity-80", children: props.description }),
       props.stats && /* @__PURE__ */ jsx("p", { className: "brutal-label mb-8 opacity-60", children: props.stats }),
-      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:flex-wrap", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3 sm:flex-row sm:gap-4", children: [
         /* @__PURE__ */ jsx(
           Button,
           {
@@ -1153,7 +1156,7 @@ function Input({ className, type, ...props }) {
       type,
       "data-slot": "input",
       className: cn(
-        "h-10 w-full min-w-0 rounded-lg border-brutal border-foreground bg-background px-3 py-2 text-base font-medium shadow-brutal-sm transition-all outline-none placeholder:text-muted-foreground focus:shadow-brutal focus:-translate-x-0.5 focus:-translate-y-0.5 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive md:text-sm",
+        "h-10 w-full min-w-0 rounded-lg border-brutal border-foreground bg-background px-3 py-2 text-base transition-all outline-none placeholder:text-muted-foreground focus-visible:ring-2 focus-visible:ring-ring/20 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive md:text-sm",
         className
       ),
       ...props
@@ -1338,7 +1341,7 @@ function SaaSLaunchTemplate({
       }
     ),
     stats && stats.length > 0 && /* @__PURE__ */ jsx(StatsBar, { stats, color: "brand" }),
-    /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--brand))", to: "hsl(var(--brand-muted))", variant: "torn-paper" }),
+    /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--brand))", to: "hsl(var(--section-blue))", variant: "torn-paper" }),
     /* @__PURE__ */ jsx(
       BrutalTestimonials,
       {
@@ -1346,10 +1349,10 @@ function SaaSLaunchTemplate({
         badge: testimonials.badge,
         headline: testimonials.headline,
         testimonials: testimonials.items,
-        color: "brand-muted"
+        color: "blue"
       }
     ),
-    /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--brand-muted))", to: "hsl(var(--background))", variant: "wave" }),
+    /* @__PURE__ */ jsx(SectionDivider, { from: "hsl(var(--section-blue))", to: "hsl(var(--background))", variant: "wave" }),
     pricing && /* @__PURE__ */ jsx(
       PricingTable,
       {
@@ -1361,7 +1364,7 @@ function SaaSLaunchTemplate({
         color: "white"
       }
     ),
-    faq && faq.length > 0 && /* @__PURE__ */ jsx(FAQ, { badge: "FAQ", headline: "Common Questions", items: faq, color: "white" }),
+    faq && faq.length > 0 && /* @__PURE__ */ jsx(FAQ, { badge: "FAQ", headline: "Common Questions", items: faq, color: "gray" }),
     /* @__PURE__ */ jsx(
       BrutalCTA,
       {