Skip to content

Commit

Permalink
Merge pull request cuth#57 from johvin/master
Browse files Browse the repository at this point in the history
feat: change rootValue to support both number and function
  • Loading branch information
cuth authored Feb 14, 2020
2 parents d3855ea + 8492df5 commit f5d9898
Show file tree
Hide file tree
Showing 4 changed files with 24 additions and 4 deletions.
4 changes: 2 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ Default:
}
```

- `rootValue` (Number) The root element font size.
- `rootValue` (Number | Function) Represents the root element font size or returns the root element font size based on the [`input`](https://api.postcss.org/Input.html) parameter
- `unitPrecision` (Number) The decimal numbers to allow the REM units to grow to.
- `propList` (Array) The properties that can change from px to rem.
- Values need to be exact matches.
Expand All @@ -84,7 +84,7 @@ Default:
- `['body']` will match `.body-class`
- If value is regexp, it checks to see if the selector matches the regexp.
- `[/^body$/]` will match `body` but not `.body`
- `replace` (Boolean) replaces rules containing rems instead of adding fallbacks.
- `replace` (Boolean) Replaces rules containing rems instead of adding fallbacks.
- `mediaQuery` (Boolean) Allow px to be converted in media queries.
- `minPixelValue` (Number) Set the minimum pixel value to replace.

Expand Down
4 changes: 3 additions & 1 deletion index.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,12 +29,14 @@ module.exports = postcss.plugin('postcss-pxtorem', function (options) {
convertLegacyOptions(options);

var opts = objectAssign({}, defaults, options);
var pxReplace = createPxReplace(opts.rootValue, opts.unitPrecision, opts.minPixelValue);

var satisfyPropList = createPropListMatcher(opts.propList);

return function (css) {

var rootValue = typeof opts.rootValue === 'function' ? opts.rootValue(css.source.input) : opts.rootValue;
var pxReplace = createPxReplace(rootValue, opts.unitPrecision, opts.minPixelValue);

css.walkDecls(function (decl, i) {
// This should be the fastest test and will remove most declarations
if (decl.value.indexOf('px') === -1) return;
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "postcss-pxtorem",
"description": "A CSS post-processor that converts px to rem.",
"version": "4.0.1",
"version": "4.1.0",
"author": "cuth",
"license": "MIT",
"repository": {
Expand Down
18 changes: 18 additions & 0 deletions spec/pxtorem-spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -149,6 +149,24 @@ describe('rootValue', function () {

expect(processed).toBe(expected);
});

it('should replace using different root values with different files', function () {
var css2 = '.rule { font-size: 20px }';
var expected = '.rule { font-size: 1rem }';
var options = {
rootValue: function (input) {
if (input.from.indexOf('basic.css') !== -1) {
return 15;
}
return 20;
}
};
var processed1 = postcss(pxtorem(options)).process(basicCSS, { from: '/tmp/basic.css' }).css;
var processed2 = postcss(pxtorem(options)).process(css2, { from: '/tmp/whatever.css' }).css;

expect(processed1).toBe(expected);
expect(processed2).toBe(expected);
});
});

describe('unitPrecision', function () {
Expand Down

0 comments on commit f5d9898

Please sign in to comment.