Skatepark: refactor CSS into block markup (#5473)

* refactored paragraph with quote pattern

* Image with caption pattern

* testimonial pattern

* Author block refactored

* removed navigation CSS that wasn't doing anything

* post comments CSS removed

* search block

* removed post meta css

* refactor index and links css

* scrapped more css

* removed partials

* removed unused includes

* removed headings styles refactoring pattern

blockbase/inc/patterns/footer-columns.php

@@ -37,8 +37,8 @@ return array(
 		<!-- /wp:column -->
 
 		<!-- wp:column -->
-		<div class="wp-block-column"><!-- wp:heading {"level":3,"style":{"typography":{"fontSize":"14px"}}} -->
-		<h3 style="font-size:14px"><strong>' . esc_html__( 'Search', 'blockbase' ) . '</strong></h3><!-- /wp:heading --><!-- wp:search {"label":"' . esc_html__( 'Search', 'blockbase' ) . '","showLabel":false,"buttonText":"' . esc_html__( 'Search', 'blockbase' ) . '","buttonPosition":"button-inside"} /--></div>
+		<div class="wp-block-column"><!-- wp:heading {"level":3,"style":{"typography":{"fontSize":"14px","textTransform":"uppercase"}}} -->
+		<h3 style="text-transform:uppercase;font-size:14px"><strong>' . esc_html__( 'Search', 'blockbase' ) . '</strong></h3><!-- /wp:heading --><!-- wp:search {"label":"' . esc_html__( 'Search', 'blockbase' ) . '","showLabel":false,"buttonText":"' . esc_html__( 'Search', 'blockbase' ) . '","buttonPosition":"button-inside"} /--></div>
 		<!-- /wp:column --></div>
 		<!-- /wp:columns --></div>
 		<!-- /wp:group -->

skatepark/assets/theme.css

@@ -1,67 +1,3 @@
-@charset "UTF-8";
-/**
- * Breakpoints & Media Queries
- */
-/**
-*  Converts a hex value into the rgb equivalent.
-*
-* @param {string} hex - the hexadecimal value to convert
-* @return {string} comma separated rgb values
-*/
-/**
- * Breakpoint mixins
- */
-/**
- * Long content fade mixin
- *
- * Creates a fading overlay to signify that the content is longer
- * than the space allows.
- */
-/**
- * Focus styles.
- */
-/**
- * Applies editor left position to the selector passed as argument
- */
-/**
- * Styles that are reused verbatim in a few places
- */
-/**
- * Allows users to opt-out of animations via OS-level preferences.
- */
-/**
- * Reset default styles for JavaScript UI based pages.
- * This is a WP-admin agnostic reset
- */
-/**
- * Reset the WP Admin page styles for Gutenberg-like pages.
- */
-::selection {
-  color: var(--wp--custom--color--background);
-  background-color: var(--wp--custom--color--foreground);
-}
-
-.wp-block-post-author__content {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-}
-
-.wp-block-post-author__name {
-  font-weight: 700;
-  line-height: 1;
-  margin-bottom: 0.5em;
-}
-
-.wp-block-post-author__bio {
-  margin: 0;
-  font-size: var(--wp--preset--font-size--small);
-}
-
-.wp-block-post-author__avatar img {
-  border-radius: 50%;
-}
-
 .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
 .wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
 .wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
@@ -106,246 +42,25 @@
   background-color: var(--wp--custom--button--color--text);
 }
 
-.wp-block-file .wp-block-file__button {
-  text-transform: uppercase;
-  letter-spacing: 0.1em;
-}
-
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button,
-.wp-block-search .wp-block-search__button.wp-block-search__button {
-  text-transform: uppercase;
-  letter-spacing: 0.1em;
-}
-
-.wp-block-cover.alignfull {
-  padding-right: max(0.5 * (100% - var(--wp--custom--layout--wide-size)) + var(--wp--custom--gap--horizontal), var(--wp--custom--gap--horizontal));
-  padding-left: max(0.5 * (100% - var(--wp--custom--layout--wide-size)) + var(--wp--custom--gap--horizontal), var(--wp--custom--gap--horizontal));
-}
-
-.wp-block-navigation {
-  font-size: var(--wp--preset--font-size--small);
-}
-.wp-block-navigation .wp-block-navigation-item.current-menu-item > a {
-  -webkit-text-decoration-line: underline;
-          text-decoration-line: underline;
-  text-decoration-thickness: 0.2em;
-  text-underline-offset: 0.35em;
-}
-
-.wp-block-post-comments .reply a {
-  text-decoration-thickness: 0.07em;
-  text-underline-offset: 0.46ex;
-}
-.wp-block-post-comments form {
-  column-gap: 1.2em;
-}
-.wp-block-post-comments .comment-reply-title {
-  margin-bottom: calc(2 * var(--wp--custom--gap--baseline));
-}
-.wp-block-post-comments .comment-author cite {
-  font-weight: bold;
-}
-.wp-block-post-comments .comment-author .says {
-  display: none;
-}
-.wp-block-post-comments .commentmetadata {
-  --wp--style--block-gap: 48px;
-}
-.wp-block-post-comments .commentmetadata a {
-  font-weight: 500;
-}
-.wp-block-post-comments .commentlist {
-  --wp--style--block-gap: 60px;
-}
-.wp-block-post-comments .comment-body > p > a,
-.wp-block-post-comments .comment-edit-link {
-  text-decoration-thickness: 0.07em;
-  text-underline-offset: 0.46ex;
-  text-decoration: underline;
-}
-.wp-block-post-comments .comment-body > p > a:hover,
-.wp-block-post-comments .comment-edit-link:hover {
-  text-decoration: none;
-}
-
-.wp-block-post-featured-image {
-  margin-bottom: 0;
+/* Text selection text color */
+::selection {
+  color: var(--wp--custom--color--background);
+  background-color: var(--wp--custom--color--foreground);
 }
 
-h1.wp-block-post-title {
-  margin-bottom: calc(var(--wp--custom--gap--vertical) * 3);
-}
+/* Post title when featured image is present */
 body:not(.has-featured-image) h1.wp-block-post-title {
   border-bottom: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
   padding-bottom: calc(var(--wp--custom--gap--vertical) * 3);
 }
 
-.wp-block-query-pagination .wp-block-query-pagination-numbers .current {
-  text-decoration-thickness: 0.07em;
-  text-underline-offset: 0.46ex;
-}
-.wp-block-query-pagination .wp-block-query-pagination-numbers .page-numbers {
-  padding: 10px;
-}
-
-.wp-block-search .wp-block-search__button:active, .wp-block-search .wp-block-search__button:focus {
-  outline-offset: -0.25em;
-}
-.wp-block-search .wp-block-search__button svg {
-  min-width: 2em;
-  min-height: 2em;
-}
-.wp-block-search .wp-block-search__button.has-icon {
-  --wp--custom--button--spacing--padding--left: calc( 1.75 * var(--wp--custom--button--spacing--padding--top) );
-  --wp--custom--button--spacing--padding--right: calc( 1.75 * var(--wp--custom--button--spacing--padding--top) );
-}
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
-  padding: 0;
-}
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
-  --wp--custom--button--color--text: var(--wp--custom--color--primary);
-  --wp--custom--button--color--background: var(--wp--custom--color--background);
-  position: relative;
-}
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button::before {
-  content: "";
-  height: 80%;
-  width: 1px;
-  background: var(--wp--custom--color--primary);
-  position: absolute;
-  left: 0;
-  top: 10%;
-}
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:not(.has-background):not(.has-text-color):hover {
-  --wp--custom--button--color--text: var(--wp--custom--color--background);
-  --wp--custom--button--color--background: var(--wp--custom--color--primary);
-}
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:not(.has-background):not(.has-text-color):hover:focus, .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:not(.has-background):not(.has-text-color):hover.has-focus {
-  outline-color: var(--wp--custom--color--background);
-}
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:not(.has-background):not(.has-text-color):focus, .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:not(.has-background):not(.has-text-color).has-focus {
-  border-color: transparent;
-}
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:not(.has-background):not(.has-text-color):focus::before, .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:not(.has-background):not(.has-text-color).has-focus::before {
-  left: calc(-1 * var(--wp--custom--button--border--width));
-}
-
+/* Separator width */
+/* We can remove after https://github.com/WordPress/gutenberg/pull/38635 gets deployed */
 .wp-block-separator.is-style-wide {
   border-width: 0 0 3px 0;
 }
 
