feat: add header and footer patterns, theme adjustments

assets/css/design-system.css

@@ -0,0 +1,60 @@
+:is([class*='stk--background-scheme'],
+       [class*='stk--container-scheme'],
+       .stk--has-base-scheme,
+       .stk--has-background-scheme .stk-block-background,
+       .stk--has-container-scheme .stk-container:not(.stk--no-background)) p {
+  color: var(--stk-text-color);
+}
+
+:is([class*='stk--background-scheme'],
+       [class*='stk--container-scheme'],
+       .stk--has-base-scheme,
+       .stk--has-background-scheme .stk-block-background,
+       .stk--has-container-scheme .stk-container:not(.stk--no-background)) .wp-block-heading {
+  color: var(--stk-heading-color);
+}
+
+:is([class*='stk--background-scheme'],
+       [class*='stk--container-scheme'],
+       .stk--has-base-scheme,
+       .stk--has-background-scheme .stk-block-background,
+       .stk--has-container-scheme .stk-container:not(.stk--no-background)) a {
+    color: var(--stk-link-color, var(--theme-link-initial-color, unset));
+}
+
+:is([class*='stk--background-scheme'],
+       [class*='stk--container-scheme'],
+       .stk--has-base-scheme,
+       .stk--has-background-scheme .stk-block-background,
+       .stk--has-container-scheme .stk-container:not(.stk--no-background)) a:hover {
+    color: var(--stk-link-color-hover, var(--stk-link-color, var(--theme-link-hover-color, unset)));
+}
+
+:is([class*='stk--background-scheme'],
+       [class*='stk--container-scheme'],
+       .stk--has-base-scheme,
+       .stk--has-background-scheme .stk-block-background,
+       .stk--has-container-scheme .stk-container:not(.stk--no-background)) .wp-element-button {
+    background: var(--stk-button-background-color);
+    color: var(--stk-button-text-color);
+    padding: var(--stk-button-padding);
+}
+
+:is([class*='stk--background-scheme'],
+       [class*='stk--container-scheme'],
+       .stk--has-base-scheme,
+       .stk--has-background-scheme .stk-block-background,
+       .stk--has-container-scheme .stk-container:not(.stk--no-background)) .wp-element-button:hover {
+    background: var(--stk-button-background-color-hover, var(--stk-button-background-color));
+    color: var(--stk-button-text-color-hover, var(--stk-button-text-color));
+}
+
+:is([class*='stk--background-scheme'],
+       [class*='stk--container-scheme'],
+       .stk--has-base-scheme,
+       .stk--has-background-scheme .stk-block-background,
+       .stk--has-container-scheme .stk-container:not(.stk--no-background)) .is-style-outline .wp-element-button {
+    background:transparent;
+    color: var(--stk-button-background-color);
+    border-color:  var(--stk-button-background-color);
+}

functions.php

@@ -0,0 +1,29 @@
+<?php
+/**
+ * Start Stackable Theme Functions
+ */
+
+if ( ! function_exists( 'start_stackable_setup' ) ) {
+    /**
+     * Sets up theme defaults and registers support for various WordPress features.
+     */
+	function start_stackable_setup() {
+		add_theme_support( 'wp-block-styles' );
+		add_theme_support( 'responsive-embeds' );
+		add_theme_support( 'editor-styles' );
+	}
+    add_action( 'after_setup_theme', 'start_stackable_setup' );
+}
+
+function start_stackable_enqueue_styles() {
+    $style_path = get_template_directory_uri() . '/assets/css/design-system.css';
+
+    // Frontend
+    wp_enqueue_style('start-stackable-block-styles', $style_path, [], wp_get_theme()->get('Version'));
+
+    // Editor
+    wp_enqueue_style('start-stackable-styles-editor', $style_path, [], wp_get_theme()->get('Version'));
+}
+
+add_action('wp_enqueue_scripts', 'start_stackable_enqueue_styles');
+add_action('enqueue_block_editor_assets', 'start_stackable_enqueue_styles');

parts/footer.html

