Hero With Cta Patch V3

CHANGELOG.md

@@ -20,6 +20,29 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Additional pattern categories
 - Pattern preview in admin interface
 
+## [1.0.0-beta.12] - 2025-10-28
+
+### Fixed
+- **Hero with CTA pattern button validation error**
+  - Fixed "Block contains unexpected or invalid content" error on second button
+  - Added missing `textColor` attribute to ensure proper class generation
+  - WordPress now correctly generates `has-text-color` class for validation
+
+### Changed
+- **Hero with CTA buttons now use theme brand color for consistency**
+  - Changed from custom indigo color to theme's `primary` brand color (#017cb6)
+  - First button: `primary` background with white text
+  - Second button: `primary` text and border color with white background
+  - Better integration with Nynaeve theme design system
+  - Maintains modern design with proper theme color tokens
+
+### Technical Details
+- First button: Uses `backgroundColor="primary"` instead of custom hex color
+- Second button: Uses `textColor="primary"` and `borderColor="primary"` with outline style
+- Both buttons maintain `8px` border radius for modern aesthetic
+- All colors now properly reference theme.json palette tokens
+- Fixed button validation by adding proper `textColor` attribute and `has-text-color` class
+
 ## [1.0.0-beta.11] - 2025-10-28
 
 ### Changed
@@ -30,18 +53,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
   - Redesigned subheading to be more descriptive and business-focused
   - Updated subheading color to gray (`main-accent`) for proper typography hierarchy
   - Reduced button border radius from default (very rounded) to `8px` for modern, subtle corners
-  - Changed first button color from black to indigo (`#6366f1` - Tailwind indigo-500) for modern SaaS feel
-  - Updated second button to use indigo text color to match first button theme
-  - Maintained outline style on second button with proper border styling
   - All typography uses Open Sans font family for clean, professional appearance
   - Pattern now follows modern startup/SaaS design trends while maintaining theme consistency
 
 ### Technical Details
-- First button: Indigo background (`#6366f1`), white text, `8px` border radius
-- Second button: White background, indigo text (`#6366f1`), `2px` border, `8px` border radius, outline style
 - Background: White (`base`) instead of brand blue for better content versatility
 - Heading: Black (`main` color) at `5xl` size for bold impact
 - Subheading: Gray (`main-accent` color) at `lg` size for readability hierarchy
+- Buttons: `8px` border radius for modern, subtle rounded corners
 - Responsive layout maintained: stacks on mobile, centers on all screen sizes
 
 ## [1.0.0-beta.10] - 2025-10-28

callandor.php

@@ -3,7 +3,7 @@
  * Plugin Name:       Callandor
  * Plugin URI:        https://github.com/imagewize/callandor
  * Description:       Pattern library for Sage 11 hybrid themes with Tailwind CSS support
- * Version:           1.0.0-beta.11
+ * Version:           1.0.0-beta.12
  * Requires at least: 6.6
  * Requires PHP:      8.2
  * Author:            Imagewize
@@ -24,7 +24,7 @@
 /**
  * Current plugin version.
  */
-define( 'CALLANDOR_VERSION', '1.0.0-beta.11' );
+define( 'CALLANDOR_VERSION', '1.0.0-beta.12' );
 define( 'CALLANDOR_PLUGIN_DIR', plugin_dir_path( __FILE__ ) );
 define( 'CALLANDOR_PLUGIN_URL', plugin_dir_url( __FILE__ ) );
 define( 'CALLANDOR_PLUGIN_BASENAME', plugin_basename( __FILE__ ) );

patterns/hero/hero-with-cta.php

