From 018b56c4401aefaf442f5fe7d23fa4411c080d15 Mon Sep 17 00:00:00 2001
From: Brian Gardner <bmg1227@gmail.com>
Date: Tue, 29 Nov 2022 10:33:59 -0600
Subject: [PATCH] Update Footer patterns with fluid spacing.

---
 .../footer-default-contrast-background.php    |   4 +-
 patterns/footer-default.php                   |   4 +-
 patterns/footer-mega-contrast-background.php  | 100 +++++++++---------
 patterns/footer-mega.php                      | 100 +++++++++---------
 patterns/footer-split-contrast-background.php |   4 +-
 patterns/footer-split.php                     |   4 +-
 .../footer-stacked-contrast-background.php    |  11 +-
 patterns/footer-stacked.php                   |  11 +-
 ...oter-three-columns-contrast-background.php |   4 +-
 patterns/footer-three-columns.php             |   4 +-
 10 files changed, 120 insertions(+), 126 deletions(-)

diff --git a/patterns/footer-default-contrast-background.php b/patterns/footer-default-contrast-background.php
index 5485b8fd..79f44342 100644
--- a/patterns/footer-default-contrast-background.php
+++ b/patterns/footer-default-contrast-background.php
@@ -7,8 +7,8 @@
  * Viewport Width: 1280
  */
 ?>
-<!-- wp:group {"layout":{"type":"constrained"},"align":"full","style":{"spacing":{"padding":{"top":"40px","bottom":"40px"},"margin":{"top":"0px"}},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color","fontSize":"small"} -->
-<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color has-small-font-size" style="margin-top:0px;padding-top:40px;padding-bottom:40px">
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|small","bottom":"var:preset|spacing|small"},"margin":{"top":"0px"}},"elements":{"link":{"color":{"text":"var:preset|color|background"}}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color","layout":{"type":"constrained"},"fontSize":"small"} -->
+<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color has-small-font-size" style="margin-top:0px;padding-top:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--small)">
 <!-- wp:group {"align":"wide","layout":{"type":"flex","allowOrientation":false,"justifyContent":"space-between"}} -->
 <div class="wp-block-group alignwide">
 <!-- wp:paragraph -->
diff --git a/patterns/footer-default.php b/patterns/footer-default.php
index 131a14b3..3ff66dd5 100644
--- a/patterns/footer-default.php
+++ b/patterns/footer-default.php
@@ -7,8 +7,8 @@
  * Viewport Width: 1280
  */
 ?>
-<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40px","bottom":"40px"},"margin":{"top":"0px"}}},"layout":{"type":"constrained"},"fontSize":"small"} -->
-<div class="wp-block-group alignfull has-small-font-size" style="margin-top:0px;padding-top:40px;padding-bottom:40px">
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|small","bottom":"var:preset|spacing|small"},"margin":{"top":"0px"}}},"layout":{"type":"constrained"},"fontSize":"small"} -->
+<div class="wp-block-group alignfull has-small-font-size" style="margin-top:0px;padding-top:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--small)">
 <!-- wp:group {"align":"wide","layout":{"type":"flex","allowOrientation":false,"justifyContent":"space-between"}} -->
 <div class="wp-block-group alignwide">
 <!-- wp:paragraph -->
diff --git a/patterns/footer-mega-contrast-background.php b/patterns/footer-mega-contrast-background.php
index e197f9a3..352693e1 100644
--- a/patterns/footer-mega-contrast-background.php
+++ b/patterns/footer-mega-contrast-background.php
@@ -7,86 +7,86 @@
  * Viewport Width: 1280
  */
 ?>
