Merge branch 'master' into try/seedlet/jetpack-global-styles

rivington/inc/wpcom-colors.php

@@ -264,8 +264,8 @@ add_color_rule( 'txt', '#f2f2f2', array(
 			.site-header .main-navigation > div > ul > li:hover li > a', 'color' ),
 
 	// Background-color
-	array( '.wp-block-cover.has-background-dim,
-			.wp-block-cover-image.has-background-dim,
+	array( '.wp-block-cover.has-background-dim:not([class*="background-color"]),
+			.wp-block-cover-image.has-background-dim:not([class*="background-color"]),
 			.has-foreground-background-color[class],
 			table.is-style-stripes tbody tr:nth-child(odd),
 			.wp-block-table.is-style-stripes tbody tr:nth-child(odd),

seedlet-blocks/block-templates/home.html

@@ -1,11 +0,0 @@
-<!-- wp:group {"align":"full","className":"site-header","tagName":"header"} -->
-<div class="wp-block-group alignfull site-header"><div class="wp-block-group__inner-container"><!-- wp:template-part {"slug":"header","theme":"seedlet-blocks","align":"full"} /--></div></div>
-<!-- /wp:group -->
-
-<!-- wp:group {"align":"full","className":"site-content","tagName":"main"} -->
-<div class="wp-block-group alignfull site-content"><div class="wp-block-group__inner-container"><!-- wp:post-content {"align":"full"} /--></div></div>
-<!-- /wp:group -->
-
-<!-- wp:group {"align":"full","className":"site-footer","tagName":"footer"} -->
-<div class="wp-block-group alignfull site-footer"><div class="wp-block-group__inner-container"><!-- wp:template-part {"slug":"footer","theme":"seedlet-blocks","align":"full"} /--></div></div>
-<!-- /wp:group -->

seedlet-blocks/block-templates/index.html

@@ -3,7 +3,11 @@
 <!-- /wp:group -->
 
 <!-- wp:group {"align":"full","className":"site-content","tagName":"main"} -->
-<div class="wp-block-group alignfull site-content"><div class="wp-block-group__inner-container"><!-- wp:post-title /--><!-- wp:latest-posts {"postsToShow":100,"displayPostContent":true,"displayPostDate":true,"align":"full"} /--></div></div>
+<div class="wp-block-group alignfull site-content"><div class="wp-block-group__inner-container"><!-- wp:query-loop -->
+<!-- wp:post-title /-->
+
+<!-- wp:post-content /-->
+<!-- /wp:query-loop --></div></div>
 <!-- /wp:group -->
 
 <!-- wp:group {"align":"full","className":"site-footer","tagName":"footer"} -->

seedlet-blocks/style-editor.css

@@ -15,4 +15,9 @@ body {
 	--global--color-primary: var(--wp--preset--color--primary);
 	--global--color-secondary: var(--wp--preset--color--secondary);
 	--global--color-tertiary: var(--wp--preset--color--tertiary);
-}
+}
+
+.site-content .wp-block[data-align="full"] > [data-block], .site-content .wp-block.alignfull > [data-block] {
+	margin-top: 0;
+	margin-bottom: 0;
+}

seedlet/assets/css/ie.css

@@ -155,6 +155,36 @@ hr.wp-block-separator.is-style-wide {
 	max-width: 602px;
 	}
 }
+.page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce) {
+	max-width: 100%;
+	margin-left: auto;
+	margin-right: auto;
+}
+@media only screen and (min-width: 482px) {
+	.page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce) {
+	max-width: 432px;
+	}
+}
+@media only screen and (min-width: 592px) {
+	.page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce) {
+	max-width: 432px;
+	}
+}
+@media only screen and (min-width: 652px) {
+	.page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce) {
+	max-width: 542px;
+	}
+}
+@media only screen and (min-width: 822px) {
+	.page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce) {
+	max-width: 602px;
+	}
+}
+@media only screen and (min-width: 1024px) {
+	.page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce) {
+	max-width: 602px;
+	}
+}
 .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce) {
 	max-width: 100%;
 	margin-left: auto;
@@ -1112,32 +1142,32 @@ hr.wp-block-separator.is-style-wide {
  * - Sets spacing-vertical margin logic
  */
 .site-footer > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 .site-main > article > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 .site-main > .not-found > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 .entry-content > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 [class*="inner-container"] > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 .widget-area > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 .widget-column > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 
 @media only screen and (min-width: 482px) {
@@ -1380,59 +1410,59 @@ input[type="submit"]:after,
 }
 
 button:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 .button:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 input[type="submit"]:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 .wp-block-button__link:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 .wp-block-file .wp-block-file__button:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 .a8c-posts-list__view-all:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 button[data-load-more-btn]:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 button:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 .button:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 input[type="submit"]:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 .wp-block-button__link:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 .wp-block-file .wp-block-file__button:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 .a8c-posts-list__view-all:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 button[data-load-more-btn]:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 button:active {
@@ -2416,8 +2446,8 @@ object {
 }
 
 .wp-block-columns .wp-block-column > * {
-	margin-top: 19.8px;
-	margin-bottom: 19.8px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 
 @media only screen and (min-width: 482px) {
@@ -2440,7 +2470,7 @@ object {
 }
 
 .wp-block-columns .wp-block-column:not(:last-child) {
-	margin-bottom: 19.8px;
+	margin-bottom: 20px;
 }
 
 @media only screen and (min-width: 482px) {
@@ -2590,13 +2620,13 @@ object {
 }
 
 .wp-block-cover .wp-block-cover__inner-container > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 
 .wp-block-cover-image .wp-block-cover__inner-container > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 
 @media only screen and (min-width: 482px) {
@@ -2686,7 +2716,7 @@ object {
 
 .wp-block-file .wp-block-file__button {
 	display: inline-block;
-	padding: 11.5px 12.5px;
+	padding: 12px 13px;
 }
 
 .wp-block-gallery {
@@ -2725,8 +2755,8 @@ object {
 }
 
 .wp-block-group .wp-block-group__inner-container > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 
 @media only screen and (min-width: 482px) {
@@ -2745,7 +2775,7 @@ object {
 }
 
 .wp-block-group.has-background {
-	padding: 19.98px;
+	padding: 20px;
 }
 
 @media only screen and (min-width: 482px) {
@@ -3218,8 +3248,8 @@ dd {
 }
 
 .wp-block-media-text .wp-block-media-text__content > * {
-	margin-top: 19.98px;
-	margin-bottom: 19.98px;
+	margin-top: 20px;
+	margin-bottom: 20px;
 }
 
 @media only screen and (min-width: 482px) {
@@ -3253,7 +3283,7 @@ dd {
 }
 
 .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content {
-	padding: 13.2px;
+	padding: 13px;
 }
 
 .wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label {
@@ -3273,7 +3303,7 @@ dd {
 .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container {
 	border: none;
 	left: 0;
-	margin-left: 13.2px;
+	margin-left: 13px;
 	min-width: max-content;
 	opacity: 0;
 	padding: 0;
@@ -3283,7 +3313,7 @@ dd {
 
 .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content {
 	display: inline-block;
-	padding: 6.6px 13.2px;
+	padding: 7px 13px;
 }
 
 .wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link__submenu-icon {
@@ -3342,7 +3372,7 @@ p.has-background {
 	font-weight: bold;
 	font-size: 16px;
 	line-height: 1;
-	padding: 10px 13.2px;
+	padding: 10px 13px;
 }
 
 .a8c-posts-list__item {
@@ -3753,7 +3783,7 @@ p.has-background {
 	color: #333333;
 	line-height: 1.7;
 	max-width: inherit;
-	margin-right: 16.5px;
+	margin-right: 17px;
 	padding: 10px;
 }
 
@@ -4661,16 +4691,16 @@ nav a {
 		width: 0;
 	}
 	.primary-navigation > div > ul > li > a:before {
-		margin-bottom: -calc(0.5em + -0.38);
+		margin-bottom: -calc(1em + 0);
 	}
 	.woo-navigation > div > ul > li > a:before {
-		margin-bottom: -calc(0.5em + -0.38);
+		margin-bottom: -calc(1em + 0);
 	}
 	.primary-navigation > div > ul > li > a:after {
-		margin-top: -calc(0.5em + -0.39);
+		margin-top: -calc(1em + 0);
 	}
 	.woo-navigation > div > ul > li > a:after {
-		margin-top: -calc(0.5em + -0.39);
+		margin-top: -calc(1em + 0);
 	}
 }
 
@@ -4757,7 +4787,7 @@ nav a {
 	font-family: 'Playfair Display', Georgia, Times, serif;
 	font-size: 32px;
 	font-weight: normal;
-	padding: 6.6px 0;
+	padding: 7px 0;
 }
 
 .woo-navigation a {
@@ -4766,7 +4796,7 @@ nav a {
 	font-family: 'Playfair Display', Georgia, Times, serif;
 	font-size: 32px;
 	font-weight: normal;
-	padding: 6.6px 0;
+	padding: 7px 0;
 }
 
 @media only screen and (min-width: 482px) {
@@ -4774,13 +4804,13 @@ nav a {
 		font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
 		font-size: 16px;
 		font-weight: normal;
-		padding: 13.2px;
+		padding: 13px;
 	}
 	.woo-navigation a {
 		font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
 		font-size: 16px;
 		font-weight: normal;
-		padding: 13.2px;
+		padding: 13px;
 	}
 }
 
@@ -4798,26 +4828,26 @@ nav a {
 
 .primary-navigation .sub-menu {
 	list-style: none;
-	margin-left: 13.2px;
+	margin-left: 13px;
 }
 
 .woo-navigation .sub-menu {
 	list-style: none;
-	margin-left: 13.2px;
+	margin-left: 13px;
 }
 
 .primary-navigation .sub-menu .menu-item a {
 	font-size: 24px;
 	font-style: italic;
-	padding-top: 6.6px;
-	padding-bottom: 6.6px;
+	padding-top: 7px;
+	padding-bottom: 7px;
 }
 
 .woo-navigation .sub-menu .menu-item a {
 	font-size: 24px;
 	font-style: italic;
-	padding-top: 6.6px;
-	padding-bottom: 6.6px;
+	padding-top: 7px;
+	padding-bottom: 7px;
 }
 
 @media only screen and (min-width: 482px) {
@@ -4844,12 +4874,12 @@ nav a {
 	.primary-navigation .menu-item-has-children > .svg-icon {
 		display: inline-block;
 		height: 100%;
-		margin-right: 13.2px;
+		margin-right: 13px;
 	}
 	.woo-navigation .menu-item-has-children > .svg-icon {
 		display: inline-block;
 		height: 100%;
-		margin-right: 13.2px;
+		margin-right: 13px;
 	}
 }
 
@@ -4882,7 +4912,7 @@ nav a {
 }
 
 .social-navigation > div > ul > li {
-	margin-bottom: 13.2px;
+	margin-bottom: 13px;
 }
 
 .social-navigation > div > ul > li:first-of-type > a {
@@ -4896,7 +4926,7 @@ nav a {
 .social-navigation a {
 	color: #333333;
 	display: inline-block;
-	padding: 0 6.6px;
+	padding: 0 7px;
 }
 
 .social-navigation a:hover {
@@ -5008,7 +5038,7 @@ nav a {
 	font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
 	font-size: 16px;
 	font-weight: normal;
-	padding: 13.2px;
+	padding: 13px;
 	color: currentColor;
 }
 
@@ -5352,8 +5382,8 @@ nav a {
 	font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
 	font-size: 16px;
 	font-weight: normal;
-	margin-left: 13.2px;
-	margin-right: 13.2px;
+	margin-left: 13px;
+	margin-right: 13px;
 }
 
 .pagination .nav-links > *.current {
@@ -5465,7 +5495,7 @@ nav a {
 .comment-meta .comment-author {
 	line-height: 1.3;
 	margin-bottom: 5px;
-	padding-right: 62.5px;
+	padding-right: 63px;
 	max-width: calc(100% - 75px);
 }
 
@@ -5729,7 +5759,7 @@ nav a {
 
 @media only screen and (min-width: 482px) {
 	.comment-form > p.comment-form-author {
-		margin-right: 37.5px;
+		margin-right: 38px;
 	}
 	.comment-form > p.comment-notes, .comment-form > p.logged-in-as {
 		display: block;
@@ -5813,7 +5843,7 @@ img#wpstats {
 	font-family: 'Fira Sans', Helvetica, Arial, sans-serif;
 	font-size: 14px;
 	line-height: 1;
-	padding: 5px 6.6px;
+	padding: 5px 7px;
 }
 
 .page-title {
@@ -6295,59 +6325,59 @@ input[type="submit"]:after,
 }
 
 button:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 .button:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 input[type="submit"]:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 .wp-block-button__link:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 .wp-block-file .wp-block-file__button:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 .a8c-posts-list__view-all:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 button[data-load-more-btn]:before {
-	margin-bottom: -calc(0.5em + -0.38);
+	margin-bottom: -calc(1em + 0);
 }
 
 button:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 .button:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 input[type="submit"]:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 .wp-block-button__link:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 .wp-block-file .wp-block-file__button:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 .a8c-posts-list__view-all:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 button[data-load-more-btn]:after {
-	margin-top: -calc(0.5em + -0.39);
+	margin-top: -calc(1em + 0);
 }
 
 button:active {
@@ -6535,6 +6565,26 @@ button[data-load-more-btn],
 	padding-right: 20px !important;
 }
 
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
+	margin-top: 20px;
+	margin-bottom: 20px;
+}
+
+@media only screen and (min-width: 482px) {
+	.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
+		margin-top: 30px;
+		margin-bottom: 30px;
+	}
+}
+
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:first-child {
+	margin-top: 0;
+}
+
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:last-child {
+	margin-bottom: 0;
+}
+
 /* Gutter Options */
 .wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__none {
 	grid-gap: 0px !important;

seedlet/assets/css/style-editor.css

@@ -1180,6 +1180,120 @@ pre.wp-block-verse {
 /**
  * Spacing Overrides
  */
+/*
+ * Margins
+ */
+.margin-top-none {
+	margin-top: 0 !important;
+}
+
+.margin-top-half {
+	margin-top: calc(0.5 * var(--global--spacing-vertical)) !important;
+}
+
+.margin-top-default {
+	margin-top: var(--global--spacing-vertical) !important;
+}
+
+.margin-right-none {
+	/*rtl:ignore*/
+	margin-right: 0 !important;
+}
+
+.margin-right-half {
+	/*rtl:ignore*/
+	margin-right: calc(0.5 * var(--global--spacing-vertical)) !important;
+}
+
+.margin-right-default {
+	/*rtl:ignore*/
+	margin-right: var(--global--spacing-vertical) !important;
+}
+
+.margin-bottom-none {
+	margin-bottom: 0 !important;
+}
+
+.margin-bottom-half {
+	margin-bottom: calc(0.5 * var(--global--spacing-vertical)) !important;
+}
+
+.margin-bottom-default {
+	margin-bottom: var(--global--spacing-vertical) !important;
+}
+
+.margin-left-none {
+	/*rtl:ignore*/
+	margin-left: 0 !important;
+}
+
+.margin-left-half {
+	/*rtl:ignore*/
+	margin-left: calc(0.5 * var(--global--spacing-vertical)) !important;
+}
+
+.margin-left-default {
+	/*rtl:ignore*/
+	margin-left: var(--global--spacing-vertical) !important;
+}
+
+/*
+ * Padding
+ */
+.padding-top-none {
+	padding-top: 0 !important;
+}
+
+.padding-top-half {
+	padding-top: calc(0.5 * var(--global--spacing-vertical)) !important;
+}
+
+.padding-top-default {
+	padding-top: var(--global--spacing-vertical) !important;
+}
+
+.padding-right-none {
+	/*rtl:ignore*/
+	padding-right: 0 !important;
+}
+
+.padding-right-half {
+	/*rtl:ignore*/
+	padding-right: calc(0.5 * var(--global--spacing-vertical)) !important;
+}
+
+.padding-right-default {
+	/*rtl:ignore*/
+	padding-right: var(--global--spacing-vertical) !important;
+}
+
+.padding-bottom-none {
+	padding-bottom: 0 !important;
+}
+
+.padding-bottom-half {
+	padding-bottom: calc(0.5 * var(--global--spacing-vertical)) !important;
+}
+
+.padding-bottom-default {
+	padding-bottom: var(--global--spacing-vertical) !important;
+}
+
+.padding-left-none {
+	/*rtl:ignore*/
+	padding-left: 0 !important;
+}
+
+.padding-left-half {
+	/*rtl:ignore*/
+	padding-left: calc(0.5 * var(--global--spacing-vertical)) !important;
+}
+
+.padding-left-default {
+	/*rtl:ignore*/
+	padding-left: var(--global--spacing-vertical) !important;
+}
+
 [data-block] {
 	margin-top: var(--global--spacing-vertical);
 	margin-bottom: var(--global--spacing-vertical);
@@ -1245,6 +1359,11 @@ pre.wp-block-verse {
 	max-width: none;
 }
 
+.block-editor-block-list__layout:not(.edit-site-block-editor__block-list) .wp-block[data-align="full"] > [data-block], .block-editor-block-list__layout:not(.edit-site-block-editor__block-list) .wp-block.alignfull > [data-block] {
+	margin-top: 0;
+	margin-bottom: 0;
+}
+
 .alignleft {
 	margin: 0;
 	margin-right: var(--global--spacing-horizontal);
@@ -1630,9 +1749,10 @@ pre.wp-block-verse {
 	padding-left: calc(var(--layout-grid--gutter-huge) + var(--layout-grid--background-offset));
 }
 
-/* Overlay grid */
+/* Overlay styles and margin reset */
 .wp-block-jetpack-layout-grid {
 	/* wpcom-overlay-grid is the classname targeting the grid overlay visual aid displayed in the editor */
+	/* Override default block margin rules */
 }
 
 .wp-block-jetpack-layout-grid .wpcom-overlay-grid {
@@ -1646,6 +1766,11 @@ pre.wp-block-verse {
 	padding-right: 0;
 }
 
+.wp-block-jetpack-layout-grid [data-type="jetpack/layout-grid-column"] {
+	margin-top: 0;
+	margin-bottom: 0;
+}
+
 .wp-block-jetpack-layout-grid.wp-block-jetpack-layout-gutter__none .wpcom-overlay-grid {
 	grid-gap: var(--layout-grid--gutter-none);
 }

seedlet/assets/sass/blocks/utilities/_editor.scss

@@ -159,6 +159,8 @@
  * Spacing Overrides
  */
 
+ @import "spacing-overrides";
+
 [data-block] {
 	margin-top: var(--global--spacing-vertical);
 	margin-bottom: var(--global--spacing-vertical);
@@ -231,6 +233,19 @@
 	}
 }
 
+// Selects the post editor and not the site editor
+.block-editor-block-list__layout:not(.edit-site-block-editor__block-list){
+	.wp-block {
+		&[data-align="full"],
+		&.alignfull {
+			&>[data-block] {
+				margin-top: 0;
+				margin-bottom: 0;
+			}
+		}
+	}
+}
+
 .alignleft {
 	margin: 0;
 	margin-right: var(--global--spacing-horizontal);

seedlet/assets/sass/blocks/utilities/_style.scss

@@ -57,6 +57,7 @@
 /**
  * .aligndefault
  */
+.page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
 .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
 .entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
 	@extend %responsive-aligndefault-width;

seedlet/assets/sass/vendors/jetpack/blocks/layout-grid/_editor.scss

@@ -69,7 +69,7 @@
 	}
 }
 
-/* Overlay grid */
+/* Overlay styles and margin reset */
 .wp-block-jetpack-layout-grid {
 	/* wpcom-overlay-grid is the classname targeting the grid overlay visual aid displayed in the editor */
 	.wpcom-overlay-grid {
@@ -84,6 +84,12 @@
 			padding-right: 0;
 		}
 	}
+
+	/* Override default block margin rules */ 
+	[data-type="jetpack/layout-grid-column"] {
+		margin-top: 0;
+		margin-bottom: 0;
+	}
 }
 
 @each $size in $layout-gutter-sizes {

seedlet/assets/sass/vendors/jetpack/blocks/layout-grid/_style.scss

@@ -17,12 +17,30 @@
 			padding-left: var(--layout-grid--background-offset) !important;
 			padding-right: var(--layout-grid--background-offset) !important;
 		}
+
+		> * {
+			margin-top: calc( 0.666 * var(--global--spacing-vertical) );
+			margin-bottom: calc( 0.666 * var(--global--spacing-vertical) );
+
+			@include media(mobile) {
+				margin-top: var(--global--spacing-vertical);
+				margin-bottom: var(--global--spacing-vertical);
+			}
+
+			&:first-child {
+				margin-top: 0;
+			}
+
+			&:last-child {
+				margin-bottom: 0;
+			}
+		}
 	}
 }
 
 /* Gutter Options */
 @each $size in $layout-gutter-sizes {
-.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__#{$size} {
+	.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__#{$size} {
 		grid-gap: var(--layout-grid--gutter-#{$size}) !important;
 	}
 }

seedlet/inc/wpcom-customize-preview.js

@@ -0,0 +1,21 @@
+/**
+ * File wpcom-customize-preview.js.
+ *
+ * Instantly live-update customizer settings in the preview for improved user experience,
+ * targeting the updates needed to hide the page title on the homepage on WordPress.com.
+ */
+
+( function( $ ) {
+
+	// Hide Front Page Title
+	wp.customize( 'hide_front_page_title', function( value ) {
+		value.bind( function( to ) {
+			if ( true === to ) {
+				$( 'body' ).addClass( 'hide-homepage-title' );
+
+			} else {
+				$( 'body' ).removeClass( 'hide-homepage-title' );
+			}
+		} );
+	} );
+} )( jQuery );

seedlet/inc/wpcom-style-editor.css

@@ -0,0 +1,7 @@
+.hide-homepage-title .editor-styles-wrapper .post-content__block .editor-post-title {
+	display: none;
+}
+
+.hide-homepage-title .editor-styles-wrapper .post-content__block {
+  margin-top: -16px;
+}

seedlet/inc/wpcom-style.css

@@ -0,0 +1,28 @@
+/**
+ * WP.com stylesheet for Seedlet
+ */
+
+ /**
+ * Hide page title on the homepage
+ */
+.home.page.hide-homepage-title .entry-header {
+	display: none;
+}
+
+.home.page.hide-homepage-title .entry-content {
+	margin-top: 0;
+}
+
+/**
+ * Fix Direct Manipulation icons in the Customizer
+ */
+.cdm-icon svg {
+	fill: #fff;
+}
+
+/**
+ * Hide Footer Credit comma
+ */
+.hide-footer-credit .comma {
+	display: none;
+}

seedlet/inc/wpcom.php

@@ -0,0 +1,114 @@
+<?php
+/**
+ * WordPress.com-specific functions and definitions.
+ *
+ * This file is centrally included from `wp-content/mu-plugins/wpcom-theme-compat.php`.
+ *
+ * @package Seedlet
+ */
+
+/**
+ * Add setting for hiding page title on the homepage.
+ */
+function seedlet_wpcom_customize_update( $wp_customize ) {
+	$wp_customize->add_setting( 'hide_front_page_title', array(
+		'default'              => false,
+		'type'                 => 'theme_mod',
+		'transport'            => 'postMessage',
+		'sanitize_callback'    => 'seedlet_sanitize_checkbox',
+	) );
+
+	$wp_customize->add_control( 'hide_front_page_title', array(
+		'label'		  => esc_html__( 'Hide Homepage Title', 'seedlet' ),
+		'description' => esc_html__( 'Check to hide the page title, if your homepage is set to display a static page.', 'seedlet' ),
+		'section'	  => 'static_front_page',
+		'priority'	  => 10,
+		'type'		  => 'checkbox',
+		'settings'	  => 'hide_front_page_title',
+	) );
+}
+add_action( 'customize_register', 'seedlet_wpcom_customize_update' );
+
+/**
+* Sanitize the checkbox.
+*
+* @param boolean $input.
+*
+* @return boolean true if is 1 or '1', false if anything else
+*/
+function seedlet_sanitize_checkbox( $input ) {
+	if ( 1 == $input ) {
+		return true;
+	} else {
+		return false;
+	}
+}
+
+/**
+ * Bind JS handlers to instantly live-preview changes.
+ */
+function seedlet_wpcom_customize_preview_js() {
+	wp_enqueue_script( 'seedlet_wpcom_customize_preview', get_theme_file_uri( '/inc/wpcom-customize-preview.js' ), array( 'customize-preview' ), '1.0', true );
+}
+add_action( 'customize_preview_init', 'seedlet_wpcom_customize_preview_js' );
+
+/**
+ * Enqueue our WP.com styles for front-end.
+ * Loads after style.css so we can add overrides.
+ */
+function seedlet_wpcom_scripts() {
+	wp_enqueue_style( 'seedlet-wpcom-style', get_template_directory_uri() . '/inc/wpcom-style.css', array( 'seedlet-style' ), '20200629' );
+}
+add_action( 'wp_enqueue_scripts', 'seedlet_wpcom_scripts' );
+
+/**
+ * Adds custom classes to the array of body classes.
+ *
+ * @param array $classes Classes for the body element.
+ * @return array
+ */
+function seedlet_wpcom_body_classes( $classes ) {
+
+	$hide = get_theme_mod( 'hide_front_page_title', false );
+
+	if ( true === $hide ) {
+		$classes[] = 'hide-homepage-title';
+	}
+
+	$credit_option = get_option( 'footercredit' );
+
+	if ( 'hidden' == $credit_option ) {
+		$classes[] = 'hide-footer-credit';
+	}
+
+	return $classes;
+}
+add_filter( 'body_class', 'seedlet_wpcom_body_classes' );
+
+/**
+ * Adds custom classes to the admin body classes.
+ *
+ * @param string $classes Classes for the body element.
+ * @return string
+ */
+function seedlet_wpcom_admin_body_classes( $classes ) {
+	global $post;
+	$is_block_editor_screen = ( function_exists( 'get_current_screen' ) && get_current_screen() && get_current_screen()->is_block_editor() );
+	$hide = get_theme_mod( 'hide_front_page_title', false );
+	$front_page = (int) get_option( 'page_on_front' );
+
+	if ( $is_block_editor_screen && $front_page === $post->ID && true === $hide ) {
+		$classes .= ' hide-homepage-title';
+	}
+
+	return $classes;
+}
+add_filter( 'admin_body_class', 'seedlet_wpcom_admin_body_classes' );
+
+/**
+ * Enqueue our WP.com styles for the block editor.
+ */
+function seedlet_wpcom_editor_scripts() {
+	wp_enqueue_style( 'seedlet-wpcom-editor-style', get_template_directory_uri() . '/inc/wpcom-style-editor.css', array(), '20200629' );
+}
+add_action( 'enqueue_block_editor_assets', 'seedlet_wpcom_editor_scripts' );

seedlet/postcss.config.js

@@ -5,6 +5,8 @@ module.exports = {
 			"preserve": false,
 			"preserveAtRulesOrder": true
 		}),
-		require( 'postcss-calc' )
+		require( 'postcss-calc' )({
+			"precision": 0
+		})
 	]
 }

seedlet/style-rtl.css

@@ -355,7 +355,8 @@ Included in theme screenshot.
 /**
  * Extends
  */
-.default-max-width, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
+.default-max-width, hr.wp-block-separator.is-style-wide, .page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
+.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
 .entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-thumbnail, .navigation {
 	max-width: var(--responsive--aligndefault-width);
 	margin-right: auto;
@@ -4286,6 +4287,26 @@ button[data-load-more-btn],
 	padding-left: var(--layout-grid--background-offset) !important;
 }
 
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
+	margin-top: calc( 0.666 * var(--global--spacing-vertical));
+	margin-bottom: calc( 0.666 * var(--global--spacing-vertical));
+}
+
+@media only screen and (min-width: 482px) {
+	.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
+		margin-top: var(--global--spacing-vertical);
+		margin-bottom: var(--global--spacing-vertical);
+	}
+}
+
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:first-child {
+	margin-top: 0;
+}
+
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:last-child {
+	margin-bottom: 0;
+}
+
 /* Gutter Options */
 .wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__none {
 	grid-gap: var(--layout-grid--gutter-none) !important;

seedlet/style.css

@@ -355,7 +355,8 @@ Included in theme screenshot.
 /**
  * Extends
  */
-.default-max-width, hr.wp-block-separator.is-style-wide, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
+.default-max-width, hr.wp-block-separator.is-style-wide, .page-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
+.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.entry-attachment):not(.woocommerce),
 .entry-content [class*="inner-container"] > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-content .wp-audio-shortcode, .post-thumbnail, .navigation {
 	max-width: var(--responsive--aligndefault-width);
 	margin-left: auto;
@@ -4311,6 +4312,26 @@ button[data-load-more-btn],
 	padding-right: var(--layout-grid--background-offset) !important;
 }
 
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
+	margin-top: calc( 0.666 * var(--global--spacing-vertical));
+	margin-bottom: calc( 0.666 * var(--global--spacing-vertical));
+}
+
+@media only screen and (min-width: 482px) {
+	.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > * {
+		margin-top: var(--global--spacing-vertical);
+		margin-bottom: var(--global--spacing-vertical);
+	}
+}
+
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:first-child {
+	margin-top: 0;
+}
+
+.wp-block-jetpack-layout-grid .wp-block-jetpack-layout-grid-column > *:last-child {
+	margin-bottom: 0;
+}
+
 /* Gutter Options */
 .wp-block-jetpack-layout-grid .wp-block-jetpack-layout-gutter__none {
 	grid-gap: var(--layout-grid--gutter-none) !important;