@@ -27,12 +27,12 @@
 
 		<!-- wp:buttons {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40"}}},"layout":{"type":"flex","justifyContent":"center"}} -->
 		<div class="wp-block-buttons" style="margin-top:var(--wp--preset--spacing--40)">
-		<!-- wp:button {"style":{"border":{"radius":"8px"},"color":{"background":"#6366f1"}},"textColor":"base","fontSize":"base"} -->
-		<div class="wp-block-button has-custom-font-size has-base-font-size"><a class="wp-block-button__link has-base-color has-text-color has-background wp-element-button" style="border-radius:8px;background-color:#6366f1">' . __( 'Get Started', 'callandor' ) . '</a></div>
+		<!-- wp:button {"backgroundColor":"primary","textColor":"base","style":{"border":{"radius":"8px"}},"fontSize":"base"} -->
+		<div class="wp-block-button has-custom-font-size has-base-font-size"><a class="wp-block-button__link has-base-color has-primary-background-color has-text-color has-background wp-element-button" style="border-radius:8px">' . __( 'Get Started', 'callandor' ) . '</a></div>
 		<!-- /wp:button -->
 
-		<!-- wp:button {"backgroundColor":"base","style":{"border":{"width":"2px","radius":"8px"},"color":{"text":"#6366f1"}},"borderColor":"border-dark","className":"is-style-outline","fontSize":"base"} -->
-		<div class="wp-block-button has-custom-font-size has-base-font-size is-style-outline"><a class="wp-block-button__link has-base-background-color has-background has-border-color has-border-dark-border-color wp-element-button" style="border-width:2px;border-radius:8px;color:#6366f1">' . __( 'Learn More', 'callandor' ) . '</a></div>
+		<!-- wp:button {"backgroundColor":"base","textColor":"primary","className":"is-style-outline","style":{"border":{"radius":"8px","width":"2px"},"elements":{"link":{"color":{"text":"var:preset|color|primary"}}}},"fontSize":"base","borderColor":"primary"} -->
+		<div class="wp-block-button has-custom-font-size has-base-font-size is-style-outline"><a class="wp-block-button__link has-primary-color has-base-background-color has-text-color has-background has-link-color has-border-color has-primary-border-color wp-element-button" style="border-width:2px;border-radius:8px">' . __( 'Learn More', 'callandor' ) . '</a></div>
 		<!-- /wp:button -->
 		</div>
 		<!-- /wp:buttons -->

readme.txt

@@ -4,7 +4,7 @@ Tags: patterns, blocks, gutenberg, sage, tailwind, block-patterns, page-builder
 Requires at least: 6.6
 Tested up to: 6.7
 Requires PHP: 8.2
-Stable tag: 1.0.0-beta.11
+Stable tag: 1.0.0-beta.12
 License: MIT
 License URI: https://opensource.org/licenses/MIT
 
@@ -131,15 +131,22 @@ All images are used for demonstration purposes and can be easily replaced with y
 
 == Changelog ==
 
+= 1.0.0-beta.12 - 2025-10-28 =
+* Fixed Hero with CTA pattern button validation error
+* Added missing textColor attribute to second button to fix "Block contains unexpected or invalid content" error
+* Changed buttons to use theme's primary brand color (#017cb6) instead of custom indigo for better theme consistency
+* First button now uses primary background with white text (proper theme integration)
+* Second button uses primary text and border color with outline style
+* All button colors now properly reference theme.json palette tokens
+* Maintains modern design with 8px border radius on both buttons
+
 = 1.0.0-beta.11 - 2025-10-28 =
 * Redesigned Hero with CTA pattern for modern SaaS aesthetic
 * Changed background from brand blue to clean white for better versatility
 * Updated heading to "Launch your idea with confidence" - shorter, more impactful, startup-focused
 * Heading now uses black color (main) instead of white for better contrast on white background
 * Redesigned subheading to be more descriptive and business-focused with gray color (main-accent)
 * Reduced button border radius from default (very rounded) to 8px for modern, subtle corners
-* First button now uses indigo color (#6366f1 - Tailwind indigo-500) instead of black for modern SaaS feel
-* Second button uses indigo text color to match first button theme while maintaining outline style
 * All typography uses Open Sans font family for clean, professional appearance
 * Pattern now follows modern startup/SaaS design trends while maintaining theme consistency
 * Maintained responsive layout: buttons stack on mobile, center on all screen sizes