Search Unity

Bug [UIBuilder] USS rules grouping is not preserved on save.

Discussion in 'UI Toolkit' started by MoruganKodi, Apr 23, 2020.

  1. MoruganKodi

    MoruganKodi

    Joined:
    Feb 11, 2015
    Posts:
    79
    In CSS you can declare multiple targets affected by a single rule via grouping, using a comma.
    Code (CSS):
    1.  
    2. .class, .class .nested-class
    3. {
    4.       /* rules */
    5. }
    I wrote the following under the above expectation.
    Code (CSS):
    1.  
    2. .std, .std .unity-button
    3. {
    4.     background-color: rgba(194, 194, 194, 0.5);
    5.     margin-left: 2px;
    6.     margin-right: 2px;
    7.     margin-top: 2px;
    8.     margin-bottom: 2px;
    9.     border-top-left-radius: 3px;
    10.     border-bottom-left-radius: 3px;
    11.     border-top-right-radius: 3px;
    12.     border-bottom-right-radius: 3px;
    13.     border-left-width: 1px;
    14.     border-right-width: 1px;
    15.     border-top-width: 1px;
    16.     border-bottom-width: 1px;
    17.     border-left-color: rgba(255, 255, 255, 0.1);
    18.     border-right-color: rgba(255, 255, 255, 0.1);
    19.     border-top-color: rgba(255, 255, 255, 0.1);
    20.     border-bottom-color: rgba(255, 255, 255, 0.1);
    21. }
    22.  
    As you can see, I have a class named std (which I intend to use as a standard style for my entire UI),
    but I also want the same style to apply to all buttons nested below this class.

    This works when you load it into UIBuilder the first time, and the styles of std and unity-button are synchronized as I expected (but are still displayed as seperate rules, even though they synchronize).

    The problem is what happens if you make a tweak and then hit the SAVE button.

    After a save, .std and .std .unity-button become separated into two separate USS rules, with exactly the same properties, and so my USS file now looks like this.
    Reloading the UXML at this point now styles them separately as two separate rules, when multi-targeting is expected.

    After saving the above USS via UIBuilder, the result is this:
    Code (CSS):
    1.  
    2. .std
    3. {
    4.     /* stuff */
    5. }
    6. .std .unity-button
    7. {
    8.     /* stuff, identical to .std */
    9. }
    10.  


    Edit:
    - Unity 2020.1.0b2
    - UIBuilder 0.10.2
     
    Last edited: Apr 23, 2020