Skip to content

Conversation

@romainmenke
Copy link
Member

@romainmenke romainmenke commented Jul 21, 2023

open-props is something that users will want to combine with postcss-global-data.

However I encountered two issues and then discovered 1 more :

  • referencing npm packages didn't work in postcss-global-data
  • open-props uses the zero specificity :where(html)
  • cascade layers support for postcss-custom-properties had a typo and was broken

Fixing support for npm packages was relatively simple.

Adding support for :where(html) was also straight forward and simplifies the plugin as a whole. Because it now just supports variations of html/:root and checks their specificity.

}

return Infinity;
return 10_000_000;
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Infinity worked, but limited what was possible.
You can't do Infinity - 100 or Infinity * 10.

return;
}

const thisCascadeLayer = cascadeLayerNumberForNode(decl, cascadeLayersOrder);
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cascadeLayerNumberForNode(decl, cascadeLayersOrder);

This looks at the immediate parent, in this case a rule with a selector is the parent of the decl, it will never find a layer rule.

This typo was introduced when updating all three postcss-custom-* plugins. The other two are for at-rules where the immediate parent can be a layer rule.

Changed to : cascadeLayerNumberForNode(rule, cascadeLayersOrder);

@romainmenke romainmenke merged commit 8c0dac2 into main Jul 24, 2023
@romainmenke romainmenke deleted the improve-support-for-open-props--persistent-sea-turtle-631f2b7716 branch July 24, 2023 15:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants