I’d love to see support for an editable tailwind.config.js and tailwind.source.css using the built-in compiler.
The built-in design panel for Tailwind doesn’t give me quite as much flexibility as I’d like, but I rarely need the full power of an external build process. I don’t make many modifications, but the ones that I regularly do require me to configure and use the external build process. I’m lazy so I’d rather not do that
Here are the things I typically do:
Add the fluid typography plugin and create rules to apply them to heading elements using “:where(h1)” syntax
Modify the screens to remove 2xl
Center containers (sometimes)
Add default container padding (sometimes)
I’m definitely not doing anything crazy here and I’m sure the community would appreciate a little more design flexibility for Tailwind. I don’t think we need to be constrained by controls in the design panel, which is why I’m suggesting a way to modify the configuration and style files.
@adamslowe using TW plugins such as Fluid Typography makes it very difficult to use built-in compiler. These plugins are anyway installed with npm and require all the associated setup. I have no idea how to support that with a built-in compiler.
I figured that would be the answer re: TW plugins, even though it isn’t what I wanted to hear. I assume base, components, and utilities are safe, though, right? Does the theme section of config and the TW CSS file present similar issues?
Using the external build process is the way to go, for now. Adding a new way of plugging customizations to the internal TW build process would add more support, maintenance and documentation burden. We have enough existing features that need more attention already
I came here today to request a very similar feature (especially because the Tailwind CLI Windows External Build does not work in Pinegrow for me). I don’t need to support external plugins at the moment but, would it not be possible to have a large text area field (like the new ones used for the PHP action in WP) added to the TW settings UI that would just inject our extend: {} code into your internal tailwind.config.js file? This would at least give us the ability to update(extend) default TW settings which would open up a lot more customizability.
I really don’t want to run an external build (assuming it actually works in the future) b/c it’s just a whole other thing to teach/train/learn plus the annoyance of always having to start up a watcher but I would really love the ability to at least extend TW from the internal built-in builder.
I’m glad to see I’m not the only one wanting features to be able to utilize more of TW. -Thanks
@jonroc - I understand the reasoning behind their decision to limit the customization with the internal build process. Is is inconvenient? Yes. But supporting theme customizations opens up a huge can of worms both from a technical and a support perspective. Pinegrow fields enough support requests from their product without opening themselves up to every question about how to do “x” in Tailwind. Keeping the customization limited allows them to have some semblance of a baseline for support.
As for the external build process, I haven’t tried it with the standalone executable but it works just fine with NPM. The Pinegrow docs for the external process are a bit scattered at the moment so there isn’t a single tutorial that says “here is how you get it working.”
I’ve been meaning to record a walkthrough for my team so we have a standard process. I’ll try to get something out early next week and I’ll post it to this forum.
Thanks, I get not wanting to support it but the extend functionality is pretty simple and there is not much to support. You just put in the name of the thing you want to extend and then update it’s values. I totally understand not wanting to support plugins though.
I don’t need Node.js and to have my entire team install it just for tailwinds seem really excessive. The CLI for tailwinds works fine it’s just that PG does not properly pickup up the changes made to the file after the CLI has updated it with the new CSS. I really don’t want to install node.js just for one application when the Tailwinds CLI works just fine if only PG could see its updates and update the visual editor I could at least customize TW without having to add node.js to our workflow.
Do you have to set a watcher in Node.js everytime you open a new PG project? Or is there way that it can autostart when the file is opened? That’s one great thing about the internal PG builder. -Thanks!
I hope you’re doing great!
Is there any chance you could add support for manipulating the tailwind.config.js file within PG editor?
You know, one of the things that make frameworks like Bootstrap so popular is their ready-made components. They save so much time and effort. But here’s the thing—I believe Tailwind CSS has the potential to go even further in this regard.
If we could modify the tailwind.config.js file, it would open up a world of possibilities. We could tap into the amazing collection of external plugins created by the Tailwind CSS community. These plugins offer a huge range of pre-designed components that we could simply plug into our projects.
I know you ca go the go the external build way but in that case you just stick to VS.
The only way to do it without NPM that I’m aware of is by using the standalone cli build. I haven’t tried using that in conjunction with Pinegrow, but it sounds like an interesting idea to explore.
Edit: As @TechAkayy pointed out below, that only works for the typography and form plugin. Oh well…
The problem when using external build compiler was that when I switched back to the internal build compiler, doing a save would not generate the editor stylesheet. So my WP theme was styled-less… I should try again…
