Mixins with shorthand properties
pedro-pedrosa opened this issue · comments
Not sure if this could be seen as a bug since it's doing what's technically expected from a javascript point of view but not from a CSS point of view.
Consider you have a mixin that declares a value for a property like marginBottom or flexGrow. Now suppose you want to override the mixin by specifying a shorthand property like margin or flex.
In CSS, if a more specific rule uses a shorthand property, it overrides all the corresponding sub-properties. However, with typestyle, if you extend or style using overriding mixins patterns like this, it may not work as expected, depending on the order in which the properties are printed to the <style> element.
See this example.
Possible duplicate of this issue.
I see why it could appear to be the same issue, however I'd like to emphasize the use case I'm facing where I'm trying to override an existing style through extend or style with multiple arguments.
I guess in the end it boils down to what is the expected semanthics of extend: merge or override. I think override is the behavior that matches CSS the best.
This issue is solvable by using the long hand properties which should override properly. A design choice in FreeStyle and therefore in TypeStyle is to sort the properties as a way to determine uniquenss. While I can sympathize with the desire to expect that TypeStyle behaves exactly like CSS, we have designed it to support a subset of the features in order to keep it simple and straightforward.
As it stands, there isn't a way to meet your request without breaking backward compatibility and reimplementing FreeStyle.