-<!-- wp:group {"layout":{"type":"constrained"},"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}},"typography":{"fontSize":"18px"},"spacing":{"margin":{"top":"0px"}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color"} -->
-<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color" style="margin-top:0px;font-size:18px">
-<!-- wp:columns {"align":"wide","style":{"elements":{"link":{"color":[]}},"spacing":{"padding":{"top":"100px","bottom":"100px"},"blockGap":"100px"}}} -->
-<div class="wp-block-columns alignwide has-link-color" style="padding-top:100px;padding-bottom:100px">
-<!-- wp:column {"width":"50%"} -->
-<div class="wp-block-column" style="flex-basis:50%">
-<!-- wp:heading {"level":4} -->
+<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}},"typography":{"fontSize":"18px"},"spacing":{"padding":{"top":"var:preset|spacing|x-large","bottom":"var:preset|spacing|x-large"},"margin":{"top":"0px"}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color","layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color" style="margin-top:0px;padding-top:var(--wp--preset--spacing--x-large);padding-bottom:var(--wp--preset--spacing--x-large);font-size:18px"><!-- wp:columns {"align":"wide","style":{"elements":{"link":{"color":[]}}}} -->
+<div class="wp-block-columns alignwide has-link-color"><!-- wp:column {"width":"55%"} -->
+<div class="wp-block-column" style="flex-basis:55%"><!-- wp:heading {"level":4} -->
 <h4 id="our-company"><?php echo esc_html__( 'Our Company', 'frost' ); ?></h4>
 <!-- /wp:heading -->
 <!-- wp:paragraph -->
-<p>Lorem ipsum dolor sit amet, consectetur adipiscing lectus. Vestibulum mi justo, luctus eu pellentesque vitae gravida non.</p>
+<p>Quisque aliquam nisl quis metus taylor feugiat. Lorem ipsum dolor sit amet, consectetur adipiscing vestibulum vitae gravida non diam.</p>
 <!-- /wp:paragraph -->
 <!-- wp:buttons -->
-<div class="wp-block-buttons">
-<!-- wp:button {"style":{"border":{"radius":0}},"className":"is-style-fill-base"} -->
-<div class="wp-block-button is-style-fill-base">
-<a class="wp-block-button__link no-border-radius" href="#"><?php echo esc_html__( 'Learn More', 'frost' ); ?></a>
-</div>
-<!-- /wp:button -->
-</div>
-<!-- /wp:buttons -->
-</div>
+<div class="wp-block-buttons"><!-- wp:button {"style":{"border":{"radius":0}},"className":"is-style-fill-base"} -->
+<div class="wp-block-button is-style-fill-base"><a class="wp-block-button__link no-border-radius wp-element-button" href="#"><?php echo esc_html__( 'Learn More', 'frost' ); ?></a></div>
+<!-- /wp:button --></div>
+<!-- /wp:buttons --></div>
 <!-- /wp:column -->
-<!-- wp:column -->
-<div class="wp-block-column">
-<!-- wp:columns -->
-<div class="wp-block-columns">
-<!-- wp:column {"width":"33%"} -->
-<div class="wp-block-column" style="flex-basis:33%">
-<!-- wp:heading {"level":4} -->
+<!-- wp:column {"width":"15%"} -->
+<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
 <h4 id="about-us"><?php echo esc_html__( 'About Us', 'frost' ); ?></h4>
 <!-- /wp:heading -->
 <!-- wp:list {"fontSize":"small"} -->
-<ul class="has-small-font-size">
+<ul class="has-small-font-size"><!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Start Here', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Our Mission', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Brand Guide', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Newsletter', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Accessibility', 'frost' ); ?></a></li>
-</ul>
-<!-- /wp:list -->
-</div>
+<!-- /wp:list-item --></ul>
+<!-- /wp:list --></div>
 <!-- /wp:column -->
-<!-- wp:column {"width":"33%"} -->
-<div class="wp-block-column" style="flex-basis:33%">
-<!-- wp:heading {"level":4} -->
+<!-- wp:column {"width":"15%"} -->
+<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
 <h4 id="services"><?php echo esc_html__( 'Services', 'frost' ); ?></h4>
 <!-- /wp:heading -->
 <!-- wp:list {"fontSize":"small"} -->
-<ul class="has-small-font-size">
+<ul class="has-small-font-size"><!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Web Design', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Development', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Copywriting', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Marketing', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Social Media', 'frost' ); ?></a></li>
-</ul>
-<!-- /wp:list -->
-</div>
+<!-- /wp:list-item --></ul>
+<!-- /wp:list --></div>
 <!-- /wp:column -->
-<!-- wp:column {"width":"33%"} -->
-<div class="wp-block-column" style="flex-basis:33%">
-<!-- wp:heading {"level":4} -->
+<!-- wp:column {"width":"15%"} -->
+<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
 <h4 id="connect"><?php echo esc_html__( 'Connect', 'frost' ); ?></h4>
 <!-- /wp:heading -->
 <!-- wp:list {"fontSize":"small"} -->
-<ul class="has-small-font-size">
+<ul class="has-small-font-size"><!-- wp:list-item -->
 <li><a href="#">Facebook</a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#">Instagram</a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#">Twitter</a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#">LinkedIn</a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#">Dribbble</a></li>
-</ul>
-<!-- /wp:list -->
-</div>
-<!-- /wp:column -->
-</div>
-<!-- /wp:columns -->
-</div>
-<!-- /wp:column -->
-</div>
-<!-- /wp:columns -->
-</div>
+<!-- /wp:list-item --></ul>
+<!-- /wp:list --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
 <!-- /wp:group -->
diff --git a/patterns/footer-mega.php b/patterns/footer-mega.php
index df262562..f4779425 100644
--- a/patterns/footer-mega.php
+++ b/patterns/footer-mega.php
@@ -7,86 +7,86 @@
  * Viewport Width: 1280
  */
 ?>
-<!-- wp:group {"align":"full","style":{"typography":{"fontSize":"18px"},"spacing":{"margin":{"top":"0px"}}},"layout":{"type":"constrained"}} -->
-<div class="wp-block-group alignfull" style="font-size:18px;margin-top:0px">
-<!-- wp:columns {"align":"wide","style":{"elements":{"link":{"color":[]}},"spacing":{"padding":{"top":"100px","bottom":"100px"},"blockGap":"100px"}}} -->
-<div class="wp-block-columns alignwide has-link-color" style="padding-top:100px;padding-bottom:100px">
-<!-- wp:column {"width":"50%"} -->
-<div class="wp-block-column" style="flex-basis:50%">
-<!-- wp:heading {"level":4} -->
+<!-- wp:group {"align":"full","style":{"typography":{"fontSize":"18px"},"spacing":{"margin":{"top":"0px"},"padding":{"top":"var:preset|spacing|x-large","bottom":"var:preset|spacing|x-large"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="margin-top:0px;padding-top:var(--wp--preset--spacing--x-large);padding-bottom:var(--wp--preset--spacing--x-large);font-size:18px"><!-- wp:columns {"align":"wide","style":{"elements":{"link":{"color":[]}}}} -->
+<div class="wp-block-columns alignwide has-link-color"><!-- wp:column {"width":"55%"} -->
+<div class="wp-block-column" style="flex-basis:55%"><!-- wp:heading {"level":4} -->
 <h4 id="our-company"><?php echo esc_html__( 'Our Company', 'frost' ); ?></h4>
 <!-- /wp:heading -->
 <!-- wp:paragraph -->
-<p>Lorem ipsum dolor sit amet, consectetur adipiscing lectus. Vestibulum mi justo, luctus eu pellentesque vitae gravida non.</p>
+<p>Quisque aliquam nisl quis metus taylor feugiat. Lorem ipsum dolor sit amet, consectetur adipiscing vestibulum vitae gravida non diam.</p>
 <!-- /wp:paragraph -->
 <!-- wp:buttons -->
-<div class="wp-block-buttons">
-<!-- wp:button {"style":{"border":{"radius":0}},"className":"is-style-fill"} -->
-<div class="wp-block-button is-style-fill">
-<a class="wp-block-button__link no-border-radius" href="#"><?php echo esc_html__( 'Learn More', 'frost' ); ?></a>
-</div>
-<!-- /wp:button -->
-</div>
-<!-- /wp:buttons -->
-</div>
+<div class="wp-block-buttons"><!-- wp:button {"style":{"border":{"radius":0}},"className":"is-style-fill"} -->
+<div class="wp-block-button is-style-fill"><a class="wp-block-button__link no-border-radius wp-element-button" href="#"><?php echo esc_html__( 'Learn More', 'frost' ); ?></a></div>
+<!-- /wp:button --></div>
+<!-- /wp:buttons --></div>
 <!-- /wp:column -->
-<!-- wp:column -->
-<div class="wp-block-column">
-<!-- wp:columns -->
-<div class="wp-block-columns">
-<!-- wp:column {"width":"33%"} -->
-<div class="wp-block-column" style="flex-basis:33%">
-<!-- wp:heading {"level":4} -->
+<!-- wp:column {"width":"15%"} -->
+<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
 <h4 id="about-us"><?php echo esc_html__( 'About Us', 'frost' ); ?></h4>
 <!-- /wp:heading -->
 <!-- wp:list {"fontSize":"small"} -->
-<ul class="has-small-font-size">
+<ul class="has-small-font-size"><!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Start Here', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Our Mission', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Brand Guide', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Newsletter', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Accessibility', 'frost' ); ?></a></li>
-</ul>
-<!-- /wp:list -->
-</div>
+<!-- /wp:list-item --></ul>
+<!-- /wp:list --></div>
 <!-- /wp:column -->
-<!-- wp:column {"width":"33%"} -->
-<div class="wp-block-column" style="flex-basis:33%">
-<!-- wp:heading {"level":4} -->
+<!-- wp:column {"width":"15%"} -->
+<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
 <h4 id="services"><?php echo esc_html__( 'Services', 'frost' ); ?></h4>
 <!-- /wp:heading -->
 <!-- wp:list {"fontSize":"small"} -->
-<ul class="has-small-font-size">
+<ul class="has-small-font-size"><!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Web Design', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Development', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Copywriting', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Marketing', 'frost' ); ?></a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#"><?php echo esc_html__( 'Social Media', 'frost' ); ?></a></li>
-</ul>
-<!-- /wp:list -->
-</div>
+<!-- /wp:list-item --></ul>
+<!-- /wp:list --></div>
 <!-- /wp:column -->
-<!-- wp:column {"width":"33%"} -->
-<div class="wp-block-column" style="flex-basis:33%">
-<!-- wp:heading {"level":4} -->
+<!-- wp:column {"width":"15%"} -->
+<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
 <h4 id="connect"><?php echo esc_html__( 'Connect', 'frost' ); ?></h4>
 <!-- /wp:heading -->
 <!-- wp:list {"fontSize":"small"} -->
-<ul class="has-small-font-size">
+<ul class="has-small-font-size"><!-- wp:list-item -->
 <li><a href="#">Facebook</a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#">Instagram</a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#">Twitter</a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#">LinkedIn</a></li>
+<!-- /wp:list-item -->
+<!-- wp:list-item -->
 <li><a href="#">Dribbble</a></li>
-</ul>
-<!-- /wp:list -->
-</div>
-<!-- /wp:column -->
-</div>
-<!-- /wp:columns -->
-</div>
-<!-- /wp:column -->
-</div>
-<!-- /wp:columns -->
-</div>
+<!-- /wp:list-item --></ul>
+<!-- /wp:list --></div>
+<!-- /wp:column --></div>
+<!-- /wp:columns --></div>
 <!-- /wp:group -->
diff --git a/patterns/footer-split-contrast-background.php b/patterns/footer-split-contrast-background.php
index ae98374d..f8f024b7 100644
--- a/patterns/footer-split-contrast-background.php
+++ b/patterns/footer-split-contrast-background.php
@@ -7,8 +7,8 @@
  * Viewport Width: 1280
  */
 ?>
-<!-- wp:group {"layout":{"type":"constrained"},"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}},"spacing":{"padding":{"top":"40vh","bottom":"40px"},"margin":{"top":"0px"}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color","fontSize":"small"} -->
-<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color has-small-font-size" style="margin-top:0px;padding-top:40vh;padding-bottom:40px">
+<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}},"spacing":{"padding":{"top":"40vh","bottom":"var:preset|spacing|small"},"margin":{"top":"0px"}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color","layout":{"type":"constrained"},"fontSize":"small"} -->
+<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color has-small-font-size" style="margin-top:0px;padding-top:40vh;padding-bottom:var(--wp--preset--spacing--small)">
 <!-- wp:columns {"verticalAlignment":"center","align":"wide"} -->
 <div class="wp-block-columns alignwide are-vertically-aligned-center">
 <!-- wp:column {"verticalAlignment":"center","width":"75%"} -->
diff --git a/patterns/footer-split.php b/patterns/footer-split.php
index 9ceb4be2..8bddffc2 100644
--- a/patterns/footer-split.php
+++ b/patterns/footer-split.php
@@ -7,8 +7,8 @@
  * Viewport Width: 1280
  */
 ?>
-<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40vh","bottom":"40px"},"margin":{"top":"0px"}}},"layout":{"type":"constrained"},"fontSize":"small"} -->
-<div class="wp-block-group alignfull has-small-font-size" style="margin-top:0px;padding-top:40vh;padding-bottom:40px">
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40vh","bottom":"var:preset|spacing|small"},"margin":{"top":"0px"}}},"layout":{"type":"constrained"},"fontSize":"small"} -->
+<div class="wp-block-group alignfull has-small-font-size" style="margin-top:0px;padding-top:40vh;padding-bottom:var(--wp--preset--spacing--small)">
 <!-- wp:columns {"verticalAlignment":"center","align":"wide"} -->
 <div class="wp-block-columns alignwide are-vertically-aligned-center">
 <!-- wp:column {"verticalAlignment":"center","width":"75%"} -->
diff --git a/patterns/footer-stacked-contrast-background.php b/patterns/footer-stacked-contrast-background.php
index d8937884..126a37b8 100644
--- a/patterns/footer-stacked-contrast-background.php
+++ b/patterns/footer-stacked-contrast-background.php
@@ -6,24 +6,21 @@
  * Block Types: core/template-part/footer
  */
 ?>
-<!-- wp:group {"layout":{"type":"constrained"},"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}},"spacing":{"padding":{"top":"100px","bottom":"40px"},"margin":{"top":"0px"}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color"} -->
-<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color" style="margin-top:0px;padding-top:100px;padding-bottom:40px">
+<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}},"spacing":{"padding":{"top":"var:preset|spacing|x-large","bottom":"var:preset|spacing|small"},"margin":{"top":"0px"}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color","layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color" style="margin-top:0px;padding-top:var(--wp--preset--spacing--x-large);padding-bottom:var(--wp--preset--spacing--small)">
 <!-- wp:heading {"textAlign":"center","style":{"typography":{"fontStyle":"normal","fontWeight":"400"},"spacing":{"margin":{"bottom":"20px"}}},"fontSize":"max-48"} -->
 <h2 class="has-text-align-center has-max-48-font-size" id="let-s-connect" style="font-style:normal;font-weight:400;margin-bottom:20px"><?php echo esc_html__( 'Let’s Connect', 'frost' ); ?></h2>
 <!-- /wp:heading -->
 <!-- wp:paragraph {"align":"center"} -->
 <p class="has-text-align-center">Quisque aliquam nisl quis metus taylor feugiat. Lorem ipsum dolor sit amet, consectetur adipiscing vestibulum vitae gravida non diam.</p>
 <!-- /wp:paragraph -->
-<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center","orientation":"horizontal"}} -->
-<div class="wp-block-buttons">
+<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center","orientation":"horizontal"},"style":{"spacing":{"margin":{"bottom":"var:preset|spacing|x-large"}}}} -->
+<div class="wp-block-buttons" style="margin-bottom:var(--wp--preset--spacing--x-large)">
 <!-- wp:button {"style":{"border":{"radius":0}},"className":"is-style-outline-base"} -->
 <div class="wp-block-button is-style-outline-base"><a class="wp-block-button__link no-border-radius" href="#"><?php echo esc_html__( 'Get in Touch', 'frost' ); ?> →</a></div>
 <!-- /wp:button -->
 </div>
 <!-- /wp:buttons -->
-<!-- wp:spacer {"height":100} -->
-<div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
-<!-- /wp:spacer -->
 <!-- wp:paragraph {"align":"center","fontSize":"small"} -->
 <p class="has-text-align-center has-small-font-size">© <?php echo esc_html( gmdate( 'Y' ) ); ?> Your Company LLC · <a href="#"><?php echo esc_html__( 'Contact Us', 'frost' ); ?></a></p>
 <!-- /wp:paragraph -->
diff --git a/patterns/footer-stacked.php b/patterns/footer-stacked.php
index 435c6dac..25ff85fa 100644
--- a/patterns/footer-stacked.php
+++ b/patterns/footer-stacked.php
@@ -6,24 +6,21 @@
  * Block Types: core/template-part/footer
  */
 ?>
-<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"100px","bottom":"40px"},"margin":{"top":"0px"}}},"layout":{"type":"constrained"}} -->
-<div class="wp-block-group alignfull" style="margin-top:0px;padding-top:100px;padding-bottom:40px">
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|x-large","bottom":"var:preset|spacing|small"},"margin":{"top":"0px"}}},"layout":{"type":"constrained"}} -->
+<div class="wp-block-group alignfull" style="margin-top:0px;padding-top:var(--wp--preset--spacing--x-large);padding-bottom:var(--wp--preset--spacing--small)">
 <!-- wp:heading {"textAlign":"center","style":{"typography":{"fontStyle":"normal","fontWeight":"400"},"spacing":{"margin":{"bottom":"20px"}}},"fontSize":"max-48"} -->
 <h2 class="has-text-align-center has-max-48-font-size" id="let-s-connect" style="font-style:normal;font-weight:400;margin-bottom:20px"><?php echo esc_html__( 'Let’s Connect', 'frost' ); ?></h2>
 <!-- /wp:heading -->
 <!-- wp:paragraph {"align":"center"} -->
 <p class="has-text-align-center">Quisque aliquam nisl quis metus taylor feugiat. Lorem ipsum dolor sit amet, consectetur adipiscing vestibulum vitae gravida non diam.</p>
 <!-- /wp:paragraph -->