-.pre-footer h3 {
-  text-transform: uppercase;
-}
-.pre-footer .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
-  --wp--custom--button--typography--font-size: 14px;
-  --wp--custom--button--spacing--padding--top: 0.5em;
-  --wp--custom--button--spacing--padding--bottom: 0.5em;
-}
-
-.is-style-skatepark-aside-caption {
-  align-items: center;
-  display: flex;
-  flex-direction: column;
-}
-.is-style-skatepark-aside-caption img {
-  justify-self: center;
-}
-.is-style-skatepark-aside-caption figcaption {
-  align-self: flex-end;
-  border-top: 3px solid var(--wp--preset--color--primary);
-  font-size: var(--wp--preset--font-size--small);
-  margin-bottom: 0;
-  margin-top: 20px;
-  padding-top: 20px;
-  max-width: 455px;
-  text-align: left;
-}
-.is-style-skatepark-aside-caption.alignfull figcaption {
-  margin-left: var(--wp--custom--gap--horizontal);
-  margin-right: max(0.5 * (100% - var(--wp--custom--layout--wide-size)), var(--wp--custom--gap--horizontal));
-}
-
-.wp-block-quote.is-style-side-quote {
-  /* Needs .wp-block-quote class to override editor styles */
-  border: 0;
-  box-shadow: inset 0px 3px 0px 0px var(--wp--custom--color--primary);
-  margin: calc(var(--wp--custom--gap--vertical) * 1.5) 0;
-  padding: calc(var(--wp--custom--gap--baseline) * 1.35) 0 0 0;
-}
-.wp-block-quote.is-style-side-quote cite {
-  font-size: var(--wp--custom--font-size--normal);
-  font-style: normal;
-  font-weight: 600;
-}
-.wp-block-quote.is-style-side-quote p, .wp-block-quote.is-style-side-quote div.block-editor-rich-text__editable {
-  font-size: var(--wp--preset--font-size--medium);
-  line-height: 1.4em;
-  margin-bottom: calc(var(--wp--custom--gap--baseline) * 0.68);
-}
-
-.wp-block-quote.is-style-testimonial-quote {
-  /* Needs .wp-block-quote class to override editor styles */
-  border: 0;
-  display: flex;
-  flex-direction: row-reverse;
-  gap: calc(var(--wp--custom--gap--horizontal) * 1.6);
-  margin: calc(var(--wp--custom--gap--vertical) * 1.78) 0;
-  padding-left: 0;
-}
-@media (max-width: 599px) {
-  .wp-block-quote.is-style-testimonial-quote {
-    flex-direction: column;
-    gap: calc(var(--wp--custom--gap--vertical) * 0.75);
-  }
-}
-.wp-block-quote.is-style-testimonial-quote cite {
-  box-shadow: inset 0px 3px 0px 0px var(--wp--custom--color--primary);
-  display: inline-block;
-  flex: 1 0 0;
-  font-size: var(--wp--custom--font-size--normal);
-  font-style: normal;
-  font-weight: 500;
-  margin-top: 1.5ex;
-  padding-top: calc(var(--wp--custom--gap--baseline) * 1.35);
-  text-align: right;
-}
-@media (max-width: 599px) {
-  .wp-block-quote.is-style-testimonial-quote cite {
-    text-align: left;
-  }
-}
-.wp-block-quote.is-style-testimonial-quote p, .wp-block-quote.is-style-testimonial-quote div.block-editor-rich-text__editable {
-  flex: 0 0 75%;
-  font-size: calc(var(--wp--preset--font-size--x-large) * 1.34);
-  font-weight: bold;
-  line-height: 115%;
-  margin-bottom: 0;
-}
-
-.pre-footer h3 {
-  text-transform: uppercase;
-}
-.pre-footer .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
-  --wp--custom--button--typography--font-size: 14px;
-  --wp--custom--button--spacing--padding--top: 0.5em;
-  --wp--custom--button--spacing--padding--bottom: 0.5em;
-}
-
-.paragraph-with-quote h4 {
-  margin: 0 0 calc(var(--wp--custom--gap--vertical) * 0.89) 0;
-}
-.paragraph-with-quote div:nth-child(2) p {
-  margin: calc(var(--wp--custom--gap--baseline) * 1.55) 0 0 0;
-}
-
-h1.is-style-skatepark-heading-border, h2.is-style-skatepark-heading-border, h3.is-style-skatepark-heading-border, h4.is-style-skatepark-heading-border, h5.is-style-skatepark-heading-border, h6.is-style-skatepark-heading-border {
-  display: inline-block;
-  border-top: 2px solid var(--wp--custom--color--primary);
-  margin-bottom: 0;
-  padding-top: 1em;
-}
-
+/* Links and underlines */
 a {
   text-decoration-thickness: 0.07em;
   text-underline-offset: 0.46ex;
@@ -408,51 +123,6 @@ a:not(.ab-item):not(.screen-reader-shortcut):focus {
   text-decoration: none;
 }
 
-.post-meta.wp-block-group {
-  flex-direction: column;
-  align-items: start;
-}
-.post-meta .is-style-post-date-icon,
-.post-meta .is-style-post-category-icon,
-.post-meta .is-style-post-tag-icon {
-  margin-bottom: 0.5em;
-  overflow-wrap: normal;
-  padding-left: calc(18px + var(--wp--custom--gap--baseline));
-  position: relative;
-  word-break: normal;
-}
-
-.is-style-post-date-icon:before,
-.is-style-post-category-icon:before,
-.is-style-post-tag-icon:before {
-  height: 18px;
-  width: 18px;
-  position: absolute;
-  left: 0;
-  top: 3px;
-}
-
-.is-style-post-date-icon:before {
-  -webkit-mask-image: url(svg/post-date.svg);
-  mask-image: url(svg/post-date.svg);
-}
-
-.is-style-post-category-icon:before {
-  -webkit-mask-image: url(svg/post-category.svg);
-  mask-image: url(svg/post-category.svg);
-}
-
-.is-style-post-tag-icon:before {
-  -webkit-mask-image: url(svg/post-tag.svg);
-  mask-image: url(svg/post-tag.svg);
-}
-
-.archive .wp-block-post-excerpt__excerpt,
-.blog .wp-block-post-excerpt__excerpt,
-.home .wp-block-post-excerpt__excerpt {
-  margin-top: calc(0.5 * var(--wp--custom--gap--vertical));
-  margin-bottom: calc(0.5 * var(--wp--custom--gap--vertical));
-}
 .archive .wp-block-post-date,
 .blog .wp-block-post-date,
 .home .wp-block-post-date {
@@ -460,20 +130,14 @@ a:not(.ab-item):not(.screen-reader-shortcut):focus {
   text-decoration-thickness: 0.07em;
   text-underline-offset: 0.46ex;
 }
-.archive .wp-block-query .wp-block-post-title,
-.blog .wp-block-query .wp-block-post-title,
-.home .wp-block-query .wp-block-post-title {
-  margin-bottom: calc(0.5 * var(--wp--custom--gap--vertical));
+
+.wp-block-query-pagination .wp-block-query-pagination-numbers .current {
+  text-decoration-thickness: 0.07em;
+  text-underline-offset: 0.46ex;
 }
 
 .wp-block-post-excerpt__more-link {
   font-weight: 500;
 }
-.wp-block-post-excerpt__more-link:after {
-  content: "→";
-  display: inline-block;
-  padding-left: 0.7ch;
-  text-decoration: none;
-}
 
 /*# sourceMappingURL=theme.css.map */

skatepark/block-templates/page.html

@@ -1,7 +1,7 @@
 <!-- wp:template-part {"slug":"header","tagName":"header"} /-->
 
 <!-- wp:group {"layout":{"inherit":true},"style":{"spacing":{"padding":{"top":"4em"}}}} -->
-<div class="wp-block-group" style="padding-top:4em"><!-- wp:post-title {"level":1,"align":"wide"} /--></div>
+<div class="wp-block-group" style="padding-top:4em"><!-- wp:post-title {"level":1,"align":"wide","style":{"spacing":{"margin":{"bottom":"calc(var(--wp--custom--gap--vertical) * 3)"}}}} /--></div>
 <!-- /wp:group -->
 
 <!-- wp:group {"tagName":"main","style":{"spacing":{"padding":{"bottom":"5em"}}}} -->

skatepark/block-templates/single.html

@@ -21,7 +21,9 @@
 	<div class="wp-block-column" style="flex-basis:58%"><!-- wp:separator {"className":"is-style-wide"} -->
 	<hr class="wp-block-separator is-style-wide"/>
 	<!-- /wp:separator -->
-	<!-- wp:post-author {"showBio":true} /-->
+	<!-- wp:post-author {"showAvatar":false,"showBio":true,"style":{"typography":{"fontStyle":"normal","fontWeight":"600"}},"fontSize":"small"} /-->
+
+
 	</div>
 	<!-- /wp:column -->
 
@@ -29,11 +31,11 @@
 	<div class="wp-block-column"><!-- wp:separator {"className":"is-style-wide"} -->
 	<hr class="wp-block-separator is-style-wide"/>
 	<!-- /wp:separator -->
-	<!-- wp:group {"className":"post-meta","layout":{"type":"flex"}} -->
+	<!-- wp:group {"className":"post-meta"} -->
 	<div class="wp-block-group post-meta">
-    <!-- wp:post-date {"isLink":true,"style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}},"className":"is-style-post-date-icon"} /-->
-	<!-- wp:post-terms {"term":"category","style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}},"className":"is-style-post-category-icon"} /-->
-    <!-- wp:post-terms {"term": "post_tag","style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}},"className":"is-style-post-tag-icon"} /--></div>
+    <!-- wp:post-date {"isLink":true,"style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}}} /-->
+	<!-- wp:post-terms {"term":"category","style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}}} /-->
+    <!-- wp:post-terms {"term": "post_tag","style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}}} /--></div>
 	<!-- /wp:group -->
 
 	</div>

skatepark/inc/patterns/blog-posts.php

@@ -17,10 +17,10 @@ return array(
 
 	<!-- wp:post-featured-image {"isLink":true} /-->
 
-	<!-- wp:post-title {"isLink":true,"style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--normal)"}}} /-->
-
-	<!-- wp:post-excerpt {"moreText":"' . esc_html__( 'Continue reading', 'skatepark' ) . '"} /-->
+	<!-- wp:post-title {"isLink":true,"style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--normal)"},"spacing":{"margin":{"bottom":"calc( 0.5 * var(--wp--custom--gap--vertical) )"}}}} /-->
 
+	<!-- wp:post-excerpt {"moreText":"' . esc_html__( 'Continue reading', 'skatepark' ) . '","style":{"spacing":{"margin":{"top":"calc( 0.5 * var(--wp--custom--gap--vertical) )","bottom":"calc( 0.5 * var(--wp--custom--gap--vertical) )"}}}} /-->
+	
 	<!-- wp:post-date {"style":{"typography":{"fontSize":"16px","fontWeight":"500"}},"isLink":true} /--></div>
 	<!-- /wp:group -->
 	<!-- /wp:post-template -->
@@ -28,8 +28,6 @@ return array(
 	<!-- wp:query-pagination -->
 	<!-- wp:query-pagination-previous /-->
 
-	<!-- wp:query-pagination-numbers /-->
-
 	<!-- wp:query-pagination-next /-->
 	<!-- /wp:query-pagination --></div>
 	<!-- /wp:query -->',

skatepark/inc/patterns/full-width-image-with-aside-caption.php

@@ -9,6 +9,21 @@ return array(
 	'title'      => __( 'Full width image with aside caption', 'skatepark' ),
 	'categories' => array( 'skatepark' ),
 	'content'    => '<!-- wp:image {"align":"full","className":"alignfull size-large is-style-skatepark-aside-caption"} -->
-	<figure class="wp-block-image alignfull size-large is-style-skatepark-aside-caption"><img src="' . get_stylesheet_directory_uri() . '/assets/images/skatepark.jpg" alt="' . esc_attr__( "A skateboarder does a grab trick in a bowl-shaped skate park. In the background is a watching crowd, palm trees, and the ocean.", 'skatepark' ) . '"/><figcaption>' . esc_html__( "Learn the basics of skating along with a group of your peers. More advanced at skating? Our skateboarding coaches will work with you 1:1 to advance your technique.", 'skatepark' ) . '</figcaption></figure>
-	<!-- /wp:image -->',
+	<figure class="wp-block-image alignfull size-large is-style-skatepark-aside-caption"><img src="' . get_stylesheet_directory_uri() . '/assets/images/skatepark.jpg" alt="' . esc_attr__( "A skateboarder does a grab trick in a bowl-shaped skate park. In the background is a watching crowd, palm trees, and the ocean.", 'skatepark' ) . '"/></figure>
+	<!-- /wp:image -->
+	<!-- wp:columns {"align":"wide"} -->
+	<div class="wp-block-columns alignwide"><!-- wp:column -->
+	<div class="wp-block-column"></div>
+	<!-- /wp:column -->
+
+	<!-- wp:column {"width":"40%"} -->
+	<div class="wp-block-column" style="flex-basis:40%"><!-- wp:separator {"className":"is-style-wide"} -->
+	<hr class="wp-block-separator is-style-wide"/>
+	<!-- /wp:separator -->
+
+	<!-- wp:paragraph {"fontSize":"small"} -->
+	<p class="has-small-font-size">' . esc_html__( "Learn the basics of skating along with a group of your peers. More advanced at skating? Our skateboarding coaches will work with you 1:1 to advance your technique.", 'skatepark' ) . '</p>
+	<!-- /wp:paragraph --></div>
+	<!-- /wp:column --></div>
+	<!-- /wp:columns -->',
 );

skatepark/inc/patterns/paragraph-with-quote.php

@@ -9,12 +9,12 @@ return array(
 	'title'      => __( 'Paragraph with quote', 'skatepark' ),
 	'categories' => array( 'skatepark' ),
 	'content'    => '<!-- wp:columns {"align":"wide","className":"paragraph-with-quote"} -->
-	<div class="wp-block-columns alignwide paragraph-with-quote"><!-- wp:column {"width":"25%"} -->
-	<div class="wp-block-column" style="flex-basis:25%"></div>
+	<div class="wp-block-columns alignwide paragraph-with-quote"><!-- wp:column {"width":"22%"} -->
+	<div class="wp-block-column" style="flex-basis:22%"></div>
 	<!-- /wp:column -->
 
-	<!-- wp:column {"width":"50%"} -->
-	<div class="wp-block-column" style="flex-basis:50%"><!-- wp:heading {"level":4} -->
+	<!-- wp:column {"width":"56%","style":{"spacing":{"padding":{"right":"10%"}}}} -->
+	<div class="wp-block-column" style="padding-right:10%;flex-basis:56%"><!-- wp:heading {"level":4} -->
 	<h4>' . esc_html__( 'Why come to Skatepark?', 'skatepark' ) . '</h4>
 	<!-- /wp:heading -->
 
@@ -27,10 +27,22 @@ return array(
 	<!-- /wp:paragraph --></div>
 	<!-- /wp:column -->
 
-	<!-- wp:column {"width":"25%"} -->
-	<div class="wp-block-column" style="flex-basis:25%"><!-- wp:quote {"className":"is-style-side-quote"} -->
-	<blockquote class="wp-block-quote is-style-side-quote"><p>' . esc_html__( 'I learned how to do a kick flip and made a bunch of new friends. Can’t wait to go back!', 'skatepark' ) . '</p><cite>' . esc_html__( '– Jane Doe, 11', 'skatepark' ) . '</cite></blockquote>
-	<!-- /wp:quote --></div>
+	<!-- wp:column {"width":"22%","style":{"spacing":{"padding":{"top":"4.1em"}}}} -->
+	<div class="wp-block-column" style="padding-top:4.1em;flex-basis:22%">
+
+	<!-- wp:separator {"className":"is-style-wide"} -->
+	<hr class="wp-block-separator is-style-wide"/>
+	<!-- /wp:separator -->
+	
+	<!-- wp:paragraph {"style":{"typography":{"lineHeight":1.4}},"fontSize":"medium"} -->
+	<p class="has-medium-font-size" style="line-height:1.4">' . esc_html__( 'I learned how to do a kick flip and made a bunch of new friends. Can’t wait to go back!', 'skatepark' ) . '</p>
+	<!-- /wp:paragraph -->
+
+	<!-- wp:paragraph {"style":{"typography":{"fontStyle":"normal","fontWeight":"600"}}} -->
+	<p style="font-style:normal;font-weight:600">' . esc_html__( '– Jane Doe, 11', 'skatepark' ) . '</p>
+	<!-- /wp:paragraph -->
+
+	</div>
 	<!-- /wp:column --></div>
 	<!-- /wp:columns -->',
 );

skatepark/inc/patterns/testimonial.php

@@ -8,11 +8,25 @@
 return array(
 	'title'      => __( 'Testimonial', 'skatepark' ),
 	'categories' => array( 'skatepark' ),
-	'content'    => '<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"80px","bottom":"80px"}}}} -->
-    <div class="wp-block-group alignwide" style="padding-top:80px;padding-bottom:80px"><!-- wp:quote {"className":"is-style-testimonial-quote"} -->
-    <blockquote class="wp-block-quote is-style-testimonial-quote">
-    <p>' . esc_html__( 'I learned how to do a kick flip and made a bunch of new friends. Can’t wait to go back!', 'skatepark' ) . '</p>
-    <cite>' . esc_html__( 'Jane Doe', 'skatepark' ) . '</cite></blockquote>
-    <!-- /wp:quote --></div>
-    <!-- /wp:group -->',
+	'content'    => '<!-- wp:columns {"align":"wide"} -->
+    <div class="wp-block-columns alignwide"><!-- wp:column {"width":"25%","style":{"spacing":{"padding":{"top":"3em","right":"2em"}}}} -->
+
+    <div class="wp-block-column" style="padding-top:3em;padding-right:2em;flex-basis:25%"><!-- wp:separator {"className":"is-style-wide"} -->
+    <hr class="wp-block-separator is-style-wide"/>
+    <!-- /wp:separator -->
+
+    <!-- wp:paragraph {"align":"right","style":{"typography":{"fontStyle":"normal","fontWeight":"500"}}} -->
+    <p class="has-text-align-right" style="font-style:normal;font-weight:500">' . esc_html__( 'Jane Doe', 'skatepark' ) . '</p>
+    <!-- /wp:paragraph --></div>
+    <!-- /wp:column -->
+
+    <!-- wp:column -->
+    <div class="wp-block-column"><!-- wp:paragraph {"style":{"typography":{"fontStyle":"normal","fontWeight":"600","lineHeight":"1.15"}},"fontSize":"calc( var(--wp--preset--font-size--x-large) * 1.34)"} -->
+    <p style="font-size:calc( var(--wp--preset--font-size--x-large) * 1.34);font-style:normal;font-weight:600;line-height:1.15">' . esc_html__( 'I learned how to do a kick flip and made a bunch of new friends. Can’t wait to go back!', 'skatepark' ) . '</p>
+    <!-- /wp:paragraph --></div>
+    <!-- /wp:column --></div>
+    <!-- /wp:columns -->
+    
+    
+    ',
 );

skatepark/inc/patterns/text-list-with-button.php

@@ -12,9 +12,18 @@ return array(
 	'categories' => array( 'skatepark' ),
 	'content'    => '<!-- wp:columns {"align":"wide"} -->
 		<div class="wp-block-columns alignwide"><!-- wp:column {"width":"75%"} -->
-		<div class="wp-block-column" style="flex-basis:75%"><!-- wp:heading {"level":4,"className":"is-style-skatepark-heading-border"} -->
-		<h4 class="is-style-skatepark-heading-border">' . esc_html__( 'Visiting Coaches', 'skatepark' ) . '</h4>
-		<!-- /wp:heading -->
+		<div class="wp-block-column" style="flex-basis:75%">
+		<!-- wp:group {"layout":{"type":"flex","allowOrientation":false}} -->
+		<div class="wp-block-group"><!-- wp:group -->
+		<div class="wp-block-group"><!-- wp:separator {"className":"is-style-wide"} -->
+		<hr class="wp-block-separator is-style-wide"/>
+		<!-- /wp:separator -->
+		
+		<!-- wp:heading {"level":4,"style":{"spacing":{"margin":{"top":"1em"}}}} -->
+		<h4 id="visiting-coaches" style="margin-top:1em">' . esc_html__( 'Visiting Coaches', 'skatepark' ) . '</h4>
+		<!-- /wp:heading --></div>
+		<!-- /wp:group --></div>
+		<!-- /wp:group -->
 		<!-- wp:heading --><h2>' . esc_html__( 'Steph Harper. Buddy Sellers. Mehmet Farrow. Bob Lopez. Tammy Habich. Tye Barclay. Kaden Price. Lily Rivera. Chris Wright. Sammy Sanchez.', 'skatepark' ) . '</h2>
 		<!-- /wp:heading -->
 		<!-- wp:buttons -->

skatepark/sass/base/_mixins.scss

@@ -1,4 +0,0 @@
-@mixin text-decoration() {
-	text-decoration-thickness: 0.07em;
-	text-underline-offset: 0.46ex;
-}

skatepark/sass/base/_text.scss

@@ -1,5 +0,0 @@
-// Text selection text color
-::selection {
-	color: var(--wp--custom--color--background);
-	background-color: var(--wp--custom--color--foreground);
-}

skatepark/sass/block-patterns/_paragraph-with-quote.scss

@@ -1,11 +0,0 @@
-.paragraph-with-quote {
-    h4 {
-        margin: 0 0 calc( var(--wp--custom--gap--vertical) * 0.89 ) 0;
-    }
-
-    div:nth-child(2) {    
-        p {
-            margin: calc( var(--wp--custom--gap--baseline) * 1.55 ) 0 0 0;
-        }
-    }
-}

skatepark/sass/block-patterns/_pre-footer.scss

@@ -1,10 +0,0 @@
-.pre-footer {
-	h3 {
-		text-transform: uppercase;
-	}
-	.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
-		--wp--custom--button--typography--font-size: 14px;
-		--wp--custom--button--spacing--padding--top: 0.5em;
-		--wp--custom--button--spacing--padding--bottom: 0.5em;
-	}
-}

skatepark/sass/block-styles/_image-caption.scss

@@ -1,25 +0,0 @@
-.is-style-skatepark-aside-caption {
-	align-items: center;
-	display: flex;
-	flex-direction: column;
-
-	img {
-		justify-self: center;
-	}
-
-	figcaption {
-		align-self: flex-end;
-		border-top: 3px solid var(--wp--preset--color--primary);
-		font-size: var(--wp--preset--font-size--small);
-		margin-bottom: 0;
-		margin-top: 20px;
-		padding-top: 20px;
-		max-width: 455px;
-		text-align: left;
-	}
-
-	&.alignfull figcaption {
-		margin-left: var(--wp--custom--gap--horizontal);
-		margin-right: calc( max( 0.5 * ( 100% - var(--wp--custom--layout--wide-size) ), var(--wp--custom--gap--horizontal) ) );
-	}
-}

skatepark/sass/block-styles/_side-quote.scss

@@ -1,18 +0,0 @@
-.wp-block-quote.is-style-side-quote { /* Needs .wp-block-quote class to override editor styles */
-	border: 0;
-	box-shadow: inset 0px 3px 0px 0px var(--wp--custom--color--primary);
-	margin: calc( var(--wp--custom--gap--vertical) * 1.5) 0;
-	padding: calc( var(--wp--custom--gap--baseline) * 1.35) 0 0 0;
-
-	cite {
-		font-size: var(--wp--custom--font-size--normal);
-		font-style: normal;
-		font-weight: 600;
-	}
-
-	p, div.block-editor-rich-text__editable {
-		font-size: var(--wp--preset--font-size--medium);
-		line-height: 1.4em;
-		margin-bottom: calc( var(--wp--custom--gap--baseline) * 0.68);
-	}
-}

skatepark/sass/block-styles/_testimonial-quote.scss

@@ -1,37 +0,0 @@
-.wp-block-quote.is-style-testimonial-quote { /* Needs .wp-block-quote class to override editor styles */
-	border: 0;
-	display: flex;
-	flex-direction: row-reverse;
-	gap: calc( var(--wp--custom--gap--horizontal) * 1.6);
-	margin: calc( var(--wp--custom--gap--vertical) * 1.78) 0;
-	padding-left: 0;
-
-	@include break-small-only() {
-		flex-direction: column;
-		gap: calc( var(--wp--custom--gap--vertical) * 0.75);
-	}
-
-	cite {
-		box-shadow: inset 0px 3px 0px 0px var(--wp--custom--color--primary);
-		display: inline-block;
-		flex: 1 0 0;
-		font-size: var(--wp--custom--font-size--normal);
-		font-style: normal;
-		font-weight: 500;
-		margin-top: 1.5ex;
-		padding-top: calc( var(--wp--custom--gap--baseline) * 1.35);
-		text-align: right;
-
-		@include break-small-only() {
-			text-align: left;
-		}
-	}
-
-	p, div.block-editor-rich-text__editable {
-		flex: 0 0 75%;
-		font-size: calc( var(--wp--preset--font-size--x-large) * 1.34);
-		font-weight: bold;
-		line-height: 115%;
-		margin-bottom: 0;
-	}
-}

skatepark/sass/blocks/_author.scss

@@ -1,22 +0,0 @@
-.wp-block-post-author__content {
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-}
-
-.wp-block-post-author__name {
-	font-weight: 700;
-	line-height: 1;
-	margin-bottom: 0.5em;
-}
-
-.wp-block-post-author__bio {
-	margin: 0;
-	font-size: var(--wp--preset--font-size--small);
-}
-
-.wp-block-post-author__avatar {
-	img {
-		border-radius: 50%;
-	}
-}

skatepark/sass/blocks/_buttons.scss

@@ -1,12 +0,0 @@
-.wp-block-file .wp-block-file__button {
-	text-transform: uppercase;
-	letter-spacing: 0.1em;
-}	
-
-.wp-block-search {
-	&.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button,
-	.wp-block-search__button.wp-block-search__button {
-		text-transform: uppercase;
-		letter-spacing: 0.1em;
-	}
-}

skatepark/sass/blocks/_cover.scss

@@ -1,6 +0,0 @@
-.wp-block-cover {
-	&.alignfull {
-		padding-right: calc( max( 0.5 * ( 100% - var(--wp--custom--layout--wide-size) ) + var(--wp--custom--gap--horizontal), var(--wp--custom--gap--horizontal) ));
-		padding-left: calc( max( 0.5 * ( 100% - var(--wp--custom--layout--wide-size) ) + var(--wp--custom--gap--horizontal), var(--wp--custom--gap--horizontal) ));
-	}
-}

skatepark/sass/blocks/_navigation.scss

@@ -1,13 +0,0 @@
-//NOTE: Setting the font size as a block attributes forces ALL elements to have that font size
-//preventing mobile menu items (and sub-menu items) from having a different size value
-.wp-block-navigation {
-	font-size: var(--wp--preset--font-size--small);
-
-	.wp-block-navigation-item {
-		&.current-menu-item > a {
-			text-decoration-line: underline;
-			text-decoration-thickness: 0.2em;
-			text-underline-offset: 0.35em;
-		}
-	}
-}

skatepark/sass/blocks/_post-comments.scss

@@ -1,49 +0,0 @@
-.wp-block-post-comments {
-
-	.reply {
-		a {
-			@include text-decoration;
-		}
-	}
-
-	form {
-		column-gap: 1.2em;
-	}
-
-	.comment-reply-title {
-		margin-bottom: calc( 2 * var(--wp--custom--gap--baseline));
-	}
-
-	.comment-author {
-		cite {
-			font-weight: bold;
-		}
-
-		.says {
-			display: none;
-		}
-	}
-
-	.commentmetadata {
-		--wp--style--block-gap: 48px;
-
-		a {
-			font-weight: 500;
-		}
-	}
-
-	.commentlist {
-		--wp--style--block-gap: 60px;
-	}
-
-	// Target certain links within post comments to use the underline treatment.
-	.comment-body > p > a,
-	.comment-edit-link {
-		@include text-decoration;
-		text-decoration: underline;
-
-		&:hover {
-			text-decoration: none;
-		}
-	}
-}

skatepark/sass/blocks/_post-featured-image.scss

@@ -1,3 +0,0 @@
-.wp-block-post-featured-image {
-	margin-bottom: 0;
-}

skatepark/sass/blocks/_post-title.scss

@@ -1,9 +0,0 @@
-h1.wp-block-post-title {
-	//can be removed after https://github.com/WordPress/gutenberg/pull/35684 lands
-	margin-bottom: calc(var(--wp--custom--gap--vertical) * 3);
-	body:not(.has-featured-image) &{
-		border-bottom: var(--wp--custom--form--border--width)
-			var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
-		padding-bottom: calc(var(--wp--custom--gap--vertical) * 3);
-	}
-}

skatepark/sass/blocks/_query.scss

@@ -1,10 +0,0 @@
-.wp-block-query-pagination{
-	.wp-block-query-pagination-numbers {
-		.current {
-			@include text-decoration;
-		}
-		.page-numbers {
-			padding: 10px;
-		}
-	}
-}

skatepark/sass/blocks/_search.scss

@@ -1,52 +0,0 @@
-.wp-block-search {
-	.wp-block-search__button {
-		&:active,
-		&:focus {
-			outline-offset: -0.25em;
-		}
-		svg {
-			min-width: 2em;
-			min-height: 2em;
-		}
-		&.has-icon {
-			--wp--custom--button--spacing--padding--left: calc( 1.75 * var(--wp--custom--button--spacing--padding--top) );
-			--wp--custom--button--spacing--padding--right: calc( 1.75 * var(--wp--custom--button--spacing--padding--top) );
-		}
-	}
-	&.wp-block-search__button-inside {
-		.wp-block-search__inside-wrapper{
-			padding: 0;
-			.wp-block-search__button {
-				--wp--custom--button--color--text: var(--wp--custom--color--primary);
-				--wp--custom--button--color--background: var(--wp--custom--color--background);
-				position: relative;
-				&::before {
-					content: "";
-					height: 80%;
-					width: 1px;
-					background: var(--wp--custom--color--primary);
-					position: absolute;
-					left: 0;
-					top: 10%;
-				}
-				&:not(.has-background):not(.has-text-color) {
-					&:hover {
-						--wp--custom--button--color--text: var(--wp--custom--color--background);
-						--wp--custom--button--color--background: var(--wp--custom--color--primary);
-						&:focus,
-						&.has-focus {
-							outline-color: var(--wp--custom--color--background);
-						}
-					}
-					&:focus,
-					&.has-focus {
-						border-color: transparent;
-						&::before {
-							left: calc( -1 * var(--wp--custom--button--border--width) );
-						}
-					}
-				}
-			}
-		}
-	}
-}

skatepark/sass/blocks/_separator.scss

@@ -1,6 +0,0 @@
-
-.wp-block-separator {
-	&.is-style-wide {
-		border-width: 0 0 3px 0;
-	}
-}

skatepark/sass/elements/_headings.scss

@@ -1,8 +0,0 @@
-h1, h2, h3, h4, h5, h6 {
-	&.is-style-skatepark-heading-border{
-		display: inline-block;
-		border-top: 2px solid var(--wp--custom--color--primary);
-		margin-bottom: 0;
-		padding-top: 1em;
-	}
-}

skatepark/sass/elements/_links.scss

@@ -1,53 +0,0 @@
-a {
-	@include text-decoration;
-}
-
-.wp-block-post-content p a:not(.wp-block-post-excerpt__more-link) {
-	text-decoration-line: underline;
-	&:hover {
-		text-decoration: none;
-		background-color: var(--wp--custom--color--primary);
-		color: var(--wp--custom--color--background);
-	}
-}
-
-.wp-block-post-comments .comment-meta > a,
-.wp-block-post-comments .comment-body > p > a,
-.wp-block-post-comments .comment-edit-link,
-.post-meta a {
-	text-decoration-line: underline;
-	&:hover {
-		text-decoration-line: none;
-	}
-}
-
-//Exceptions for the general underline rule
-h1 a,
-h2 a,
-h3 a,
-h4 a,
-h5 a,
-h6 a,
-.wp-block-site-title a,
-.wp-block-post-title a{
-	text-underline-offset: 0.1ex;
-}
-.wp-block-site-title a,
-.wp-block-post-title a,
-.wp-block-query-pagination a {
-	text-decoration-line: none;
-	&:hover {
-		text-decoration-line: underline;
-	}
-}
-
-// Select the focus states of all non-wpadmin and screen reader links
-.wp-block-search__button,
-a:not(.ab-item):not(.screen-reader-shortcut) {
-	&:active,
-	&:focus {
-		outline: 1px dotted var(--wp--custom--color--primary);
-		outline-offset: 0.1em;
-		text-decoration: none;
-	}
-}

skatepark/sass/elements/_post-meta.scss

@@ -1,43 +0,0 @@
-.post-meta {
-	&.wp-block-group {
-		flex-direction: column;
-		align-items: start;
-	}
-
-	.is-style-post-date-icon,
-	.is-style-post-category-icon,
-	.is-style-post-tag-icon {
-		margin-bottom: 0.5em;
-		overflow-wrap: normal;
-		padding-left: calc( 18px + var(--wp--custom--gap--baseline));
-		position: relative;
-		word-break: normal;
-	}
-}
-
-.is-style-post-date-icon,
-.is-style-post-category-icon,
-.is-style-post-tag-icon {
-	&:before {
-		height: 18px;
-		width: 18px;
-		position: absolute;
-		left: 0;
-		top: 3px;
-	}
-}
-
-.is-style-post-date-icon:before {
-	-webkit-mask-image: url(svg/post-date.svg);
-	mask-image: url(svg/post-date.svg);
-}
-
-.is-style-post-category-icon:before {
-	-webkit-mask-image: url(svg/post-category.svg);
-	mask-image: url(svg/post-category.svg);
-}
-
-.is-style-post-tag-icon:before {
-	-webkit-mask-image: url(svg/post-tag.svg);
-	mask-image: url(svg/post-tag.svg);
-}

skatepark/sass/templates/_index.scss

@@ -1,25 +0,0 @@
-.archive,
-.blog,
-.home {
-	.wp-block-post-excerpt__excerpt {
-		margin-top: calc( 0.5 * var(--wp--custom--gap--vertical) );
-		margin-bottom: calc( 0.5 * var(--wp--custom--gap--vertical) );
-	}
-	.wp-block-post-date {
-		text-decoration: underline;
-		@include text-decoration;
-	}
-	.wp-block-query .wp-block-post-title{
-		margin-bottom: calc( 0.5 * var(--wp--custom--gap--vertical) );
-	}
-}
-
-.wp-block-post-excerpt__more-link {
-	font-weight: 500;
-	&:after {
-		content: "→";
-		display: inline-block;
-		padding-left: 0.7ch;
-		text-decoration: none;
-	}
-}

skatepark/sass/theme.scss

@@ -1,25 +1,105 @@
-@import "../../blockbase/sass/base/breakpoints"; // Get the mobile-only media query and make it available to this theme's styles
-@import "../../blockbase/sass/base/mixins";
-@import "base/text";
-@import "base/mixins";
-@import "blocks/author";
 @import "../../blockbase/sass/blocks/_buttons-outline-style";
-@import "blocks/buttons";
-@import "blocks/cover";
-@import "blocks/navigation";
-@import "blocks/post-comments";
-@import "blocks/post-featured-image";
-@import "blocks/post-title";
-@import "blocks/query";
-@import "blocks/search";
-@import "blocks/separator";
-@import "block-patterns/pre-footer";
-@import "block-styles/image-caption";
-@import "block-styles/side-quote";
-@import "block-styles/testimonial-quote";
-@import "block-patterns/pre-footer";
-@import "block-patterns/paragraph-with-quote";
-@import "elements/headings";
-@import "elements/links";
-@import "elements/post-meta";
-@import "templates/index";
+
+/* Text selection text color */
+::selection {
+	color: var(--wp--custom--color--background);
+	background-color: var(--wp--custom--color--foreground);
+}
+
+/* Post title when featured image is present */
+h1.wp-block-post-title {
+	body:not(.has-featured-image) &{
+		border-bottom: var(--wp--custom--form--border--width)
+			var(--wp--custom--form--border--style) var(--wp--preset--color--primary);
+		padding-bottom: calc(var(--wp--custom--gap--vertical) * 3);
+	}
+}
+
+/* Separator width */
+/* We can remove after https://github.com/WordPress/gutenberg/pull/38635 gets deployed */
+.wp-block-separator {
+	&.is-style-wide {
+		border-width: 0 0 3px 0;
+	}
+}
+
+/* Links and underlines */
+@mixin text-decoration() {
+	text-decoration-thickness: 0.07em;
+	text-underline-offset: 0.46ex;
+}
+
+a {
+	@include text-decoration;
+}
+
+.wp-block-post-content p a:not(.wp-block-post-excerpt__more-link) {
+	text-decoration-line: underline;
+	&:hover {
+		text-decoration: none;
+		background-color: var(--wp--custom--color--primary);
+		color: var(--wp--custom--color--background);
+	}
+}
+
+.wp-block-post-comments .comment-meta > a,
+.wp-block-post-comments .comment-body > p > a,
+.wp-block-post-comments .comment-edit-link,
+.post-meta a {
+	text-decoration-line: underline;
+	&:hover {
+		text-decoration-line: none;
+	}
+}
+
+//Exceptions for the general underline rule
+h1 a,
+h2 a,
+h3 a,
+h4 a,
+h5 a,
+h6 a,
+.wp-block-site-title a,
+.wp-block-post-title a{
+	text-underline-offset: 0.1ex;
+}
+.wp-block-site-title a,
+.wp-block-post-title a,
+.wp-block-query-pagination a {
+	text-decoration-line: none;
+	&:hover {
+		text-decoration-line: underline;
+	}
+}
+
+// Select the focus states of all non-wpadmin and screen reader links
+.wp-block-search__button,
+a:not(.ab-item):not(.screen-reader-shortcut) {
+	&:active,
+	&:focus {
+		outline: 1px dotted var(--wp--custom--color--primary);
+		outline-offset: 0.1em;
+		text-decoration: none;
+	}
+}
+
+.archive,
+.blog,
+.home {
+	.wp-block-post-date {
+		text-decoration: underline;
+		@include text-decoration;
+	}
+}
+
+.wp-block-query-pagination{
+	.wp-block-query-pagination-numbers {
+		.current {
+			@include text-decoration;
+		}
+	}
+}
+
+.wp-block-post-excerpt__more-link {
+	font-weight: 500;
+}

skatepark/theme.json

@@ -272,6 +272,12 @@
 					"padding": "15vh"
 				}
 			},
+			"core/file": {
+				"typography": {
+					"letterSpacing": "0.1em",
+					"textTransform": "uppercase"
+				}
+			},
 			"core/image": {
 				"filter": {
 					"duotone": "var(--wp--preset--duotone--default-filter)"
@@ -329,6 +335,12 @@
 					"fontSize": "var(--wp--preset--font-size--x-large)"
 				}
 			},
+			"core/search": {
+				"typography": {
+					"letterSpacing": "0.1em",
+					"textTransform": "uppercase"
+				}
+			},
 			"core/separator": {
 				"border": {
 					"width": "0 0 3px 0"