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

Trying to implement new rule for scss #52

Closed
ChrisKam opened this issue Jan 28, 2015 · 2 comments
Closed

Trying to implement new rule for scss #52

ChrisKam opened this issue Jan 28, 2015 · 2 comments

Comments

@ChrisKam
Copy link

Hey Tony, thank you for all your awesome work on this and on CSSComb. My question does concern CSSComb but I'm pretty sure I can solve it myself once I learn how to add a new rule to gonzales-pe, more specifically I need to differentiate between @include one-liners like

@include font_size(0.85);

and multi-line includes like

@include breakpoint($breakpoint_tablet) {
    width: 50%;
}

This is actually already implemented internally by the standard checkInclude(i) function in the rules.js portion for SCSS by this function

    /**
     * Check if token is part of an included mixin like `@include nani(foo) {...}`
     * @param {Number} i Token's index number
     * @returns {Number} Length of the include
     */
    function checkInclude1(i) { ...

I would just need to make a rule to make this check seperately without lumping in all the other @include cases. In CSSComb, I could then do something like

if(currentNode[0] === 'include-multi-line') { ... }

I have tried hacking this in but I never made it execute up to the point of my custom function. I'm a total node.js noob unfortunately. Any help on this would be immensely appreciated, CSSComb now does almost everything I need perfectly :)

@tonyganch
Copy link
Owner

You can check if include node contains block in its content.
For example, from within dev branch:

var isMultiline = function(include) {
    return include.content.some(function(block) { return block.type === 'block' });
};

var css, include;

css = '@include font_size(0.85)';
include = gonzales.parse(css, { syntax: 'scss', rule: 'include' });
isMultiline(include); // returns `false`

css = '@include breakpoint($breakpoint_tablet) { width: 50%; }';
include = gonzales.parse(css, { syntax: 'scss', rule: 'include' });
isMultiline(include); // returns `true`

CSScomb will be moved to dev branch of this parser in a week or so.

@ChrisKam
Copy link
Author

Thank you for your super quick response, this solves it for me! I actually did something very similiar (though ugly and hack-ish), see: https://gist.github.com/thebugs/977813e0040a4145cf9d

I will reference your answer there as well.

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

No branches or pull requests

2 participants