Will text elements be unified?

TL;DR because the original post may come off as rude. I’m sorry, I’m just so fed up with every system I’ve been interacting with recently and this is just one part in a series of posts.
Button, InputField, DropdownField and Label all use a different kind of text element which makes it annoying to style consistently. Will we ever be able to style all text with a single CSS/USS(?) selector?

Original ranty post.

Why are there are so many elements that have their own text? Not a text element, but text baked in somewhere.

This makes it increasingly annoying to style text elements consistently. This would be fine if you could use the standard CSS grouping feature, which works, but not in the UI builder. UI Builder just creates a new identical selector, which also is annoying.

The most obvious element for doing this is the Button. If you want to change the label of a button, you need to target the Button type, not Label or Button > Label. So now I have to style my button labels separately from my normal labels. That’s one extra element.
But then there’s the input fields. The text inside the input field is yet another element, this time called TextElement. So that’s three pretty much identical selectors.
Enum fields also share the TextElement element. But then dropdown HAS YET ANOTHER custom text element called PopupTextElement! This is ridiculous and makes working with UI Toolkit a chore and an uphill battle. There’s so much copy-pasting that the styling consistency UI toolkit promises almost reverts back to pre-nested prefabs UI building.

I have been fighting with UI builder and my IDE just trying to work with UI toolkit. UI Builder does not support everything UI Toolkit supports, so I switch over to my IDE, but then UI Builder will UI builder all over my manually coded CSS and UXML, create new duplicate selectors, and ruin any semblance of sense I used to have.

All this to just style my labels.

Hello!

You can use selectors to style labels, for example, all labels in unity come with the .unity-text-element class, making it possible to style all labels with just one selector.

I’m sorry to see you’re frustrated, I’ll report your feedback to the team. Hope this helps!

2 Likes

That does help a ton, thanks! It would certainly be possible to find this by yourself but personally, I never saw that class as a connection between them all, so I assume it wouldn’t be others’ first instinct to style that class either. The first instinct would be to style the obvious one: Label.
Not sure how it could be communicated, but something to tell the developer that .unity-text-element is the way to go would be great!

2 Likes

Hello @Hertzole ,

We hear your feedback about the discoverability of the class. We’re always looking for ways to improve the documentation, and this is something we’d like to address in it.

In the meantime, though, have you heard of our UI Toolkit Debugger? It might be easier for you to find common classes this way, and it’s also a useful tool to preview some changes without re-opening the document in the UI Builder. Hope this helps!

Yup, I’ve used the UI debugger several times. But I just never realized they shared the same class. It may be a personal thing where I easily miss stuff like this, but it feels like this is an easily missable thing.