Bootstrap 4 and Fontawesome 5

Still progressing on Bootstrap 4. It's a significant upgrade. A lot of usages need to change, but some great news is I should be able to eliminate a good 60% of our custom CSS in favor of Bootstrap 4 classes. This should mean CB will better integrate with your Joomla Bootstrap 4 templates for an even more consistent look. Fontawesome 5 maybe delayed until later since it's such a significant change to the class selectors and breaks a lot of usages (they went from 1 prefix class to 4 significantly breaking backwards compatibility).

I've almost the entire profile canvas layout redone with Bootstrap 4 classes. This eliminates roughly 50% of the custom CSS applied by CB. Check out the progress below.



The biggest takeaway here is the massive improvements to the tab menu and the cb menu bar. Currently there's scrollers that scroll left/right if there's too many menu items. The reason this was done is due to positioning behavior of the menu bars. They had no overflow handling because they couldn't due to absolute positioning offsets. These issues are eliminated entirely and both CB Menu and Tab Menu can overflow perfectly fine allowing for A LOT more menu items to be visible and easily used. The responsiveness of the canvas layout has also been significantly improved (am still making responsive improvements too!) so it can work better on smaller screens.

Out with the old and in with the new. I've redesigned the manage connections tab to be a bit more modern and less old-school table. Check out the difference below.

Old:


New:


The new design is completely responsive and mobile ready. The old design being a table was nearly unusable on mobile devices due to tables being unable to collapse elegantly enough for small devices meaning there was a lot of scrolling just to adjust connection types or add a comment to a connection.

Unfortunately this is taking longer than expected, but just wanted to let everyone know that I am certainly still working on Bootstrap 4 upgrade every day. Who'd of thought it'd take so long to rewrite all of CBs styling, lol! Once done with CBs core I'll start upgrading plugins, which hopefully should go quicker since for most plugins all their HTML is centralized to their template files.

Ok, almost all core usages have been updated. Am working through legacy CSS usages and replacing them where possible. Userlist grid usage is also now a proper responsive grid as I've standardized the canvas layout usage used at top of profile to also be usable for "mini" canvas layouts. Once this is done I can begin updating the styling in various plugins. So it's looking like CB 2.2 and plugin styling updates should hopefully be done by end of this month. So basically 1 month longer than I expected.

With that said I'll be holding off on Fontawesome 5 since it's a pretty massive rewrite in it self as well. Will consider Fontawesome 5 later down the road, but for now we'll stick to Fontawesome 4. FA5 has really made it a nightmare since they completely broke all backwards compatibly due to multiple namespace classes instead of single .fa class.

Big update today! Core CB Bootstrap 4 upgrade is complete. All of core CB is now Bootstrap 4 ready. I'll be starting the upgrade for plugins today and onwards. I hope all the plugin upgrades will go pretty smoothly and be done this month. Once the plugins are done we'll be releasing all of this at once so everyone can update in 1 go and be ready to use Bootstrap 4. Fontawesome 5 is still on hold as adding that on top of this upgrade is simply too much and there isn't really a need for Fontawesome 5 at this time.