Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add automatic stylesheet enqueuing #255

Merged
merged 7 commits into from Mar 21, 2019

Conversation

Projects
None yet
3 participants
@lukecarbis
Copy link
Member

lukecarbis commented Mar 18, 2019

This is a much neater way to do block styles.

On the frontend, Block Lab will enqueue the first of these stylesheets, for any blocks used on the current page:

  • {child theme directory}/blocks/css/block-{block name}.css
  • {child theme directory}/blocks/block-{block name}.css
  • {parent theme directory}/blocks/css/block-{block name}.css
  • {parent theme directory}/blocks/block-{block name}.css

In the editor, Block Lab will enqueue the first of these stylesheets, for all blocks (since any one of them could be inserted at any point):

  • {child theme directory}/blocks/css/preview-{block name}.css
  • {child theme directory}/blocks/preview-{block name}.css
  • {child theme directory}/blocks/css/block-{block name}.css
  • {child theme directory}/blocks/block-{block name}.css
  • {parent theme directory}/blocks/css/preview-{block name}.css
  • {parent theme directory}/blocks/preview-{block name}.css
  • {parent theme directory}/blocks/css/block-{block name}.css
  • {parent theme directory}/blocks/block-{block name}.css

Please test each possibility!

@lukecarbis lukecarbis self-assigned this Mar 18, 2019

@lukecarbis lukecarbis requested review from RobStino and kienstra Mar 18, 2019

@RobStino

This comment has been minimized.

Copy link
Collaborator

RobStino commented Mar 18, 2019

:slow_clap:
This is so cool man! Such an elegant solution (to be tested) to styling for blocks!
Bonus points for the conditional enqueueing on the frontend!

@lukecarbis lukecarbis changed the title Add automatic stylesheet enqueuing [WIP] Add automatic stylesheet enqueuing Mar 18, 2019

@lukecarbis

This comment has been minimized.

Copy link
Member Author

lukecarbis commented Mar 18, 2019

Do not merge until I've written unit tests, which I'll do once #233 is merged.

@lukecarbis lukecarbis changed the title [WIP] Add automatic stylesheet enqueuing Add automatic stylesheet enqueuing Mar 18, 2019

@lukecarbis

This comment has been minimized.

Copy link
Member Author

lukecarbis commented Mar 18, 2019

Okay, @kienstra ready for you to review and merge.

@RobStino

This comment has been minimized.

Copy link
Collaborator

RobStino commented Mar 18, 2019

Tested all variations of file locations and everything works great!

@kienstra
Copy link
Collaborator

kienstra left a comment

Approved

Hi @lukecarbis,
Great idea to enqueue styling for the blocks. The styling appeared as expected:

styling-appears

There's a question below, but not a blocker to merging if you're satisfied.

*/
$missing_schema_attributes = array_diff_key( $block['fields'], $attributes );
foreach ( $missing_schema_attributes as $attribute_name => $schema ) {
if ( isset( $schema['default'] ) ) {
$attributes[ $attribute_name ] = $schema['default'];
}
}
block_lab_enqueue_styles( $block['name'], 'block' );

This comment has been minimized.

Copy link
@kienstra

kienstra Mar 18, 2019

Collaborator

Would this method fit well in the Loader class, instead of php/helpers.php? Though maybe it'll later be used in other classes, I'm not sure.

This comment has been minimized.

Copy link
@lukecarbis

lukecarbis Mar 19, 2019

Author Member

Great idea – done in 6148de0.

Show resolved Hide resolved tests/php/test-helpers.php Outdated
@RobStino
Copy link
Collaborator

RobStino left a comment

Tested with all file variations and all worked as expected. Great work!

@lukecarbis lukecarbis dismissed stale reviews from RobStino and kienstra via 6148de0 Mar 19, 2019

@lukecarbis

This comment has been minimized.

Copy link
Member Author

lukecarbis commented Mar 19, 2019

@kienstra Could you please review 6148de0?

Change name of function to the method
block_lab_enqueue_styles() was moved inside
class Loader.
So change the call to $this->enqueue_block_styles().
@kienstra
Copy link
Collaborator

kienstra left a comment

Approved

Hi @lukecarbis,
Sorry for the delay. This looks good, and the block stylesheet still appears as expected:

stylesheet-enqueued

@lukecarbis lukecarbis merged commit 3166feb into develop Mar 21, 2019

@lukecarbis lukecarbis deleted the feature/auto-enqueue-css branch Mar 21, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.