@@ -1,60 +1 @@
-<!-- wp:group {"metadata":{"name":"Footer"},"style":{"spacing":{"margin":{"top":"var:preset|spacing|x-large","bottom":"var:preset|spacing|x-large"},"padding":{"top":"var:preset|spacing|xx-large","bottom":"var:preset|spacing|xx-large","left":"var:preset|spacing|xx-large","right":"var:preset|spacing|xx-large"}}},"layout":{"type":"constrained"}} -->
-<div class="wp-block-group" style="margin-top:var(--wp--preset--spacing--x-large);margin-bottom:var(--wp--preset--spacing--x-large);padding-top:var(--wp--preset--spacing--xx-large);padding-right:var(--wp--preset--spacing--xx-large);padding-bottom:var(--wp--preset--spacing--xx-large);padding-left:var(--wp--preset--spacing--xx-large)"><!-- wp:group {"align":"wide","layout":{"type":"default"}} -->
-<div class="wp-block-group alignwide"><!-- wp:columns -->
-<div class="wp-block-columns"><!-- wp:column {"width":"50%","style":{"spacing":{"blockGap":"var:preset|spacing|large"}},"layout":{"type":"default"}} -->
-<div class="wp-block-column" style="flex-basis:50%"><!-- wp:site-title {"level":3} /-->
-
-<!-- wp:site-tagline /-->
-
-<!-- wp:social-links {"iconColor":"base","iconColorValue":"#fff","iconBackgroundColor":"main","iconBackgroundColorValue":"#14111f","className":"is-style-default","style":{"spacing":{"blockGap":{"top":"var:preset|spacing|small","left":"var:preset|spacing|small"}}},"layout":{"type":"flex","justifyContent":"left"}} -->
-<ul class="wp-block-social-links has-icon-color has-icon-background-color is-style-default"><!-- wp:social-link {"url":"#","service":"twitter"} /-->
-
-<!-- wp:social-link {"url":"#","service":"instagram"} /-->
-
-<!-- wp:social-link {"url":"#","service":"linkedin"} /-->
-
-<!-- wp:social-link {"url":"#","service":"facebook"} /--></ul>
-<!-- /wp:social-links --></div>
-<!-- /wp:column -->
-
-<!-- wp:column {"width":"50%"} -->
-<div class="wp-block-column" style="flex-basis:50%"><!-- wp:columns -->
-<div class="wp-block-columns"><!-- wp:column {"width":"100%"} -->
-<div class="wp-block-column" style="flex-basis:100%"><!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|80"}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"right"}} -->
-<div class="wp-block-group"><!-- wp:group {"style":{"spacing":{"padding":{"right":"0","left":"0"}}},"layout":{"type":"constrained"}} -->
-<div class="wp-block-group" style="padding-right:0;padding-left:0"><!-- wp:heading {"level":3,"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}},"fontSize":"medium"} -->
-<h3 class="wp-block-heading has-medium-font-size" style="font-style:normal;font-weight:700">Resources</h3>
-<!-- /wp:heading -->
-
-<!-- wp:navigation {"ref":2255,"overlayMenu":"never","style":{"spacing":{"blockGap":"var:preset|spacing|medium"}},"fontSize":"medium","layout":{"type":"flex","orientation":"vertical"},"ariaLabel":"Stories"} /--></div>
-<!-- /wp:group -->
-
-<!-- wp:group {"style":{"spacing":{"padding":{"right":"0","left":"0"}}},"layout":{"type":"constrained"}} -->
-<div class="wp-block-group" style="padding-right:0;padding-left:0"><!-- wp:heading {"level":3,"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}},"fontSize":"medium"} -->
-<h3 class="wp-block-heading has-medium-font-size" style="font-style:normal;font-weight:700">About</h3>
-<!-- /wp:heading -->
-
-<!-- wp:navigation {"ref":2254,"overlayMenu":"never","style":{"spacing":{"blockGap":"var:preset|spacing|medium"}},"fontSize":"medium","layout":{"type":"flex","orientation":"vertical"},"ariaLabel":"Featured"} /--></div>
-<!-- /wp:group --></div>
-<!-- /wp:group --></div>
-<!-- /wp:column --></div>
-<!-- /wp:columns --></div>
-<!-- /wp:column --></div>
-<!-- /wp:columns -->
-
-<!-- wp:spacer {"height":"var:preset|spacing|60"} -->
-<div style="height:var(--wp--preset--spacing--60)" aria-hidden="true" class="wp-block-spacer"></div>
-<!-- /wp:spacer -->
-
-<!-- wp:group {"align":"full","layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
-<div class="wp-block-group alignfull"><!-- wp:paragraph {"fontSize":"small"} -->
-<p class="has-small-font-size">© 2025 <strong>·</strong> Start Stackable Theme</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph {"fontSize":"small"} -->
-<p class="has-small-font-size">
-			Designed with <a href="https://wordpress.org" rel="nofollow">WordPress</a>			</p>
-<!-- /wp:paragraph --></div>
-<!-- /wp:group --></div>
-<!-- /wp:group --></div>
-<!-- /wp:group -->
+<!-- wp:pattern {"slug":"start-stackable/footer"} /-->

parts/header.html

@@ -1,7 +1 @@
-<!-- wp:group {"metadata":{"name":"Header"},"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|xx-large","bottom":"var:preset|spacing|xx-large","left":"var:preset|spacing|xx-large","right":"var:preset|spacing|xx-large"}}},"layout":{"type":"default"}} -->
-<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--xx-large);padding-right:var(--wp--preset--spacing--xx-large);padding-bottom:var(--wp--preset--spacing--xx-large);padding-left:var(--wp--preset--spacing--xx-large)"><!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"space-between"}} -->
-<div class="wp-block-group"><!-- wp:site-title {"level":3} /-->
-
-<!-- wp:navigation {"ref":2188} /--></div>
-<!-- /wp:group --></div>
-<!-- /wp:group -->
+<!-- wp:pattern {"slug":"start-stackable/header"} /-->

