No Code Attached Yet
avatar dgrammatiko
dgrammatiko
6 Oct 2023

Joomla's Bootstrap 5 is deviating from the upstream

What?

When Joomla 4 was about to be released for compatibility issues the prefix was dropped.
That was't really a problem till 5.2 as CSS variables were not extensively used. With the release of 5.3 CSS variables are used everywhere and this deviation (basically Joomla's templates have --body-color when upstream, vanilla BS has --bs-body-color) is rather limiting and frustrating.

Solution

Remove the override for the prefix and add a custom root.scss loop were the --body-color links to the vanilla --bs-body-color. Thus b/c is kept and also there's no deviation.

Figure out a way to do the -rgb variables

What?

When I did the upgrade to 5.2 I had to override some utilities because BS is using also a -rgb variable for most colours but the work to incorporate this to the templates was differed for the 5.3 but that work is still pending.

Solution

TBH this one is a little bit more complicated as the colours definitions are in hsl and bootstrap is using rgb. CSS relative colours cannot be used as they're only supported by Safari so there should be some PHP/JS evaluation preferable using cashed values (not running on every request).

avatar dgrammatiko dgrammatiko - open - 6 Oct 2023
avatar joomla-cms-bot joomla-cms-bot - change - 6 Oct 2023
Labels Added: No Code Attached Yet
avatar joomla-cms-bot joomla-cms-bot - labeled - 6 Oct 2023
avatar dgrammatiko dgrammatiko - change - 3 Dec 2023
Status New Closed
Closed_Date 0000-00-00 00:00:00 2023-12-03 19:53:44
Closed_By dgrammatiko
avatar dgrammatiko dgrammatiko - close - 3 Dec 2023

Add a Comment

Login with GitHub to post a comment