Joomla 4 Backend layout styling overriden by CB loading bootstrap css

1 year 3 months ago #332681 by tlwebdesign
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

Please Log in to join the conversation.

1 year 3 months ago #332693 by krileon
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.


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.

Please Log in to join the conversation.

1 year 3 months ago #332699 by tlwebdesign
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.

Please Log in to join the conversation.

1 year 3 months ago #332703 by krileon
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


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.

Please Log in to join the conversation.

1 year 2 months ago #332961 by krileon
This is now fixed in latest CB build release. Have rescoped our Bootstrap variables to .cb_template instead of :root.


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.

Please Log in to join the conversation.

1 year 2 months ago #332963 by tlwebdesign
Thats awesome! Thanks :) excited to see what TailwindCSS will bring to CB :)

Please Log in to join the conversation.

Moderators: beatnantkrileon
Time to create page: 0.218 seconds

Facebook Twitter LinkedIn