Hi guys, I noticed after the update to 2.2, the font has become very very small.
Bootstrap 4 uses rem font sizing. The way rem sizing works is it sizes based off its root element. This would be html element. Your template has likely set a small font size (12px most likely) on the html element of your site. This will cause all font in CB to be based off that. To fix this you need to fix your Joomla templates font size. Check if your template has a parameter for this or if your Joomla template allows custom CSS to apply your fix there.
It is important that templates do not apply a font size to the html element as it breaks scale-ability of devices. The reason you're seeing this now is the font-size reset on cb_template class used to be 14px. That meant it never scaled based off your root element, the agent, or the view size. Now it's reset to 1rem and the way rems work is they're just a multiple of the root size. So if the root size is 12px and CB resets to 1rem then the size is 12px. In short the small font you're seeing is the font size that had always been there; it's just working now.
As a workaround you can force your Joomla template back to properly inheriting from browser agent using the below CSS.
Code:
html {
font-size: inherit !important;
}
Also notice that in User Management the Search box spreads wider than screen width which makes it almost impossible to see what you are typing in the search box.
It's not possible for search inputs to expand outside the window. The backend is entirely responsive. If it is then you likely have some sort of styling conflict from a custom backend template or custom CSS you've added.
When entering a name in the box and pressing enter I get the following in a popup box:
xml name cbfr_usersbrowser_filter_plan_id is undefined. It is cbHideFields[0][0].
Am not able to confirm and wouldn't have anything to do with Bootstrap 4 upgrade either. Please open a support topic if issue continues after ensuring everything installed is up to date.
But that affects the backend as well as the frontend. Any way of just updating the frontend only.
Yes, use more specific CSS. Frontend has container classes surrounding all the views. You can also use Joomlas .site selector to prefix your CSS to target frontend only. Examples as follows. This assumes your Joomla template is properly adding the base body classes.
Frontend:
Code:
.site .test {
color: red;
}
Backend:
Code:
.admin .test {
color: red;
}
Folks, please stop posting support issues here. Create support topics in the support forums.
krileon
