-1

I've created my website that compiles my scss (boostrap, node_modules, my own custom css) to a single file. Now I'm wondering what would be the best way of styling gutenberg blocks in the editor?

I want to keep the responsive nature of my blocks from bootstrap and my styling what would be the best approach to do this?

Astrid
  • 105
  • 10
  • 2
    This question should probably be on https://wordpress.stackexchange.com, which is why it's being down-voted. But you'll find this article really helpful in terms of how to enqueue your SASS for Gutenberg (and other things): https://www.billerickson.net/building-a-gutenberg-website/ – Michelle Jun 26 '19 at 18:41
  • Ah I see, thank you.That article really helped! – Astrid Jun 26 '19 at 18:45
  • 1
    I'm voting to close this question as off-topic because it belongs on wordpress.stackexchange.com – random_user_name Jul 08 '19 at 23:04

1 Answers1

2

If I'm understanding correctly, you want the CSS file for the front-end of your site to also apply to the block editor?

If so, that's as simple as adding add_theme_support('editor-styles'); in your theme files (such as in functions.php).

I find it helpful to create a second block-editor stylesheet to use only in the editor. Sometimes I find the media query breakpoints are too different or just need to tweak the front-end styles a little for the editor. For that file, you can use wp_enqueue_script() on the enqueue_block_editor_assets action hook so it applies only to the editor.

Mattimator
  • 36
  • 2