Varya: Add new line-height control support

[allancole]

While this works, and addresses both the frontend and backend pretty well. I’m not sure it’s the best approach.

Demo: https://cloudup.com/cyNcpgnlaSp

ToDo

• Audit line-height variable overrides to make sure it works consistently for gutenberg and doesn’t negatively impact non-gutenberg variables.
• Consider how child-themes might be impacted by this change.
• Look into setting a default line-height for headings and paragraphs. The editor shows a 1.5 line-height by default despite what the CSS actually has as the default before changing the option.

[jffng]

I agree that I'm not sure this the best approach, as it will likely have unwanted side effects for any styles tied to Varya's --global--line-height variables.

For now, I think trying to scope the changes to the individual block level is best. For example, could we do something like:

p {
  line-height: var(--wp--typography--line-height, --global--line-height-body);
}

Once WordPress/gutenberg#21346 and WordPress/gutenberg#21428 land, we can revisit how to integrate the global styles variables.

I think we should consider supplying a theme.json file as well, so we can override the default values of key global styles variables. cc @kjellr

[allancole]

For now, I think trying to scope the changes to the individual block level is best. For example, could we do something like:

p {
   line-height: var(--wp--typography--line-height, --global--line-height-body);
}

Yeah, this feels like a better approach. I’ll give it a shot 👍

[allancole]

@jffng I rebased this against master and tried your suggestion above—works like a charm. LGTM, if you agree :-)

[allancole]

Look into setting a default line-height for headings and paragraphs. The editor shows a 1.5 line-height by default despite what the CSS actually has as the default before changing the option.

I don’t think there’s a solution for this yet in Gutenberg. but I think we can merge this without it.

[jffng]

LGTM! 🚢

I don’t think there’s a solution for this yet in Gutenberg. but I think we can merge this without it.

Right. Once opt-in support is added for FSE and global styles, we can supply a theme.json file to set the defaults.