Merge pull request #2992 from Automattic/blank-canvas/improve-top-margin-css-rules

Blank Canvas: Improve top margin CSS rules
This commit is contained in:
Ben Dwyer 2021-01-12 16:17:01 +00:00 committed by GitHub
commit 8c1e871e51
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -30,14 +30,6 @@ GNU General Public License for more details.
@import "variables.css"; @import "variables.css";
/* Remove outside padding on single post pages. */
.single .site-main,
.page .site-main {
padding-top: 0;
padding-bottom: 0;
}
/* Remove extra margin from articles on single post pages. */ /* Remove extra margin from articles on single post pages. */
.single .site-main > article, .single .site-main > article,
@ -45,11 +37,17 @@ GNU General Public License for more details.
margin-bottom: 0; margin-bottom: 0;
} }
/* Add some top padding if the first block on the page is not full-width or a spacer. */ /* Add some top padding if the first block on the page is a full-width image, cover, media & text, or group block. */
.single .entry-content > *:first-child:not(.alignfull):not(.wp-block-spacer), .single .entry-content > .wp-block-image.alignfull:first-child,
.page .entry-content > *:first-child:not(.alignfull):not(.wp-block-spacer) { .page .entry-content > .wp-block-image.alignfull:first-child,
padding-top: var(--global--spacing-vertical); .single .entry-content > .wp-block-cover.alignfull:first-child,
.page .entry-content > .wp-block-cover.alignfull:first-child,
.single .entry-content > .wp-block-media-text.alignfull:first-child,
.page .entry-content > .wp-block-media-text.alignfull:first-child
.single .entry-content > .wp-block-group.has-background.alignfull:first-child,
.page .entry-content > .wp-block-group.has-background.alignfull:first-child {
margin-top: calc(-1 * var(--global--spacing-vertical));
} }
/* Add some top padding for archive pages. */ /* Add some top padding for archive pages. */
@ -80,4 +78,4 @@ body:not(.single):not(.page) .site-content {
.entry-footer, .entry-footer,
.site-info { .site-info {
text-align: center; text-align: center;
} }