patterns/footer-centered.php

@@ -0,0 +1,37 @@
+<?php
+/**
+ * Title: Footer centered
+ * Slug: start-stackable/footer-centered
+ * Categories: footers
+ * Block Types: core/template-part/footer
+ */
+
+?>
+
+<!-- wp:group {"metadata":{"name":"Footer"},"style":{"spacing":{"margin":{"top":"var:preset|spacing|xx-large","bottom":"var:preset|spacing|xx-large"},"padding":{"top":"0","bottom":"0","left":"var:preset|spacing|xx-large","right":"var:preset|spacing|xx-large"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group" style="margin-top:var(--wp--preset--spacing--xx-large);margin-bottom:var(--wp--preset--spacing--xx-large);padding-top:0;padding-right:var(--wp--preset--spacing--xx-large);padding-bottom:0;padding-left:var(--wp--preset--spacing--xx-large)"><!-- wp:group {"align":"wide","style":{"spacing":{"blockGap":"var:preset|spacing|x-large"}},"layout":{"type":"default"}} -->
+<div class="wp-block-group alignwide"><!-- wp:site-title {"level":0,"textAlign":"center","fontSize":"x-large"} /-->
+
+<!-- wp:navigation {"overlayMenu":"never","style":{"spacing":{"blockGap":"var:preset|spacing|medium"}},"fontSize":"medium","layout":{"type":"flex","orientation":"horizontal","justifyContent":"center"},"ariaLabel":"Stories"} /-->
+
+<!-- wp:social-links {"iconColor":"base","iconColorValue":"#fff","iconBackgroundColor":"main","iconBackgroundColorValue":"#14111f","align":"center","className":"is-style-default","style":{"spacing":{"blockGap":{"top":"var:preset|spacing|small","left":"var:preset|spacing|small"}}},"layout":{"type":"flex","justifyContent":"left"}} -->
+<ul class="wp-block-social-links aligncenter has-icon-color has-icon-background-color is-style-default"><!-- wp:social-link {"url":"#","service":"twitter"} /-->
+
+<!-- wp:social-link {"url":"#","service":"instagram"} /-->
+
+<!-- wp:social-link {"url":"#","service":"linkedin"} /-->
+
+<!-- wp:social-link {"url":"#","service":"facebook"} /--></ul>
+<!-- /wp:social-links -->
+
+<!-- wp:group {"align":"full","style":{"spacing":{"margin":{"top":"var:preset|spacing|xx-large","bottom":"var:preset|spacing|xx-large"}}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
+<div class="wp-block-group alignfull" style="margin-top:var(--wp--preset--spacing--xx-large);margin-bottom:var(--wp--preset--spacing--xx-large)"><!-- wp:paragraph {"fontSize":"small"} -->
+<p class="has-small-font-size">© 2025 <strong>·</strong> Start Stackable Theme</p>
+<!-- /wp:paragraph -->
+
+<!-- wp:paragraph {"fontSize":"small"} -->
+<p class="has-small-font-size">Built with <a href="https://wordpress.org" rel="nofollow">WordPress</a></p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->

patterns/footer-minimal.php

@@ -0,0 +1,19 @@
+<?php
+/**
+ * Title: Footer minimal
+ * Slug: start-stackable/footer-minimal
+ * Categories: footers
+ * Block Types: core/template-part/footer
+ */
+
+?>
+
+<!-- wp:group {"metadata":{"name":"Footer"},"style":{"spacing":{"margin":{"top":"var:preset|spacing|xx-large","bottom":"var:preset|spacing|xx-large"},"padding":{"top":"0","bottom":"0","left":"var:preset|spacing|xx-large","right":"var:preset|spacing|xx-large"}}},"layout":{"type":"default"}} -->
+<div class="wp-block-group" style="margin-top:var(--wp--preset--spacing--xx-large);margin-bottom:var(--wp--preset--spacing--xx-large);padding-top:0;padding-right:var(--wp--preset--spacing--xx-large);padding-bottom:0;padding-left:var(--wp--preset--spacing--xx-large)"><!-- wp:group {"align":"full","style":{"spacing":{"margin":{"top":"var:preset|spacing|xx-large","bottom":"var:preset|spacing|xx-large"}}},"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"space-between"}} -->
+<div class="wp-block-group alignfull" style="margin-top:var(--wp--preset--spacing--xx-large);margin-bottom:var(--wp--preset--spacing--xx-large)"><!-- wp:site-title {"level":0,"textAlign":"left","fontSize":"x-large"} /-->
+
+<!-- wp:paragraph {"fontSize":"small"} -->
+<p class="has-small-font-size">© 2025 <strong>·</strong> Start Stackable Theme</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->

patterns/footer-no-title.php

@@ -0,0 +1,43 @@
+<?php
+/**
+ * Title: Footer no title
+ * Slug: start-stackable/footer-no-title
+ * Categories: footers
+ * Block Types: core/template-part/footer
+ */
+
+?>
+
+<!-- wp:group {"metadata":{"name":"Footer"},"style":{"spacing":{"margin":{"top":"var:preset|spacing|x-large","bottom":"var:preset|spacing|x-large"},"padding":{"top":"var:preset|spacing|xx-large","bottom":"var:preset|spacing|xx-large","left":"var:preset|spacing|xx-large","right":"var:preset|spacing|xx-large"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group" style="margin-top:var(--wp--preset--spacing--x-large);margin-bottom:var(--wp--preset--spacing--x-large);padding-top:var(--wp--preset--spacing--xx-large);padding-right:var(--wp--preset--spacing--xx-large);padding-bottom:var(--wp--preset--spacing--xx-large);padding-left:var(--wp--preset--spacing--xx-large)"><!-- wp:group {"align":"wide","layout":{"type":"default"}} -->
+<div class="wp-block-group alignwide"><!-- wp:columns {"style":{"spacing":{"blockGap":{"top":"var:preset|spacing|xxx-large","left":"var:preset|spacing|xxx-large"}}}} -->
+<div class="wp-block-columns"><!-- wp:column {"width":"30%"} -->
+<div class="wp-block-column" style="flex-basis:30%"><!-- wp:group {"style":{"spacing":{"padding":{"right":"0","left":"0"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group" style="padding-right:0;padding-left:0"><!-- wp:heading {"level":3,"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}},"fontSize":"medium"} -->
+<h3 class="wp-block-heading has-medium-font-size" style="font-style:normal;font-weight:700">Resources</h3>
+<!-- /wp:heading -->
+
+<!-- wp:navigation {"ref":2255,"overlayMenu":"never","style":{"spacing":{"blockGap":"var:preset|spacing|medium"}},"fontSize":"medium","layout":{"type":"flex","orientation":"vertical"},"ariaLabel":"Stories"} /--></div>
+<!-- /wp:group --></div>
+<!-- /wp:column -->
+
+<!-- wp:column {"width":"30%"} -->
+<div class="wp-block-column" style="flex-basis:30%"><!-- wp:group {"style":{"spacing":{"padding":{"right":"0","left":"0"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group" style="padding-right:0;padding-left:0"><!-- wp:heading {"level":3,"style":{"typography":{"fontStyle":"normal","fontWeight":"700"}},"fontSize":"medium"} -->
+<h3 class="wp-block-heading has-medium-font-size" style="font-style:normal;font-weight:700">About</h3>
+<!-- /wp:heading -->
+
+<!-- wp:navigation {"ref":2254,"overlayMenu":"never","style":{"spacing":{"blockGap":"var:preset|spacing|medium"}},"fontSize":"medium","layout":{"type":"flex","orientation":"vertical"},"ariaLabel":"Featured"} /--></div>
+<!-- /wp:group --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns -->
+
+<!-- wp:spacer {"height":"50px"} -->
+<div style="height:50px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+<!-- wp:paragraph {"align":"right","fontSize":"small"} -->
+<p class="has-text-align-right has-small-font-size">© 2025 <strong>·</strong> Start Stackable Theme</p>
+<!-- /wp:paragraph --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->