-<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center","orientation":"horizontal"}} -->
-<div class="wp-block-buttons">
+<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center","orientation":"horizontal"},"style":{"spacing":{"margin":{"bottom":"var:preset|spacing|x-large"}}}} -->
+<div class="wp-block-buttons" style="margin-bottom:var(--wp--preset--spacing--x-large)">
 <!-- wp:button {"style":{"border":{"radius":0}},"className":"is-style-outline"} -->
 <div class="wp-block-button is-style-outline"><a class="wp-block-button__link no-border-radius" href="#"><?php echo esc_html__( 'Get in Touch', 'frost' ); ?> →</a></div>
 <!-- /wp:button -->
 </div>
 <!-- /wp:buttons -->
-<!-- wp:spacer {"height":100} -->
-<div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
-<!-- /wp:spacer -->
 <!-- wp:paragraph {"align":"center","fontSize":"small"} -->
 <p class="has-text-align-center has-small-font-size">© <?php echo esc_html( gmdate( 'Y' ) ); ?> Your Company LLC · <a href="#"><?php echo esc_html__( 'Contact Us', 'frost' ); ?></a></p>
 <!-- /wp:paragraph -->
diff --git a/patterns/footer-three-columns-contrast-background.php b/patterns/footer-three-columns-contrast-background.php
index 7728d1bb..02e2a6ab 100644
--- a/patterns/footer-three-columns-contrast-background.php
+++ b/patterns/footer-three-columns-contrast-background.php
@@ -7,8 +7,8 @@
  * Viewport Width: 1280
  */
 ?>
