Single theme details: Update style of "more patterns" button, add spa…

…ce between detail sections Fixes #66
WordPress · May 20, 2024 · 7acf853 · 7acf853
1 parent e00c388
commit 7acf853
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 18 deletions .
diff --git a/source/wp-content/themes/wporg-themes-2024/patterns/single.php b/source/wp-content/themes/wporg-themes-2024/patterns/single.php
@@ -57,27 +57,35 @@
 
  <!--  wp:columns {"align":"wide","style":{"spacing":{"blockGap":{"left":"var:preset|spacing|40"},"margin":{"top":"var:preset|spacing|40"}}}} -->
  <div class="wp-block-columns alignwide" style="margin-top:var(--wp--preset--spacing--40)">
- <!--  wp:column {"width":"70%"} -->
+ <!--  wp:column {"width":"70%" ,"style":{"spacing":{"blockGap":"var:preset|spacing|30"}} } -->
  <div class="wp-block-column" style="flex-basis:70%">
  <!--  wp:post-content /-->
 
- <!--  wp:heading {"fontSize":"heading-4"} -->
- <h2 class="wp-block-heading has-heading-4-font-size"> <? php  esc_html_e ( ' Features ' , ' wporg-themes ' ); ?> </h2>
- <!-- / wp:heading -->
+ <!--  wp:group -->
+ <div class="wp-block-group">
+ <!--  wp:heading {"fontSize":"heading-4"} -->
+ <h2 class="wp-block-heading has-heading-4-font-size"> <? php  esc_html_e ( ' Features ' , ' wporg-themes ' ); ?> </h2>
+ <!-- / wp:heading -->
 
- <!--  wp:post-terms {"term":"post_tag"} /-->
+ <!--  wp:post-terms {"term":"post_tag"} /-->
+ </div>
+ <!-- / wp:group -->
 
  <!--  wp:wporg/theme-patterns /-->
 
- <!--  wp:heading {"fontSize":"heading-4"} -->
- <h2 class="wp-block-heading has-heading-4-font-size"> <? php  esc_html_e ( ' Downloads per day ' , ' wporg-themes ' ); ?> </h2>
- <!-- / wp:heading -->
+ <!--  wp:group -->
+ <div class="wp-block-group">
+ <!--  wp:heading {"fontSize":"heading-4"} -->
+ <h2 class="wp-block-heading has-heading-4-font-size"> <? php  esc_html_e ( ' Downloads per day ' , ' wporg-themes ' ); ?> </h2>
+ <!-- / wp:heading -->
 
- <!--  wp:paragraph {"metadata":{"bindings":{"content":{"source":"wporg-themes/meta","args":{"key":"active-installs"}}}}} -->
- <p>Active Installations</p>
- <!-- / wp:paragraph -->
+			 <!--  wp:paragraph {"metadata":{"bindings":{"content":{"source":"wporg-themes/meta","args":{"key":"active-installs"}}}}} -->
+			 <p>Active Installations</p>
+			 <!-- / wp:paragraph -->
 
- <!--  wp:wporg/theme-downloads /-->
+ <!--  wp:wporg/theme-downloads /-->
+ </div>
+ <!-- / wp:group -->
 
  <!--  wp:wporg/theme-settings /-->
  </div>

diff --git a/source/wp-content/themes/wporg-themes-2024/src/theme-patterns/render.php b/source/wp-content/themes/wporg-themes-2024/src/theme-patterns/render.php
@@ -71,7 +71,7 @@ function get_pattern_preview_block( $pattern, $is_overflow = false ) {
  </div>
 
 	 <? php  if ( count ( $ patterns ) > $ initial_count ) : ?>
- <div class="wporg-theme-patterns__button wp-block-button is-style- text is-small">
+ <div class="wporg-theme-patterns__button wp-block-button is-style- outline is-small">
  <button
  class="wp-block-button__link wp-element-button"
  data-wp-on--click="actions.showAll"

diff --git a/source/wp-content/themes/wporg-themes-2024/src/theme-patterns/style.scss b/source/wp-content/themes/wporg-themes-2024/src/theme-patterns/style.scss
@@ -1,10 +1,20 @@
+ :where( .wp-block-wporg-theme-patterns ) {
+ > * {
+		 margin-block-start : var ( --wp--preset--spacing--20 );
+		 margin-block-end : zero ;
+ }
+
+ > :first-child {
+		 margin-block-start : zero ;
+ }
+
+ > :last-child {
+		 margin-block-end : zero ;
+ }
+ }
+
  .wporg-theme-patterns__grid {
 	 display : grid ;
 	 grid-template-columns : repeat ( three , one fr );
 	 gap : var ( --wp--preset--spacing--20 );
  }
-
- .wporg-theme-patterns__button {
-	 margin-block : var ( --wp--preset--spacing--20 );
-	 text-align : center ;
- }