stackcss / postcss-prefix Goto Github PK

View Code? Open in Web Editor NEW

4.0 4.0 5.0 24 KB

Prefix CSS selectors

License: Other

JavaScript 62.74% CSS 37.26%

postcss-prefix's People

Contributors

Stargazers

Watchers

Forkers

ahdinosaur toddself ajoslin jakeburden gmaclennan

postcss-prefix's Issues

Add Travis tests

I think it would help ensure the tests aren't failing. Note that tests are failing in the latest release on node 5 (#12)!

Missing the license

I can't the license information of this package, providing it would be better.

prefixes shouldn't be applied to psuedo-class arguments

trying to use the :nth-child pseudo-selector and its not working as expected:

.row {
  border: 1px solid black;
}

.row:nth-child(odd) {
  background-color: #eee;
}

<div>
<div class="row">yo!</div>
<div class="row">dude</div>
</div>

Should produce:

However, when you do this with sheetify, the transformed CSS looks like:

._ffdf2d5a .row {
  border: 1px solid black;
}
._ffdf2d5a .row:nth-child(._ffdf2d5a odd) {
  background-color: #eee;
}

Which does not apply the rule to the odd nth-children. If you add a rule in your inspector omitting the ._ffdf2d5a prior to odd:

._ffdf2d5a .row:nth-child(odd) {
  background-color: #eee;
}

It works as expected.

Keyframes: prefix the name of the keyframe and all references to it in `animation` declarations

I don't think there's much trick to this, besides making sure we can properly parse an animation: declaration. Hopefully our current AST implementation already does that for us.

support styling top-level element with :host

from stackcss/sheetify#22 (comment),

/* This: */
:host { color: green; }
:host(:hover) { color: blue; }
/* Becomes: */
.prefix { color: green; }
.prefix:hover { color: blue; }

Tests fail on node 5

$ nvm version
v5.12.0

> [email protected] test /Users/cjhowe7/Desktop/postcss-prefix
> tape test/index.js

TAP version 13
# postcss-prefix
/Users/cjhowe7/Desktop/postcss-prefix/node_modules/postcss/lib/lazy-result.js:277
            throw error;
            ^

SyntaxError: Identifier 'prefixNode' has already been declared
    at /Users/cjhowe7/Desktop/postcss-prefix/index.js:19:35
    at /Users/cjhowe7/Desktop/postcss-prefix/node_modules/postcss-selector-parser/dist/selectors/container.js:164:26
    at Root.each (/Users/cjhowe7/Desktop/postcss-prefix/node_modules/postcss-selector-parser/dist/selectors/container.js:147:22)
    at Root.eachInside (/Users/cjhowe7/Desktop/postcss-prefix/node_modules/postcss-selector-parser/dist/selectors/container.js:163:21)
    at Processor.transformSelectors [as func] (/Users/cjhowe7/Desktop/postcss-prefix/index.js:19:15)
    at Processor.process (/Users/cjhowe7/Desktop/postcss-prefix/node_modules/postcss-selector-parser/dist/processor.js:31:14)
    at /Users/cjhowe7/Desktop/postcss-prefix/index.js:12:10
    at /Users/cjhowe7/Desktop/postcss-prefix/node_modules/postcss/lib/container.js:241:28
    at /Users/cjhowe7/Desktop/postcss-prefix/node_modules/postcss/lib/container.js:148:26
    at Root.each (/Users/cjhowe7/Desktop/postcss-prefix/node_modules/postcss/lib/container.js:114:22)
npm ERR! Test failed.  See above for more details.

stackcss / postcss-prefix Goto Github PK

postcss-prefix's People

Contributors

Stargazers

Watchers

Forkers

postcss-prefix's Issues

Add Travis tests

Missing the license

prefixes shouldn't be applied to psuedo-class arguments

Keyframes: prefix the name of the keyframe and all references to it in `animation` declarations

support styling top-level element with :host

Tests fail on node 5

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent