[SOLVED] RockPageBuilder .block class collides with tailwind

[dotnetic]

In the version 5.0.0 of RockPageBuilder, there is an unprefixed .block class in the less file.
It collides with the .block class from TailwindCSS.

It would be nice if this could be prefixed, so this error does not occur (see red rectangles).

[bernhard]

Thx. Please check out v5.0.4 and mark this thread as solved 🙂 

[dotnetic]

Wow. Not 20 minutes later and after a little discussion @bernhard fixed this. Thank you very much.

[Denis Schultz]

Quote

Wow. Not 20 minutes later and after a little discussion bernhard fixed this. Thank you very much.

yeah it is scary ^^

[bernhard]

Just now, Denis Schultz said:

yeah it is scary ^^

Tailwind? I agree 😄 

[Denis Schultz]

I edit my response above, you are scary 😉

[Jonathan Lahijani]

14 hours ago, bernhard said:

Tailwind? I agree 😄 

If you dabble in Tailwind some more, I strongly recommend using Flowbite, which is still pure Tailwind but with an added JS library that makes it more batteries included like UIkit and Bootstrap.  Also there are free and premium blocks and layouts which I've purchased that speeds things up considerably while maintaining the flexibility of Tailwind.  To me, it's the winner of the all the various Tailwind competing user interface kits (ie compared to Preline, Tailwind UI, Daisy UI, etc.).

[bernhard]

7 hours ago, Jonathan Lahijani said:

If you dabble in Tailwind some more, I strongly recommend using Flowbite, which is still pure Tailwind but with an added JS library that makes it more batteries included like UIkit and Bootstrap.  Also there are free and premium blocks and layouts which I've purchased that speeds things up considerably while maintaining the flexibility of Tailwind.  To me, it's the winner of the all the various Tailwind competing user interface kits (ie compared to Preline, Tailwind UI, Daisy UI, etc.).

Thx @Jonathan Lahijani that looks indeed interesting. It's the first library that I see that made me feel it could be a good replacement for UIkit. All the others felt like a step back imho, even though the utility classes are great for sure and make it super fast and fun to develop.

I see two problems though:

• npm install ........ They also offer a CDN Version. Do you have any experience with it? Is that a viable option or is that tremendously huge? I guess they need to add all the css to those files which is obviously less performant than compiling only necessary classes. The thing is with a CMS or a PageBuilder you often don't know what you need upfront, so I really like to include UIkit once and forget it.

• No Building Tools for Others: You can't use the download files to create End Products meant for End Users to build their own projects using the download files or derived content. --> That's a pity. It would have been great to rebuild some components for RockPageBuilder...

What are the reasons why you prefer it over UIkit?

[Jonathan Lahijani]

9 hours ago, bernhard said:

Thx @Jonathan Lahijani that looks indeed interesting. It's the first library that I see that made me feel it could be a good replacement for UIkit. All the others felt like a step back imho, even though the utility classes are great for sure and make it super fast and fun to develop.

I see two problems though:

• npm install ........ They also offer a CDN Version. Do you have any experience with it? Is that a viable option or is that tremendously huge? I guess they need to add all the css to those files which is obviously less performant than compiling only necessary classes. The thing is with a CMS or a PageBuilder you often don't know what you need upfront, so I really like to include UIkit once and forget it.

• No Building Tools for Others: You can't use the download files to create End Products meant for End Users to build their own projects using the download files or derived content. --> That's a pity. It would have been great to rebuild some components for RockPageBuilder...

What are the reasons why you prefer it over UIkit?

For Flowbite's Javascript file, I just load that file manually.

For CSS, I didn't realize they have a ready-to-go CSS file as well, but that seems kind of pointless since Tailwind (similar to UIkit and Bootstrap) would require a build process for it to be customizable.  I simply use Tailwind CLI directly (without NPM).  But as you mentioned, given the nature of how Tailwind works whereby it will only include classes if they are used, it makes using it for a page builder more complicated unless you safelist a bunch of classes.

As far as not being able to use Flowbite for end products, yea that's a downside.  But I don't think there's a problem configuring a page builder / RPB with blocks for a specific client and not general use.

I'm preferring it over UIkit these days because doing CSS using pure utility classes has won me over as opposed to a mix of utility classes/separation of concerns (UIkit, Bootstrap) vs. pure separation of concerns.  For example, I like that I can copy a block from Flowbite without any thought of it not working or having other styles in the cascade affect it, but at the same time having full flexibility to change it easily.  Tailwind also just makes more sense for designs where you have to "color outside the lines" of a CSS framework like UIkit.

It's horrific to look at all those classes when using it initially, but then you get used to it.