I have to include the “tailwind_theme/tailwind.css” file for styles to work in the Gutenberg editor. Pinegrow suggests to include “tailwind_theme/tailwind_for_wp_editor.css” but when I do, the styles are not working at all.
I’m sure Pinegrow can speak to this better than I can, but the issue really comes down to two things;
- WordPress uses its own stylesheet in the Block Editor rather than the stylesheets that load on the front end. Tailwind has some oddities (see below), so Pinegrow created that “tailwind_for_wp_editor.css” file to help bring some styles back. Unfortunately, it isn’t going to include everything, so you may have to supplement it with your own styles to get things to look the same in the front end and the back end.
- Tailwind resets nearly every style by default unless you tell it not to use its “preflight” reset. (You can set this in Pinegrow’s design panel). The reset is great when you are styling pages and templates manually, but it causes issues with the block editor which has its own stylesheet.
1 Like
The problem is that when only “tailwind_for_wp_editor.css” is active, there are no styles at all. No sizes, no colors, no flex/grid.
@MichelyWeb @Adryan yes, this was a bug. The stylesheet was not generated in the plugin. Fixed now, will be out soon.
3 Likes
I can confirm that the update to version 1.0.9 has fixed the problem. The file “tailwind_for_wp_editor.css” is now generated correctly and can be used.
Thank you very much.
4 Likes