You can now adjust the font size for most components directly in the Styles settings! Available font size options map to the app's Typography settings for the current theme. You can also click FX to specify a px font size using a custom or dynamic value, such as 11px or h6Font.
Some components with existing text size controls, such as Divider, are unchanged. Font size controls for these components will eventually move to the Styles settings in future updates.
To note in case you haven't come across the app theme settings yet -- you can also customize the default font size for the entire app via the Typography tab of the App Theme! Can save you some time if you don't want to handle each component individually
Unfortunately the legacy Table is now fully deprecated, so it's unlikely to get any future updates! Would encourage you to upgrade to the new Table component if you are able to -- it has a lot of improvements from the old one, including much better performance!
it has no background color control for the Tool Bar and
no strong colors for the Accent Row i.e. when you select a strong color, it gives you a weak version of that color
The "look" of the Legacy Table is much better than the New Table. I have shown samples below. It would be good if we could get someone to work on this.
I wanted to comment on something else. Its the Active Background in the Styles for buttons.
That may have been there earlier but I just noticed it recently. I have converted all my buttons to have this feature in red which clearly shows that a button has been pressed.
This is a great feature.
I do not know if this is new. Maybe I just discovered it. But again I want to thank the developers who came up with this. It is a great feature.
Hello Mckenna, I'm super excited to see that this has shipped!
I tried to apply this to one of our core Retool apps and I've changed the default text from 12px to 20px and yet I don't see any change in the components throughout the app.
Text in some areas has updated, for example buttons in the nav or basic copy sections, but none to the text sizes in any of the components has changed.
So even though in the Styles panel now says it is set to 20px, the font size is still 12px in the app's components. I even tried to change each component individually via the Styles panel and yet there is no change in any of the copy.
The 12px is pretty difficult to read for our users and this update would be super impactful for our community.
Am I doing something incorrectly? What would be the best way to change the font size within the components?
Hi @Gabriel_PYP! What you're doing seems like it should work so I'm not sure Does this issue still persist on refresh? Are you using any deprecated components?
If you are able to send me an export of your app via DM I can take a look!
Mckenna, thanks for getting back to me so quickly!
I've since changed the default to 14px so the text isn't overly enlarged elsewhere but still having difficulty changing in the components themselves. The line height of the components changes and the text fields become larger, but the text remains at 11px, even if it's listed as something larger in the Styles panel.
I don't believe they are deprecated as they have been updated recently from a UI perspective.
The components involved are mostly text inputs.
I would love to share an export w you, I'll try to DM that to you now.