Update for Gutenberg 12.5.3 and WordPress 5.9

bobbingwide / thisis

ThisIs ... experimental Full Site Editing theme

GNU General Public License v3.0

1 stars 0 forks source link

Update for Gutenberg 12.5.3 and WordPress 5.9 #35

Open bobbingwide opened 2 years ago

bobbingwide commented 2 years ago

Apply similar changes to thisis as for Fizzie. See https://github.com/bobbingwide/fizzie/issues/72 And also take a look at things done in ccd2022

Problems are that it now "Looks funny"

Everything is Full width
Margins appear to have disappeared
Background colour missing elsewhere

I should also be able to make use of the Row variation of the Group block.

bobbingwide commented 2 years ago

The first major problem I had was of my own doing.

Problem

I lost the ability to toggle Inherit default layout; the toggle was missing.

Explanation

I'd duffed up theme.json when copying the custom.spacing section from Twenty Twenty Two.
The curly braces ended up in the wrong place.
I inadvertently changed settings.layout to settings.custom.layout
Which, I assume, meant that there wasn't a default layout to inherit

bobbingwide commented 2 years ago

But I also noticed nearly 200 messages in the console log

VM999 react_devtools_backend.js:4045 Error while traversing the CSS: Error: undefined:81:4: property missing ':'

bobbingwide commented 2 years ago

I decided to add my WordPress info block into the footer area. But....

It doesn't align center under the images
When I tried converted a Columns block into 3 columns I lost the ability to set the second and third column's width using percentages.

bobbingwide commented 2 years ago

Having renamed the block-templates and block-template-parts folders I've broken the special internationalisation logic in the template-part.php overrides. A quick fix is to disable this override. An alternative is to change the code to look for /parts/ instead of /block-template-parts/

bobbingwide commented 2 years ago

I don't know value to use for settings.spacing.blockGap.

If I set it to 0 then there's no margin between columns.
If I set it to 0.5rem then there's vertical white space between the header and the Cover block due to the generated CSS

.wp-site-blocks > * + * {
    margin-top: var( --wp--style--block-gap );
}

bobbingwide commented 2 years ago

A pragmatic solution to the width problem is to set the contentSize and wideSize to the same values. eg increase contentSize from 800px to 1200px.