Skip to content

Commit

Permalink
Merge pull request #59 from wpengine/try/implement-blockgap
Browse files Browse the repository at this point in the history 
Implement `blockGap`.
  • Loading branch information
@ndiego
ndiego authored Mar 7, 2022
2 parents f242ea6 + 9156ece commit 29bf2d5
Show file tree
Hide file tree
Showing 66 changed files with 1,224 additions and 750 deletions.
2 changes: 1 addition & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ An experimental block theme for designers, developers, and creators.

Frost is a Full Site Editing theme for WordPress that extends the incredible power of the editor, enables builders to create amazing sites with little effort, and elevates the potential for freelancers and entrepreneurs. See the Frost theme in action at [frostwp.com](https://frostwp.com/).

Download the latest stable release: [frost-0.8.8.zip](https://github.com/wpengine/frost/releases/download/v0.8.8/frost-0.8.8.zip)
Download the latest stable release: [frost-0.8.9.zip](https://github.com/wpengine/frost/releases/download/v0.8.9/frost-0.8.9.zip)

## Requirements

Expand Down
4 changes: 2 additions & 2 deletions inc/patterns/footer/footer-default-black-background.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@
'categories' => array( 'frost-footer' ),
'blockTypes' => array( 'core/template-part/footer' ),
'viewportWidth' => 1280,
'content' => '<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40px","bottom":"40px"}},"elements":{"link":{"color":{"text":"var:preset|color|white"}}}},"backgroundColor":"black","textColor":"white","layout":{"inherit":true},"fontSize":"small"} -->
<div class="wp-block-group alignfull has-white-color has-black-background-color has-text-color has-background has-link-color has-small-font-size" style="padding-top:40px;padding-bottom:40px"><!-- wp:group {"align":"wide","layout":{"type":"flex","allowOrientation":false,"justifyContent":"space-between"}} -->
'content' => '<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40px","bottom":"40px"},"margin":{"top":"0px"}},"elements":{"link":{"color":{"text":"var:preset|color|white"}}}},"backgroundColor":"black","textColor":"white","layout":{"inherit":true},"fontSize":"small"} -->
<div class="wp-block-group alignfull has-white-color has-black-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":"wide","layout":{"type":"flex","allowOrientation":false,"justifyContent":"space-between"}} -->
<div class="wp-block-group alignwide"><!-- wp:paragraph -->
<p>© ' . gmdate( 'Y' ) . ' Your Company LLC · <a href="#">' . esc_html__( 'Contact Us', 'frost' ) . '</a></p>
<!-- /wp:paragraph -->
Expand Down
4 changes: 2 additions & 2 deletions inc/patterns/footer/footer-default.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@
'categories' => array( 'frost-footer' ),
'blockTypes' => array( 'core/template-part/footer' ),
'viewportWidth' => 1280,
'content' => '<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40px","bottom":"40px"}}},"layout":{"inherit":true},"fontSize":"small"} -->
<div class="wp-block-group alignfull has-small-font-size" style="padding-top:40px;padding-bottom:40px"><!-- wp:group {"align":"wide","layout":{"type":"flex","allowOrientation":false,"justifyContent":"space-between"}} -->
'content' => '<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40px","bottom":"40px"},"margin":{"top":"0px"}}},"layout":{"inherit":true},"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":"wide","layout":{"type":"flex","allowOrientation":false,"justifyContent":"space-between"}} -->
<div class="wp-block-group alignwide"><!-- wp:paragraph -->
<p>© ' . gmdate( 'Y' ) . ' Your Company LLC · <a href="#">' . esc_html__( 'Contact Us', 'frost' ) . '</a></p>
<!-- /wp:paragraph -->
Expand Down
26 changes: 13 additions & 13 deletions inc/patterns/footer/footer-mega-black-background.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,9 @@
'categories' => array( 'frost-footer' ),
'blockTypes' => array( 'core/template-part/footer' ),
'viewportWidth' => 1280,
'content' => '<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}},"typography":{"fontSize":"18px"}},"backgroundColor":"black","textColor":"white","layout":{"inherit":true}} -->
<div class="wp-block-group alignfull has-white-color has-black-background-color has-text-color has-background has-link-color" style="font-size:18px"><!-- wp:columns {"align":"wide","style":{"elements":{"link":{"color":[]}},"spacing":{"padding":{"top":"100px","bottom":"70px"}}}} -->
<div class="wp-block-columns alignwide has-link-color" style="padding-top:100px;padding-bottom:70px"><!-- wp:column {"width":"50%"} -->
'content' => '<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}},"typography":{"fontSize":"18px"},"spacing":{"margin":{"top":"0px"}}},"backgroundColor":"black","textColor":"white","layout":{"inherit":true}} -->
<div class="wp-block-group alignfull has-white-color has-black-background-color has-text-color has-background has-link-color" 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} -->
<h4 id="our-company">' . esc_html__( 'Our Company', 'frost' ) . '</h4>
<!-- /wp:heading -->
Expand All @@ -28,12 +28,10 @@
<!-- /wp:buttons --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"5%"} -->
<div class="wp-block-column" style="flex-basis:5%"></div>
<!-- /wp:column -->
<!-- wp:column {"width":"15%"} -->
<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
<!-- 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} -->
<h4 id="about-us">' . esc_html__( 'About Us', 'frost' ) . '</h4>
<!-- /wp:heading -->
Expand All @@ -47,8 +45,8 @@
<!-- /wp:list --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"15%"} -->
<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
<!-- wp:column {"width":"33%"} -->
<div class="wp-block-column" style="flex-basis:33%"><!-- wp:heading {"level":4} -->
<h4 id="services">' . esc_html__( 'Services', 'frost' ) . '</h4>
<!-- /wp:heading -->
Expand All @@ -62,8 +60,8 @@
<!-- /wp:list --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"15%"} -->
<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
<!-- wp:column {"width":"33%"} -->
<div class="wp-block-column" style="flex-basis:33%"><!-- wp:heading {"level":4} -->
<h4 id="connect">' . esc_html__( 'Connect', 'frost' ) . '</h4>
<!-- /wp:heading -->
Expand All @@ -72,5 +70,7 @@
<!-- /wp:list --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->',
);
26 changes: 13 additions & 13 deletions inc/patterns/footer/footer-mega.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,9 @@
'categories' => array( 'frost-footer' ),
'blockTypes' => array( 'core/template-part/footer' ),
'viewportWidth' => 1280,
'content' => '<!-- wp:group {"align":"full","style":{"typography":{"fontSize":"18px"}},"layout":{"inherit":true}} -->
<div class="wp-block-group alignfull" style="font-size:18px"><!-- wp:columns {"align":"wide","style":{"elements":{"link":{"color":[]}},"spacing":{"padding":{"top":"100px","bottom":"70px"}}}} -->
<div class="wp-block-columns alignwide has-link-color" style="padding-top:100px;padding-bottom:70px"><!-- wp:column {"width":"50%"} -->
'content' => '<!-- wp:group {"align":"full","style":{"typography":{"fontSize":"18px"},"spacing":{"margin":{"top":"0px"}}},"layout":{"inherit":true}} -->
<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} -->
<h4 id="our-company">' . esc_html__( 'Our Company', 'frost' ) . '</h4>
<!-- /wp:heading -->
Expand All @@ -28,12 +28,10 @@
<!-- /wp:buttons --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"5%"} -->
<div class="wp-block-column" style="flex-basis:5%"></div>
<!-- /wp:column -->
<!-- wp:column {"width":"15%"} -->
<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
<!-- 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} -->
<h4 id="about-us">' . esc_html__( 'About Us', 'frost' ) . '</h4>
<!-- /wp:heading -->
Expand All @@ -47,8 +45,8 @@
<!-- /wp:list --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"15%"} -->
<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
<!-- wp:column {"width":"33%"} -->
<div class="wp-block-column" style="flex-basis:33%"><!-- wp:heading {"level":4} -->
<h4 id="services">' . esc_html__( 'Services', 'frost' ) . '</h4>
<!-- /wp:heading -->
Expand All @@ -62,8 +60,8 @@
<!-- /wp:list --></div>
<!-- /wp:column -->
<!-- wp:column {"width":"15%"} -->
<div class="wp-block-column" style="flex-basis:15%"><!-- wp:heading {"level":4} -->
<!-- wp:column {"width":"33%"} -->
<div class="wp-block-column" style="flex-basis:33%"><!-- wp:heading {"level":4} -->
<h4 id="connect">' . esc_html__( 'Connect', 'frost' ) . '</h4>
<!-- /wp:heading -->
Expand All @@ -72,5 +70,7 @@
<!-- /wp:list --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->',
);
50 changes: 27 additions & 23 deletions inc/patterns/footer/footer-split-black-background.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,55 +9,59 @@
'title' => __( 'Footer with heading, links, text.', 'frost' ),
'categories' => array( 'frost-footer' ),
'blockTypes' => array( 'core/template-part/footer' ),
'content' => '<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}},"spacing":{"padding":{"top":"40vh","bottom":"40px"}}},"backgroundColor":"black","textColor":"white","layout":{"inherit":true},"fontSize":"small"} -->
<div class="wp-block-group alignfull has-white-color has-black-background-color has-text-color has-background has-link-color has-small-font-size" style="padding-top:40vh;padding-bottom:40px"><!-- wp:columns {"verticalAlignment":"center","align":"wide"} -->
'content' => '<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}},"spacing":{"padding":{"top":"40vh","bottom":"40px"},"margin":{"top":"0px"}}},"backgroundColor":"black","textColor":"white","layout":{"inherit":true},"fontSize":"small"} -->
<div class="wp-block-group alignfull has-white-color has-black-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:columns {"verticalAlignment":"center","align":"wide"} -->
<div class="wp-block-columns alignwide are-vertically-aligned-center"><!-- wp:column {"verticalAlignment":"center","width":"75%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:75%"><!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.25"}},"className":"is-style-no-margin","fontSize":"max-48"} -->
<p class="is-style-no-margin has-max-48-font-size" id="design-with-courage" style="line-height:1.25">Design with courage.</p>
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:75%"><!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.25"}},"fontSize":"max-48"} -->
<p class="has-max-48-font-size" id="design-with-courage" style="line-height:1.25">' . esc_html__( 'Design with courage.', 'frost' ) . '</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"center","width":"25%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:25%"><!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column {"className":"is-style-no-margin"} -->
<div class="wp-block-column is-style-no-margin"><!-- wp:paragraph {"className":"is-style-no-margin"} -->
<p class="is-style-no-margin"><a href="#">' . esc_html__( 'Start Here', 'frost' ) . '</a></p>
<div class="wp-block-columns"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:group {"style":{"spacing":{"blockGap":"0px"}}} -->
<div class="wp-block-group"><!-- wp:paragraph -->
<p><a href="#">' . esc_html__( 'Start Here', 'frost' ) . '</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"className":"is-style-no-margin"} -->
<p class="is-style-no-margin"><a href="#">' . esc_html__( 'Our Services', 'frost' ) . '</a></p>
<!-- wp:paragraph -->
<p><a href="#">' . esc_html__( 'Our Services', 'frost' ) . '</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"className":"is-style-no-margin"} -->
<p class="is-style-no-margin"><a href="#">' . esc_html__( 'Contact Us', 'frost' ) . '</a></p>
<!-- wp:paragraph -->
<p><a href="#">' . esc_html__( 'Contact Us', 'frost' ) . '</a></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<!-- wp:column {"className":"is-style-no-margin"} -->
<div class="wp-block-column is-style-no-margin"><!-- wp:paragraph {"className":"is-style-no-margin"} -->
<p class="is-style-no-margin" id="block-b19cad4c-373b-45bb-8ab0-63bbc555c61d"><a href="#">Twitter</a></p>
<!-- wp:column -->
<div class="wp-block-column"><!-- wp:group {"style":{"spacing":{"blockGap":"0px"}}} -->
<div class="wp-block-group"><!-- wp:paragraph -->
<p id="block-b19cad4c-373b-45bb-8ab0-63bbc555c61d"><a href="#">Twitter</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"className":"is-style-no-margin"} -->
<p class="is-style-no-margin" id="block-3a04d4bc-d50f-4d10-a3e8-627b268529d4"><a href="#">Instagram</a></p>
<!-- wp:paragraph -->
<p id="block-3a04d4bc-d50f-4d10-a3e8-627b268529d4"><a href="#">Instagram</a></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"className":"is-style-no-margin"} -->
<p class="is-style-no-margin" id="block-3667c312-d03c-496d-8ee5-ac375815f684"><a href="#">LinkedIn</a></p>
<!-- wp:paragraph -->
<p id="block-3667c312-d03c-496d-8ee5-ac375815f684"><a href="#">LinkedIn</a></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->
<!-- wp:columns {"verticalAlignment":"top","align":"wide"} -->
<div class="wp-block-columns alignwide are-vertically-aligned-top"><!-- wp:column {"verticalAlignment":"top","width":"75%","className":"is-style-no-margin"} -->
<div class="wp-block-column is-vertically-aligned-top is-style-no-margin" style="flex-basis:75%"></div>
<div class="wp-block-columns alignwide are-vertically-aligned-top"><!-- wp:column {"verticalAlignment":"top","width":"75%"} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:75%"></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top","width":"25%","className":"is-style-no-margin"} -->
<div class="wp-block-column is-vertically-aligned-top is-style-no-margin" style="flex-basis:25%"><!-- wp:paragraph {"className":"is-style-no-margin"} -->
<p class="is-style-no-margin">© ' . gmdate( 'Y' ) . ' Your Company Name LLC</p>
<!-- wp:column {"verticalAlignment":"top","width":"25%"} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:25%"><!-- wp:paragraph -->
<p>© ' . gmdate( 'Y' ) . ' Your Company Name LLC</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
Expand Down
Loading

0 comments on commit 29bf2d5

Please sign in to comment.