Polyfill for CSS Mixins level 1, `@function` rule.

[kanashimia]

What would you want to propose?

Spec: https://www.w3.org/TR/css-mixins-1/
This one would be pretty useful and should be easy to polyfill.
Currently available in Chromium for testing.

Suggested solution

To implement this plugin one has to do something as follows:
Inline function contents, mangle local variable names, remember to handle inline media queries and nested function calls.

Additional context

Some examples:
https://una.im/5-css-functions/

With regards to how it resolves variables it is slightly weird.
Spec is in the early stages, I'm sure it will change in the future.

Validations

• Follow our Code of Conduct
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

Would you like to open a PR for this feature?

• I'm willing to open a PR

[romainmenke]

Hi @kanashimia,
Thank you for opening this issue.

I tried to create a plugin for this but got stuck.
I was working on this branch: https://github.com/csstools/postcss-plugins/compare/postcss-custom-functions--amiable-deer-0f9bf424a9

The issue is with typed arguments and typed return values.
How those work is completely novel to CSS and can't be polyfilled with a PostCSS plugin.

I did consider creating a plugin that only processes untyped functions.
But I am unsure how useful that would be.

[kanashimia]

Hello @romainmenke,
Thanks for answering and sharing the code, indeed there are complications around types.
I though they could be mimicked by specifying type of a variable using @property rule for some part, but it seems there are problems, with inherits for example not sure if it could be mimicked as is written in the spec.
I think this would be useful even without supporting typed arguments though.

[Hebilicious]

In the editor draft, there's the beginning of the mixin spec as well. Should this be tracked here as well ?

[romainmenke]

A separate issue would be best as these are separate features :)

[trusktr]

Looks like functions and mixins are a single module now.

I would really love to see support for this, and to see people stop using SCSS as there basically is no need for SCSS nowadays apart from some/older browsers not supporting the latest CSS yet.

Meteor for example is publishing a new version that defaults the new app generator CLI to using SCSS by default, which I feel is not nicely aligned with progress CSS has made, and I'm hoping it can be dead obvious to any similar projects we can simply use CSS today.