Feature/dswp 62 secondary hero image with title

CHANGELOG.md

@@ -10,6 +10,7 @@
 - Added dswp-vertical-card pattern
 - Added dswp-information-contact-socials
 - Added dswp-team-pattern
+- Added hero image patterns, enhancements and bug fixes.
 
 ## 1.3.0 October 15, 2024
 

dist/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array(), 'version' => 'b71cd772eb24f8fa2bb6');
+<?php return array('dependencies' => array(), 'version' => '073fec5b53a9e94d14a3');

functions.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * Enqueues the design system CSS stylesheet on the frontend of the WordPress site.
  *
@@ -61,8 +62,77 @@ function design_system_include_block_style_variations( $dir_path ) {
  *
  * @param array $settings Default editor settings.
  */
-function dswp_restrict_locking_unlocking_blocks( $settings ) {
+function design_system_restrict_locking_unlocking_blocks( $settings ) {
     $settings['canLockBlocks'] = current_user_can( 'activate_plugins' );
-	return $settings;
+    return $settings;
+}
+add_filter( 'block_editor_settings_all', 'design_system_restrict_locking_unlocking_blocks', 10, 2 );
+
+
+/**
+ * Disables the default patterns from WordPress.
+ */
+function design_system_disable_default_block_patterns() {
+    remove_theme_support( 'core-block-patterns' );
+}
+add_action( 'init', 'design_system_disable_default_block_patterns' );
+
+
+/**
+ * Combines any child theme's color palette with the Design System Theme Color palette.
+ *
+ * @param object $theme_json The theme.json schema.
+ */
+function design_system_combine_parent_child_theme_json( $theme_json ) {
+    $theme_json_data = $theme_json->get_data();
+
+    $theme_title = $theme_json_data['title'];
+
+    // If the theme_json_data is from the design system theme, this is not a child theme so exit without change.
+    if ( 'Design System WordPress Theme' === $theme_title ) {
+        return $theme_json;
+    }
+    // Get the parent theme.
+    $theme = wp_get_theme( 'design-system-wordpress-theme' );
+
+    // Get the path to the theme.json file using the theme's stylesheet.
+    $theme_json_path = $theme->get_theme_root() . '/' . $theme->get_stylesheet() . '/theme.json';
+
+    // Initialize parent palette.
+    $parent_palette = array();
+
+    // Check if the theme.json file exists and read it.
+    if ( file_exists( $theme_json_path ) ) {  //TODO Improve the way you get the file contents.
+        $parent_theme_json_content = implode( '', file( $theme_json_path, FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES ) );
+        $parent_theme_json_data    = json_decode( $parent_theme_json_content, true );
+
+        // Check if the parent theme has a color palette.
+        if ( isset( $parent_theme_json_data['settings']['color']['palette'] ) && is_array( $parent_theme_json_data['settings']['color']['palette'] ) ) {
+            $parent_palette = $parent_theme_json_data['settings']['color']['palette'];
+        }
+    }
+    // Initialize child palette.
+    $child_palette = array();
+
+    // Check if the child theme has its own color palette.
+    if ( isset( $theme_json_data['settings']['color']['palette'] ) && is_array( $theme_json_data['settings']['color']['palette'] ) ) {
+        $child_palette = $theme_json_data['settings']['color']['palette'];
+    }
+
+    // Merge the parent palette with the child palette.
+    $merged_palette = array_merge( $parent_palette, $child_palette['theme'] );
+
+    // Prepare the new data with the validated palette.
+    $new_data = array(
+        'version'  => 3, // Ensure the version matches the latest.
+        'settings' => array(
+            'color' => array(
+                'palette' => $merged_palette, // Use the validated palette.
+            ),
+        ),
+    );
+
+    // Update the theme JSON with the new data.
+    return $theme_json->update_with( $new_data );
 }
-add_filter( 'block_editor_settings_all', 'dswp_restrict_locking_unlocking_blocks', 10, 2 );
+add_filter( 'wp_theme_json_data_theme', 'design_system_combine_parent_child_theme_json' );

patterns/dswp-hero-image-with-title.php

@@ -0,0 +1,33 @@
+<?php
+/**
+ * Title: DSWP Hero Image With Title
+ * Slug: design-system-wordpress-theme/dswp-hero-image-with-title
+ * Categories: banners
+ *
+ * @package Design-System-WordPress-Theme
+ */
+?>
+<!-- wp:cover {"overlayColor":"background-medium-gray","minHeight":401,"minHeightUnit":"px","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-cover" style="padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60);min-height:401px"><span aria-hidden="true" class="wp-block-cover__background has-background-medium-gray-background-color has-background-dim-100 has-background-dim"></span>
+    <div class="wp-block-cover__inner-container"><!-- wp:group {"style":{"spacing":{"margin":{"top":"0","bottom":"0"}}},"layout":{"type":"constrained","wideSize":"588px","justifyContent":"left"}} -->
+        <div class="wp-block-group" style="margin-top:0;margin-bottom:0"><!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|30","bottom":"var:preset|spacing|50","left":"var:preset|spacing|60","right":"var:preset|spacing|60"},"margin":{"top":"0","bottom":"0"}},"dimensions":{"minHeight":"278px"},"border":{"radius":"4px","left":{"color":"var:preset|color|border-dark","width":"6px"},"top":[],"right":[],"bottom":[]}},"backgroundColor":"background-white","layout":{"type":"default"}} -->
+            <div class="wp-block-group has-background-white-background-color has-background" style="border-radius:4px;border-left-color:var(--wp--preset--color--border-dark);border-left-width:6px;min-height:278px;margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--50);padding-left:var(--wp--preset--spacing--60)"><!-- wp:group {"style":{"spacing":{"padding":{"right":"0","left":"0","top":"0","bottom":"0"},"margin":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|30"}}},"layout":{"type":"constrained"}} -->
+                <div class="wp-block-group" style="margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--30);padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><!-- wp:heading {"textAlign":"left","style":{"elements":{"link":{"color":{"text":"var:preset|color|font dark"}}},"spacing":{"padding":{"top":"0","bottom":"0"},"margin":{"top":"0","bottom":"0"}}},"textColor":"font dark","fontSize":"large"} -->
+                    <h2 class="wp-block-heading has-text-align-left has-font-dark-color has-text-color has-link-color has-large-font-size" style="margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0">Neque porro quisquam Neque porro quisquam</h2>
+                    <!-- /wp:heading -->
+                </div>
+                <!-- /wp:group -->
+
+                <!-- wp:group {"style":{"spacing":{"padding":{"top":"0","bottom":"0"},"margin":{"top":"0","bottom":"0"}}},"layout":{"type":"default"}} -->
+                <div class="wp-block-group" style="margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0"><!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|font dark"}}},"spacing":{"margin":{"top":"0","bottom":"0"},"padding":{"top":"0","bottom":"0"}},"typography":{"lineHeight":"1.8"}},"textColor":"font dark","fontSize":"bcds-large-body"} -->
+                    <p class="has-font-dark-color has-text-color has-link-color has-bcds-large-body-font-size" style="margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0;line-height:1.8">Sed bibendum posuere metus, et tincidunt dui aliquam et. Donec eu dolor elit. Vestibulum sit amet tempor metus, id dignissim turpis. In hac habitasse platea dictumst. Curabitur hendrerit nibh sit amet consectetur tempus. Integer vitae turpis at lorem placerat tempor ac a felis.</p>
+                    <!-- /wp:paragraph -->
+                </div>
+                <!-- /wp:group -->
+            </div>
+            <!-- /wp:group -->
+        </div>
+        <!-- /wp:group -->
+    </div>
+</div>
+<!-- /wp:cover -->

patterns/dswp-horizonal-card.php

@@ -7,35 +7,41 @@
  * @package Design-System-WordPress-Theme
  */
 ?>
+<!-- wp:group {"templateLock":false,"lock":{"move":false,"remove":false},"layout":{"type":"constrained"},"metadata":{"name":"DSWP Horizontal Card"}} -->
+<div class="wp-block-group"><!-- wp:columns {"verticalAlignment":null,"templateLock":false,"lock":{"move":false,"remove":false},"align":"wide","style":{"spacing":{"margin":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"},"padding":{"top":"0","bottom":"0"}},"border":{"width":"0px","style":"none"}},"className":"dswp-horizontal-card is-style-box-shadow-on-hover"} -->
+    <div class="wp-block-columns alignwide dswp-horizontal-card is-style-box-shadow-on-hover" style="border-style:none;border-width:0px;margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40);padding-top:0;padding-bottom:0"><!-- wp:column {"verticalAlignment":"top","width":"26%","templateLock":false,"lock":{"move":false,"remove":false},"style":{"spacing":{"padding":{"top":"0","bottom":"0","left":"0","right":"0"}},"border":{"width":"0px","style":"none"}},"layout":{"type":"default"}} -->
+        <div class="wp-block-column is-vertically-aligned-top" style="border-style:none;border-width:0px;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;flex-basis:26%"><!-- wp:group {"style":{"border":{"radius":"9px"}},"backgroundColor":"background-light-gray","layout":{"type":"constrained"}} -->
+            <div class="wp-block-group has-background-light-gray-background-color has-background" style="border-radius:9px"><!-- wp:image {"id":15423,"aspectRatio":"1","scale":"contain","sizeSlug":"large","linkDestination":"none","style":{"color":{"duotone":"unset"},"border":{"radius":"0px"}},"className":"is-style-default"} -->
+                <figure class="wp-block-image size-large has-custom-border is-style-default"><img src="<?php echo esc_url( get_template_directory_uri() . '/assets/images/square-512.png' ); ?>" alt="" class="wp-image-15423" style="border-radius:0px;aspect-ratio:1;object-fit:contain" /></figure>
+                <!-- /wp:image -->
+            </div>
+            <!-- /wp:group -->
+        </div>
+        <!-- /wp:column -->
 
-<!-- wp:group {"templateLock":"all","lock":{"move":true,"remove":true},"layout":{"type":"constrained"}} -->
-<div class="wp-block-group"><!-- wp:columns {"templateLock":"all","lock":{"move":true,"remove":true},"align":"wide","className":"dswp-large-image-text is-style-box-shadow-on-hover","style":{"spacing":{"margin":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"},"padding":{"top":"0","bottom":"0"}},"border":{"width":"0px","style":"none"}}} -->
-<div class="wp-block-columns alignwide dswp-large-image-text is-style-box-shadow-on-hover" style="border-style:none;border-width:0px;margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--40);padding-top:0;padding-bottom:0"><!-- wp:column {"verticalAlignment":"top","width":"26%","templateLock":"all","lock":{"move":true,"remove":true},"style":{"spacing":{"padding":{"top":"0","bottom":"0","left":"0","right":"0"}}},"layout":{"type":"default"}} -->
-<div class="wp-block-column is-vertically-aligned-top" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0;flex-basis:26%"><!-- wp:image {"aspectRatio":"1","scale":"contain"} -->
-<figure class="wp-block-image"><img alt="" style="aspect-ratio:1;object-fit:contain"/></figure>
-<!-- /wp:image --></div>
-<!-- /wp:column -->
+        <!-- wp:column {"verticalAlignment":"center","width":"74%","style":{"spacing":{"padding":{"top":"0","bottom":"0","right":"var:preset|spacing|40","left":"var:preset|spacing|40"}}},"layout":{"type":"default"}} -->
+        <div class="wp-block-column is-vertically-aligned-center" style="padding-top:0;padding-right:var(--wp--preset--spacing--40);padding-bottom:0;padding-left:var(--wp--preset--spacing--40);flex-basis:74%"><!-- wp:spacer {"height":"1rem"} -->
+            <div style="height:1rem" aria-hidden="true" class="wp-block-spacer"></div>
+            <!-- /wp:spacer -->
 
-<!-- wp:column {"verticalAlignment":"stretch","width":"74%","style":{"spacing":{"padding":{"top":"0","bottom":"0","right":"var:preset|spacing|40","left":"var:preset|spacing|40"}}},"layout":{"type":"default"}} -->
-<div class="wp-block-column is-vertically-aligned-stretch" style="padding-top:0;padding-right:var(--wp--preset--spacing--40);padding-bottom:0;padding-left:var(--wp--preset--spacing--40);flex-basis:74%"><!-- wp:spacer {"height":"1rem"} -->
-<div style="height:1rem" aria-hidden="true" class="wp-block-spacer"></div>
-<!-- /wp:spacer -->
+            <!-- wp:heading {"level":5,"style":{"spacing":{"margin":{"top":"0","bottom":"0"}},"elements":{"link":{"color":{"text":"var:preset|color|font dark"}}}},"textColor":"font dark"} -->
+            <h5 class="wp-block-heading has-font-dark-color has-text-color has-link-color" style="margin-top:0;margin-bottom:0">Neque porro quisquam</h5>
+            <!-- /wp:heading -->
 
-<!-- wp:heading {"level":5,"style":{"spacing":{"margin":{"top":"0","bottom":"0"}}}} -->
-<h5 class="wp-block-heading" style="margin-top:0;margin-bottom:0">Neque porro quisquam</h5>
-<!-- /wp:heading -->
+            <!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"var:preset|color|font dark"}}}},"textColor":"font dark"} -->
+            <p class="has-font-dark-color has-text-color has-link-color">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi bibendum rhoncus aliquam. Morbi at libero pellentesque, fermentum erat at, tincidunt nunc. Proin pulvinar turpis vel turpis maximus fermentum. Phasellus ut sagittis nisi, vel accumsan velit.</p>
+            <!-- /wp:paragraph -->
 
-<!-- wp:paragraph -->
-<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi bibendum rhoncus aliquam. Morbi at libero pellentesque, fermentum erat at, tincidunt nunc. Proin pulvinar turpis vel turpis maximus fermentum. Phasellus ut sagittis nisi, vel accumsan velit.</p>
-<!-- /wp:paragraph -->
+            <!-- wp:spacer {"height":"0.5rem"} -->
+            <div style="height:0.5rem" aria-hidden="true" class="wp-block-spacer"></div>
+            <!-- /wp:spacer -->
 
-<!-- wp:spacer {"height":"0.5rem"} -->
-<div style="height:0.5rem" aria-hidden="true" class="wp-block-spacer"></div>
-<!-- /wp:spacer -->
-
-<!-- wp:paragraph {"style":{"spacing":{"padding":{"top":"0","bottom":"0"}}}} -->
-<p style="padding-top:0;padding-bottom:0"><a href="https://localhost/ticorp/test2/" data-type="page" data-id="15259">Neque porro quisquan</a></p>
-<!-- /wp:paragraph --></div>
-<!-- /wp:column --></div>
-<!-- /wp:columns --></div>
+            <!-- wp:paragraph {"style":{"spacing":{"padding":{"top":"0","bottom":"0"}}}} -->
+            <p style="padding-top:0;padding-bottom:0"><a href="#" data-type="page" data-id="15259">Neque porro quisquan</a></p>
+            <!-- /wp:paragraph -->
+        </div>
+        <!-- /wp:column -->
+    </div>
+    <!-- /wp:columns -->
+</div>
 <!-- /wp:group -->