Twenty Twenty-One: Add margins around content in Post Template block.

Props desrosj, joen.
See #53389, #53398.


Built from https://develop.svn.wordpress.org/trunk@51201


git-svn-id: http://core.svn.wordpress.org/trunk@50810 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
ryelle 2021-06-22 16:55:58 +00:00
parent 5259b18f50
commit 8a11188d0f
5 changed files with 33 additions and 12 deletions

View File

@ -1094,6 +1094,11 @@ template {
margin-top: 20px; margin-top: 20px;
margin-bottom: 20px; margin-bottom: 20px;
} }
.wp-block-post-template :where(li > *) {
margin-top: 20px;
margin-bottom: 20px;
}
@media only screen and (min-width: 482px) { @media only screen and (min-width: 482px) {
.site-main > article > * { .site-main > article > * {
@ -1120,13 +1125,19 @@ template {
margin-top: 30px; margin-top: 30px;
margin-bottom: 30px; margin-bottom: 30px;
} }
.wp-block-post-template :where(li > *) {
margin-top: 30px;
margin-bottom: 30px;
}
} }
.site-main > article > *:first-child, .site-main > article > *:first-child,
.site-main > .not-found > *:first-child, .site-main > .not-found > *:first-child,
.entry-content > *:first-child, .entry-content > *:first-child,
[class*=inner-container] > *:first-child, [class*=inner-container] > *:first-child,
.wp-block-template-part > *:first-child { .wp-block-template-part > *:first-child,
.wp-block-post-template :where(li > *):first-child {
margin-top: 0; margin-top: 0;
} }
@ -1134,7 +1145,8 @@ template {
.site-main > .not-found > *:last-child, .site-main > .not-found > *:last-child,
.entry-content > *:last-child, .entry-content > *:last-child,
[class*=inner-container] > *:last-child, [class*=inner-container] > *:last-child,
.wp-block-template-part > *:last-child { .wp-block-template-part > *:last-child,
.wp-block-post-template :where(li > *):last-child {
margin-bottom: 0; margin-bottom: 0;
} }

View File

@ -92,7 +92,8 @@
.site-main > .not-found > *, // apply vertical margins to article level .site-main > .not-found > *, // apply vertical margins to article level
.entry-content > *, .entry-content > *,
[class*="inner-container"] > *, [class*="inner-container"] > *,
.wp-block-template-part > * { .wp-block-template-part > *,
.wp-block-post-template :where(li > *) { // using :where keeps specificity low.
margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-top: calc(0.666 * var(--global--spacing-vertical));
margin-bottom: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical));

View File

@ -914,7 +914,8 @@ template {
.site-main > .not-found > *, .site-main > .not-found > *,
.entry-content > *, .entry-content > *,
[class*=inner-container] > *, [class*=inner-container] > *,
.wp-block-template-part > * { .wp-block-template-part > *,
.wp-block-post-template :where(li > *) {
margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-top: calc(0.666 * var(--global--spacing-vertical));
margin-bottom: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical));
} }
@ -924,7 +925,8 @@ template {
.site-main > .not-found > *, .site-main > .not-found > *,
.entry-content > *, .entry-content > *,
[class*=inner-container] > *, [class*=inner-container] > *,
.wp-block-template-part > * { .wp-block-template-part > *,
.wp-block-post-template :where(li > *) {
margin-top: var(--global--spacing-vertical); margin-top: var(--global--spacing-vertical);
margin-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical);
} }
@ -934,7 +936,8 @@ template {
.site-main > .not-found > *:first-child, .site-main > .not-found > *:first-child,
.entry-content > *:first-child, .entry-content > *:first-child,
[class*=inner-container] > *:first-child, [class*=inner-container] > *:first-child,
.wp-block-template-part > *:first-child { .wp-block-template-part > *:first-child,
.wp-block-post-template :where(li > *):first-child {
margin-top: 0; margin-top: 0;
} }
@ -942,7 +945,8 @@ template {
.site-main > .not-found > *:last-child, .site-main > .not-found > *:last-child,
.entry-content > *:last-child, .entry-content > *:last-child,
[class*=inner-container] > *:last-child, [class*=inner-container] > *:last-child,
.wp-block-template-part > *:last-child { .wp-block-template-part > *:last-child,
.wp-block-post-template :where(li > *):last-child {
margin-bottom: 0; margin-bottom: 0;
} }

View File

@ -922,7 +922,8 @@ template {
.site-main > .not-found > *, .site-main > .not-found > *,
.entry-content > *, .entry-content > *,
[class*=inner-container] > *, [class*=inner-container] > *,
.wp-block-template-part > * { .wp-block-template-part > *,
.wp-block-post-template :where(li > *) {
margin-top: calc(0.666 * var(--global--spacing-vertical)); margin-top: calc(0.666 * var(--global--spacing-vertical));
margin-bottom: calc(0.666 * var(--global--spacing-vertical)); margin-bottom: calc(0.666 * var(--global--spacing-vertical));
} }
@ -932,7 +933,8 @@ template {
.site-main > .not-found > *, .site-main > .not-found > *,
.entry-content > *, .entry-content > *,
[class*=inner-container] > *, [class*=inner-container] > *,
.wp-block-template-part > * { .wp-block-template-part > *,
.wp-block-post-template :where(li > *) {
margin-top: var(--global--spacing-vertical); margin-top: var(--global--spacing-vertical);
margin-bottom: var(--global--spacing-vertical); margin-bottom: var(--global--spacing-vertical);
} }
@ -942,7 +944,8 @@ template {
.site-main > .not-found > *:first-child, .site-main > .not-found > *:first-child,
.entry-content > *:first-child, .entry-content > *:first-child,
[class*=inner-container] > *:first-child, [class*=inner-container] > *:first-child,
.wp-block-template-part > *:first-child { .wp-block-template-part > *:first-child,
.wp-block-post-template :where(li > *):first-child {
margin-top: 0; margin-top: 0;
} }
@ -950,7 +953,8 @@ template {
.site-main > .not-found > *:last-child, .site-main > .not-found > *:last-child,
.entry-content > *:last-child, .entry-content > *:last-child,
[class*=inner-container] > *:last-child, [class*=inner-container] > *:last-child,
.wp-block-template-part > *:last-child { .wp-block-template-part > *:last-child,
.wp-block-post-template :where(li > *):last-child {
margin-bottom: 0; margin-bottom: 0;
} }

View File

@ -13,7 +13,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '5.8-beta2-51200'; $wp_version = '5.8-beta2-51201';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.