As designed Editing CSS Templates Reverts Style Properties If Not Refreshed When Calling Style Properties

[Amaury]

This is likely as designed, but I feel as if a warning could be useful, telling you that your changes will revert your style property changes if you do not go out of and back into the template.

Scenario: You call style properties for custom CSS in EXTRA.css (or any CSS template), such as:

.prefix.prefixPrimary {
    {xen:property titlePrefix
}

Which, when you go out of and back into the template, turns into:

.prefix.prefixPrimary {
    @property "titlePrefix";
    color: @secondaryDarker;
    background-color: @secondaryLighter;
    padding: 0px 6px;
    margin: -1px 0;
    border: 1px solid @secondaryLighter;
    border-radius: 4px;
    display: inline-block;
    @property "/titlePrefix";
}

Color varying on what you've chosen, of course.

You don't refresh and it still looks like the first bit of a code above. Let's say you decide you want the background to be controlled by @tooltipBackground. You make the necessary change to the style property and come back to EXTRA.css, make a change to something else not even related to prefixes, and save. You notice your prefix styling seems to have reverted and go back to the Title Prefix style property to discover the background is being controlled by @secondaryLighter again.

It appears saving EXTRA.css without going out of and back into it after calling a style property was the cause.

 

[Mike]

This would be as designed: when you're saving the template, you're more or less saying that's what you want to output to be. I don't think a warning really provides value here to be honest.