Joomla 4 Backend layout styling overriden by CB loading bootstrap css

Hi,

When i install CB on a J4 site. it messes with the CSS of the cassiopeia template. The colors of the tab change throughout the whole template, and also the new button is messed up (probably more than that). It comes because the cb system plugin is loading default bootstrap colors and it ignores the template's styling then.

To me this seems unintentional and unwanted no? 

Kind regards,

Tom

There's nothing we can do about this. That's just how CSS variables work. They're attached to :root. You're welcome to modify CBs bootstrap CSS file below, but your changes will be lost when you update CB.

components/com_comprofiler/plugin/templates/default/bootstrap.css

With CB 3.x we'll be moving away from Bootstrap to TailwindCSS which should resolve root CSS variable conflicts, but I don't have a solution beyond modifying the file.

Sorry i was not completely clear i said cassiopeia. i meant the backend template. it is loading bootstrap also in the backend but there is no need for that is there?

There is however an easy way to fix this. Upgrade to Bootstrap 5. I mean BS5 has been in joomla since beta stages. and it was anounced two years ago. The changes are minimal but still you prefer to load bs4 in the backend where this is completely unnecessary and it is breaking joomla backend UI.

That means CB is not J4 compatible. else it would not touch default Joomla Backend UI.

CB is using Bootstrap for backend and frontend so yes it's normal to load in backend.

There is however an easy way to fix this. Upgrade to Bootstrap 5. I mean BS5 has been in joomla since beta stages. and it was anounced two years ago. The changes are minimal but still you prefer to load bs4 in the backend where this is completely unnecessary and it is breaking joomla backend UI.

CB and all our products combined codebase is basically as large as Joomla itself. It's a complete rewrite thanks to BS5 destroying backwards compatibility. It's not a simple upgrade. We are also planning to move to TailwindCSS so we don't see a huge point in doing all this UI rewriting to have to do it again soon after.

The changes are minimal but still you prefer to load bs4 in the backend where this is completely unnecessary and it is breaking joomla backend UI.

They do not break backend. It impacts 5 CSS variables that adjust colors and nothing more.

That means CB is not J4 compatible. else it would not touch default Joomla Backend UI.

I do not agree.

I will review trying to rescope our Bootstrap 4 CSS variables, but it will depend highly on what that will break within CB itself.

forge.joomlapolis.com/issues/9123

This is now fixed in latest CB build release. Have rescoped our Bootstrap variables to .cb_template instead of :root.

Thats awesome! Thanks excited to see what TailwindCSS will bring to CB