Adds in viewports or adjusts them for block patterns #27204
Merged
Conversation
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
karmatosed
added
[Type] Enhancement
karmatosed
requested review from
spacedmonkey and
TimothyBJacobs
as code owners
|
Size Change: -389 B (0%) Total Size: 1.2 MB
ℹ️ View Unchanged
|
|
This seems like a good improvement! Would it make sense to set a wider default viewport though? That way future blocks would benefit from this by default. |
|
@kjellr your comment took me on a journey into the code. I wasn't aware it wasn't set individually, so that's great information on block patterns. I have increased the default to 1200, which also means can reduce back a few lines, as they all use default value. |
kjellr
reviewed
Nov 24, 2020
| @@ -7,7 +7,8 @@ | |||
|
|
|||
| return array( | |||
| 'title' => __( 'Two columns of text with images', 'gutenberg' ), | |||
| 'categories' => array( 'columns' ), | |||
| 'categories' => array( 'columns' ), | |||
| 'viewportWidth' => 1200, | |||
There was a problem hiding this comment.
Can this one be taken out too?
kjellr
approved these changes
Nov 24, 2020
|
Thanks for code review, caught that final one (so many lines we got to save here!). Once tests have passed I'll merge this little fix. Thanks @kjellr for collaborating on this. |
|
@ItsJonQ thank you so much it seems that the tests are all starting to pass now! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Ideally when browsing block patterns you should see as close to what the pattern is going to be, if it's visually represented. Currently the following is what you see:
Problem
The main problem with this is that everything seems 'full width', even when it needs to be set. For example, headers, columns. This can also look a lot better with some spacing, to allow the content to breathe and be understood.
Solution
Props to @kjellr as I was exploring, for mentioning that this could be solved by setting 'viewportsWidth' on block patterns. In exploring I discovered some block patterns didn't have these set, others have very low settings. I have set in this PR some to 1200 along with giving some missing values, to bring a little uniformity.
After applying this PR here is what you should see:
Feedback
I would appreciate a code review and design feedback. This is a relatively small pickup PR, so be great to see about getting this in from there.