Feedback Please provide a way to remove default classes

There is really no good reason why we can't remove default classes from UIToolkit elements.
The added default classes should follow the same logic and should not be some hidden class. What I mean by that is that we should find these default classes in the XML attribute "class". Like, how every browser works and how our own classes are added too.

I don't want to write a C# script that removes them nor do I want to override the styles! Please stop making excuses for this.

Really, that's my biggest gripe with UIToolkit right now. Otherwise I'm having a good time with it.

 

Agreed, having to remove margin and padding from labels every time I start a project is frustrating.

You can't just target an element by it's UXML name like Label {padding: 0} because for whatever reason it has a class, and class styles always take precedence over UXML name selectors. So now you have to fire up the debugger to see what the class name is so you can then find it in the theme and change it.

But nooo, that would be too easy, wouldn't it? The actual class is defined in unity-theme://default, which is internal and cannot be found in the project folder! So now you are forced to overwrite it in your own theme file. Awesome

 

Hey guys!

This is what is normal in the web development world and I think the same thing applies here: https://meyerweb.com/eric/tools/css/reset/

I use this in my game here:

Code (CSharp):

1. .unity-button {
2.     margin: 0;
3.     padding: 0;
4.     border-radius: 0;
5.     border-width: 0;
6.     background-color: transparent;
7.     overflow: visible;
8. }
9.  
10. .unity-button:disabled {
11.     background-color: transparent;
12.     border-color: transparent;
13. }
14.  
15. .unity-button:hover {
16.     background-color: transparent;
17.     border-color: transparent;
18. }
19.  
20. .unity-button:active {
21.     background-color: transparent;
22.     border-color: transparent;
23. }
24.  
25. .unity-button:focus {
26.     background-color: transparent;
27.     border-color: transparent;
28. }
29.  
30. .unity-label {
31.     padding: 0;
32.     margin: 0;
33.     color: black;
34. }
35.  
36. .unity-disabled {
37.     opacity: 1;
38. }
39.  
40. .unity-text-field {
41.     margin: 0;
42. }
43.  
44. .unity-text-field #unity-text-input {
45.     border-radius: 0;
46.     border-width: 0;
47.     padding: 0;
48. }

Hope it helps!

 

Nice! Thanks @MousePods
That's pretty much what I'm reminded of, the dreaded reset CSS.

To add to this feedback thread. I'd also be okay with getting the default CSS some way. At least I can copy/paste what I need and not look up every single style in the UI debugger or builder. It's just needless, tedious work and I think one of the many reasons the adoption rate of UIToolkit isn't that great, because the transparency of what's going on is needlessly obfuscated. (Probably a relic of UIToolkit being designed for editor only)

Right now the styles are in the "unity editor resources". It can be extracted but then you are left with some asset file that's a Scriptable Object. Make it a default file for UIToolkit, it would make everything so much more transparent.