This repository has been archived by the owner on Jan 26, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 92
Try: add padding CSS rules instead of in the templates #291
Merged
Merged
Changes from 24 commits
Commits
Show all changes
26 commits
Select commit
Hold shift + click to select a range
e765c48
removed paddings from templates
MaggieCabrera 6349bc3
padding rules and adjustments for home header
MaggieCabrera 3321635
fix padding for full page pattern
MaggieCabrera 93ab565
add padding to the page title in the editor
MaggieCabrera 3f637ce
target direct siblings full aligned
MaggieCabrera 82abcee
fixed syntax errors
MaggieCabrera aae7434
undo change to only direct siblings
MaggieCabrera 5f244f9
removed padding exceptions
MaggieCabrera 984b49b
reset margins for column exception
MaggieCabrera ce6f8ea
inherit margin in all column cases
MaggieCabrera c79b1cb
Fix header template part.
kjellr e8608f0
Fix large dark header.
kjellr 218421b
Update code comments.
kjellr 84bd261
Push fix for an edge case.
kjellr 6dba867
add rule for the editor
MaggieCabrera 02eaf65
fix for horizontal scroll when we have nexted full aligned blocks
MaggieCabrera 5a24f09
Add additional wrappers to the headers.
kjellr 5f6c14a
Remove unneeded wrapper so alignment works on mobile.
jffng 705a6da
Remove unneeded wrappers and inherit: true attributes.
jffng 395e093
Override has-background Gutenberg CSS.
jffng 3e059dd
Add more warning/clarification in code comments.
kjellr 89b3c53
Correct styles inside of full-with group blocks.
kjellr 87a8ec8
Fix header.
kjellr 8c2ba59
Tidy up code comments.
kjellr c4a80d3
Use more specific selectors.
kjellr 4cc17cc
Revert "Use more specific selectors."
kjellr File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,5 @@ | ||
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var(--wp--custom--spacing--large, 8rem)","right":"var(--wp--custom--spacing--small, 1.25rem)","left":"var(--wp--custom--spacing--small, 1.25rem)"}}},"layout":{"inherit":true}} --> | ||
<div class="wp-block-group" style="padding-top:var(--wp--custom--spacing--large, 8rem);padding-right:var(--wp--custom--spacing--small, 1.25rem);padding-left:var(--wp--custom--spacing--small, 1.25rem)"> | ||
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var(--wp--custom--spacing--large, 8rem)"}}},"layout":{"inherit":true}} --> | ||
<div class="wp-block-group" style="padding-top:var(--wp--custom--spacing--large, 8rem)"> | ||
<!-- wp:pattern {"slug":"twentytwentytwo/footer-default"} /--> | ||
</div> | ||
<!-- /wp:group --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,7 @@ | ||
<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|background"}}},"spacing":{"padding":{"top":"0px","bottom":"var(--wp--custom--spacing--large, 8rem)","right":"0px","left":"0px"},"margin":{"bottom":"var(--wp--custom--spacing--large, 8rem)"}}},"backgroundColor":"foreground","textColor":"background","layout":{"inherit":true}} --> | ||
<div class="wp-block-group alignfull has-background-color has-foreground-background-color has-text-color has-background has-link-color" style="margin-bottom:var(--wp--custom--spacing--large, 8rem);padding-top:0px;padding-right:0px;padding-bottom:var(--wp--custom--spacing--large, 8rem);padding-left:0px"><!-- wp:template-part {"slug":"header","tagName":"header","align":"full"} /--> | ||
<!-- wp:group {"layout":{"inherit":true}} --> | ||
<div class="wp-block-group"><!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|background"}}},"spacing":{"padding":{"top":"0px","bottom":"0px"},"margin":{"bottom":"var(--wp--custom--spacing--large, 8rem)"}}},"backgroundColor":"foreground","textColor":"background","layout":{"inherit":true}} --> | ||
<div class="wp-block-group alignfull has-background-color has-foreground-background-color has-text-color has-background has-link-color" style="margin-bottom:var(--wp--custom--spacing--large, 8rem);padding-top:0px;padding-bottom:0px"><!-- wp:template-part {"slug":"header","tagName":"header","align":"wide"} /--> | ||
|
||
<!-- wp:pattern {"slug":"twentytwentytwo/hidden-heading-and-bird"} /--></div> | ||
<!-- /wp:group --></div> | ||
<!-- /wp:group --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,7 @@ | ||
<!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|background"}}},"spacing":{"padding":{"top":"0px","bottom":"0px","right":"0px","left":"0px"},"margin":{"bottom":"var(--wp--custom--spacing--large, 8rem)"}}},"backgroundColor":"foreground","textColor":"background","layout":{"inherit":true}} --> | ||
<div class="wp-block-group alignfull has-background-color has-foreground-background-color has-text-color has-background has-link-color" style="margin-bottom:var(--wp--custom--spacing--large, 8rem);padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px"><!-- wp:template-part {"slug":"header","tagName":"header","align":"full"} /--> | ||
<!-- wp:group {"layout":{"inherit":true}} --> | ||
<div class="wp-block-group"><!-- wp:group {"align":"full","style":{"elements":{"link":{"color":{"text":"var:preset|color|background"}}},"spacing":{"padding":{"top":"0px","bottom":"0px"},"margin":{"bottom":"var(--wp--custom--spacing--large, 8rem)"}}},"backgroundColor":"foreground","textColor":"background","layout":{"inherit":true}} --> | ||
<div class="wp-block-group alignfull has-background-color has-foreground-background-color has-text-color has-background has-link-color" style="margin-bottom:var(--wp--custom--spacing--large, 8rem);padding-top:0px;padding-bottom:0px"><!-- wp:template-part {"slug":"header","tagName":"header","align":"wide"} /--> | ||
|
||
<!-- wp:pattern {"slug":"twentytwentytwo/hidden-bird"} /--></div> | ||
<!-- /wp:group --></div> | ||
<!-- /wp:group --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,15 +1,13 @@ | ||
<!-- wp:group {"style":{"spacing":{"padding":{"right":"var(--wp--custom--spacing--small, 1.25rem)","left":"var(--wp--custom--spacing--small, 1.25rem)"}}},"layout":{"inherit":true}} --> | ||
<div class="wp-block-group" style="padding-right:var(--wp--custom--spacing--small, 1.25rem);padding-left:var(--wp--custom--spacing--small, 1.25rem)"> | ||
<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"bottom":"var(--wp--custom--spacing--large, 8rem)","top":"var(--wp--custom--spacing--small, 1.25rem)"}}},"layout":{"type":"flex","justifyContent":"space-between"}} --> | ||
<div class="wp-block-group alignwide" style="padding-top:var(--wp--custom--spacing--small, 1.25rem);padding-bottom:var(--wp--custom--spacing--large, 8rem)"><!-- wp:group {"layout":{"type":"flex"}} --> | ||
<div class="wp-block-group"><!-- wp:site-logo {"width":64} /--> | ||
<!-- wp:group {"layout":{"inherit":true}} --> | ||
<div class="wp-block-group"><!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"bottom":"var(--wp--custom--spacing--large, 8rem)","top":"var(--wp--custom--spacing--small, 1.25rem)"}}},"layout":{"type":"flex","justifyContent":"space-between"}} --> | ||
<div class="wp-block-group alignwide" style="padding-top:var(--wp--custom--spacing--small, 1.25rem);padding-bottom:var(--wp--custom--spacing--large, 8rem)"><!-- wp:group {"layout":{"type":"flex"}} --> | ||
<div class="wp-block-group"><!-- wp:site-logo {"width":64} /--> | ||
|
||
<!-- wp:site-title {"style":{"typography":{"fontStyle":"italic","fontWeight":"400"}}} /--></div> | ||
<!-- /wp:group --> | ||
|
||
<!-- wp:navigation {"layout":{"type":"flex","setCascadingProperties":true,"justifyContent":"right"}} --> | ||
<!-- wp:page-list {"isNavigationChild":true,"showSubmenuIcon":true,"openSubmenusOnClick":false} /--> | ||
<!-- /wp:navigation --></div> | ||
<!-- /wp:group --> | ||
</div> | ||
<!-- wp:site-title {"style":{"typography":{"fontStyle":"italic","fontWeight":"400"}}} /--></div> | ||
<!-- /wp:group --> | ||
|
||
<!-- wp:navigation {"layout":{"type":"flex","setCascadingProperties":true,"justifyContent":"right"}} --> | ||
<!-- wp:page-list {"isNavigationChild":true,"showSubmenuIcon":true,"openSubmenusOnClick":false} /--> | ||
<!-- /wp:navigation --></div> | ||
<!-- /wp:group --></div> | ||
<!-- /wp:group --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In the site editor, check out the archive or home template. This rule is applying an unwanted padding in the query:
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, I believe
is-root-container
is used in multiple places. We should switch to something else or be more specific.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I just pushed a potential fix in c4a80d3. It uses more specific selectors, but also required specifying both the root container for the site editor and for the post/page editor.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hmm actually, now that I'm looking closer I'm not sure that'll do it. 😕
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
😕 It doesn't. Reverting that commit.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ok, after some further digging, I can see that this is basically a re-creation of this issue: WordPress/gutenberg#33248.
Basically, the Query block renders using some nested DOM elements, and that causes this duplicate selector where it shouldn't be. In the post/page editor, Gutenberg itself provides some
is-root-container
styles that cause the same behavior you're seeing here.Since WordPress/gutenberg#33248 is listed as a must-have for 5.9, and is currently in progress I think we're ok to push through with this bug present for now.