Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Custom Mixins #960

Closed
drewwells opened this issue Mar 17, 2015 · 3 comments
Closed

Custom Mixins #960

drewwells opened this issue Mar 17, 2015 · 3 comments

Comments

@drewwells
Copy link
Contributor

libsass has the ability to specify custom functions, but not custom mixins (that I'm aware of). Are there plans to enable specifying custom mixins?

I'm hacking custom mixins by either injecting mixins at the beginning of source string or using the custom importer interface. The second one is fine, but does require the developer to include special @import to enable the custom mixin.

Here's an example mixin that gets injected into the source:

@mixin sprite-dimensions($map, $name) {
  $file: sprite-file($map, $name);
  height: image-height($file);
  width: image-width($file);
}
@mgreter
Copy link
Contributor

mgreter commented Mar 29, 2015

This basically boiled down to have custom headers. I implemented something experimental in #1000 to support custom headers. I will paste the relevant parts from the linked issue:

Custom headers (#960) act like importers, but only run once at the beginning of each compilation. They are primarily meant to define custom mixins (via plugins or context options). Beside that they might be usefull for other cool things I currently cannot think of 😄 Opposite to custom importers, all custom headers will be executed in priority order and all imports will be accumulated (so many custom headers can add various custom mixins or css-code).

Here a little preview from my perl-libsass test:

headers => [
  [sub { return [['header-02', 'div { b: .5; }']]; }, .5],
  [sub { return [['header-03', 'div { c: .1; }']]; }, .1],
  [sub { return [['header-01', 'div { @include mixme; }']]; }, .9],
  [sub { return [['mixin-01', '@mixin mixme { a: .9; }']]; }, 1009],
],

@mgreter mgreter modified the milestones: 3.2, 3.4 Mar 29, 2015
@mgreter mgreter self-assigned this Mar 29, 2015
@drewwells
Copy link
Contributor Author

That is AWESOME! Exactly what I was looking for!

@mgreter
Copy link
Contributor

mgreter commented Mar 30, 2015

Merged #1000 which contains a first experimental implementation!

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

No branches or pull requests

2 participants