Skip to content
This repository has been archived by the owner on Dec 19, 2024. It is now read-only.

Add postcss-apply plugin #291

Merged
merged 1 commit into from
Jun 28, 2016
Merged

Conversation

pascalduez
Copy link
Contributor

Hi,

I'm not 100% sure about the plugin order, since it's supposed to be really similar with the custom properties one, I placed it next.
So basically all other transformations will happen on the applied rules, instead of the stored rules. Maybe in case of huge sets usage it could have an impact?

I added tests locally to the plugin to ensure it doesn't interfere with the custom properties one.

Refs #203

@kevinSuttle
Copy link

Looking forward to this landing.

@zeke
Copy link

zeke commented Jun 23, 2016

So exciting!

@@ -54,6 +54,9 @@ title: cssnext - Use tomorrow’s CSS syntax, today.
<a href="/features/#custom-properties-var">custom properties & <code>var()</code></a>
</li>
<li class="r-Grid-cell r-minS--1of2">
<a href="/features/#custom-properties-set-apply">custom properties set & <code>@apply</code></a>
Copy link
Contributor

Choose a reason for hiding this comment

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

&amp;?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Replicated from above, but probably better that's right.

@pascalduez pascalduez force-pushed the features/postcss-apply branch from 7cdb0a2 to 5324e5c Compare June 23, 2016 23:34
@MoOx
Copy link
Owner

MoOx commented Jun 28, 2016

Will this works with custom props referenced in the spec like this?

:root {
  --toolbar-theme: {
    background-color: hsl(120, 70%, 95%);
    border-radius: 4px;
    border: 1px solid var(--theme-color late); /* IS THIS SUPPORTED */ ?
  };
  --toolbar-title-theme: {
    color: green;
  };
}

.toolbar {
  @apply --toolbar-theme;
}
.toolbar > .title {
  @apply --toolbar-title-theme;
}

I guess it don't since apply transformation is applied after custom props. But maybe I am missing something.

@pascalduez
Copy link
Contributor Author

Will this works with custom props referenced in the spec like this?

I added some tests to the plugin for this very use case, seems okay to me: https://github.com/pascalduez/postcss-apply/blob/master/test/integration.test.js#L136-L227

Custom properties (single) are correctly parsed and replaced inside the custom properties (set), provided the plugins are in this PR order.

@MoOx
Copy link
Owner

MoOx commented Jun 28, 2016

Looks good enough. Thanks for this feature.

@MoOx MoOx merged commit d27d15b into MoOx:master Jun 28, 2016
@MoOx
Copy link
Owner

MoOx commented Jun 28, 2016

Released as 2.7.0.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants