Hello,
I’m trying to activate Tailwind css on an existing project but I noticed that the Tailwind classes aren’t showing in the active panel when I select an element. I also noticed Pinegrow did not create the Tailwind theme folder. Did I select the wrong option when activating Tailwind?
Did you activate the Design panel?
Where would I find the option to activate the design panel? FYI: This is Pinegrow Desktop on Mac
Click the Pallet icon and if you see a color pallet, then it is activated.
Sorry, that was the only idea I had. I never tried adding a framework to an existing site.
1 Like
I probably should have posted in the bug report section.
With Pinegrow, you can incorporate Tailwind CSS into an existing HTML project without any issues. However, attempting to add Tailwind CSS on top of a Bootstrap project (or any other framework) can cause disruptions (in the space-time continuum 
) and lead to a situation that should NEVER occur.
Because Pinegrow does not prevent this mixing (yes, this is your responsibility), If you truly want to add Tailwind CSS to a project that previously used another framework, before making any changes, you should eliminate all references to the other framework from your project (CSS, JS, etc.). Even after doing so, any references to the framework specific classes will still exist in your templates, which is not advisable.
I tested today, the result is in this video, in French, but with English subtitles.
1 Like
Hello,
I’m not sure how the Bootstrap folder got into the project but I removed it. Nothing in the project references it.
According to your video, Pinegrow created the Tailwind theme folder when you activated the design panel. What if the design panel was activated before Tailwind was added? What are the steps to get Pinegrow to create the theme folder? Is there a refresh option?
In fact, the design panel can be activated not only for Tailwind CSS, but also for Bootstrap, and finally, for any of your HTML projects.
If you had activated it BEFORE, it is highly possible that there was an unlikely mix that occurred between the settings related to Bootstrap and those related to Tailwind CSS, which may have led to the malfunction you mention.
Obviously, at the moment I am speaking to you, I do not have absolute certainty since I have never encountered this issue, but given that in a standard setting, the process behaves normally, there is probably a reason of this kind at the origin of your problem.
If - for some reason - you had already activated the design panel in your project before deciding to use Tailwind CSS, it would have been a good idea to deactivate it prior to making the change.
Note: the dropdown menu next to the “Surprise me!” button allows you deactivate the Design panel for the project.
Deactivating the design panel resulted in Pinegrow closing the project. When I reopened the project, all of my work was gone.
Hello @MageHD
First, the project should automatically reload and there may be a tiny bug there, but there is no code in Pinegrow that would delete project content like this.
Also, the name of the project in one of your earlier images is different from the empty project shown in your last image. Are you absolutely sure you didn’t open another project?
I just tested the process (video on demand) that confirms the small bug causing the project to close with the need to reopen it from the dashboard (already fixed for the next version) but upon reopening my project, I can confirm that no files are deleted after deactivating the design panel.
Hey @Emmanuel , I think you’re right. The project I was using closed but didn’t reopen. Since the thumbnails look the same, I think I opened the wrong one. I did re-open the other project and the tailwind theme folder is there.
I appreciate your time and patience on this.
Side note: how can I update the thumbnails for a project?
BTW, this issue is solved. 
Awesome.
Glad everything turned out okay 
As for the screenshot, it’s taken if there are any changes in the last document opened and saved before closing the project.
1 Like