-<!-- wp:group {"layout":{"type":"constrained"},"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}},"spacing":{"padding":{"top":"40px","bottom":"40px"},"margin":{"top":"0px"}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color","fontSize":"small"} -->
-<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color has-small-font-size" style="margin-top:0px;padding-top:40px;padding-bottom:40px">
+<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|base"}}},"spacing":{"padding":{"top":"var:preset|spacing|small","bottom":"var:preset|spacing|small"},"margin":{"top":"0px"}}},"backgroundColor":"contrast","textColor":"base","className":"has-background-color","layout":{"type":"constrained"},"fontSize":"small"} -->
+<div class="wp-block-group alignfull has-background-color has-base-color has-contrast-background-color has-text-color has-background has-link-color has-small-font-size" style="margin-top:0px;padding-top:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--small)">
 <!-- wp:group {"align":"wide","layout":{"type":"flex","allowOrientation":false,"justifyContent":"space-between"}} -->
 <div class="wp-block-group alignwide">
 <!-- wp:paragraph -->
diff --git a/patterns/footer-three-columns.php b/patterns/footer-three-columns.php
index f2ea2b37..c01dcd57 100644
--- a/patterns/footer-three-columns.php
+++ b/patterns/footer-three-columns.php
@@ -7,8 +7,8 @@
  * Viewport Width: 1280
  */
 ?>
-<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40px","bottom":"40px"},"margin":{"top":"0px"}}},"layout":{"type":"constrained"},"fontSize":"small"} -->
-<div class="wp-block-group alignfull has-small-font-size" style="margin-top:0px;padding-top:40px;padding-bottom:40px">
+<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|small","bottom":"var:preset|spacing|small"},"margin":{"top":"0px"}}},"layout":{"type":"constrained"},"fontSize":"small"} -->
+<div class="wp-block-group alignfull has-small-font-size" style="margin-top:0px;padding-top:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--small)">
 <!-- wp:group {"align":"wide","layout":{"type":"flex","allowOrientation":false,"justifyContent":"space-between"}} -->
 <div class="wp-block-group alignwide">
 <!-- wp:paragraph -->