Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
stylecow-plugin-flex
Advanced tools
stylecow-plugin-flex - npm Package Compare versions
Comparing version 5.0.0 to 6.0.0
@@ -1,4 +0,6 @@ | ||
| module.exports = function (stylecow) { | ||
| require('./src/ms')(stylecow); | ||
| require('./src/webkit')(stylecow); | ||
| "use strict"; | ||
| module.exports = function (tasks) { | ||
| tasks.use(require('./src/ms')); | ||
| tasks.use(require('./src/webkit')); | ||
| }; |
| { | ||
| "name": "stylecow-plugin-flex", | ||
| "description": "Stylecow plugin to add vendor prefixes and create fallback in browsers supporting the old flexbox syntax", | ||
| "version": "5.0.0", | ||
| "version": "6.0.0", | ||
| "engines": { | ||
| "node": ">=4.0" | ||
| }, | ||
| "author": "Oscar Otero <oom@oscarotero.com>", | ||
@@ -16,4 +19,4 @@ "homepage": "https://github.com/stylecow/stylecow-plugin-flex", | ||
| "devDependencies": { | ||
| "mocha": "^2.2.5", | ||
| "stylecow-core": "^1.0.1" | ||
| "mocha": "^2.3.2", | ||
| "stylecow-core": "^2.0.0" | ||
| }, | ||
@@ -20,0 +23,0 @@ "main": "index.js", |
219
src/ms.js
@@ -1,84 +0,147 @@ | ||
| module.exports = function (stylecow) { | ||
| var names = { | ||
| 'flex-grow': '-ms-flex-positive', | ||
| 'flex-shrink': '-ms-flex-negative', | ||
| 'order': '-ms-flex-order', | ||
| 'justify-content': '-ms-flex-pack', | ||
| 'align-items': '-ms-flex-align', | ||
| 'align-self': '-ms-flex-item-align', | ||
| 'align-content': '-ms-flex-line-pack', | ||
| 'flex-wrap': '-ms-flex-wrap', | ||
| }; | ||
| "use strict"; | ||
| var values = { | ||
| 'flex-start': 'start', | ||
| 'flex-end': 'end', | ||
| 'nowrap': 'none' | ||
| }; | ||
| module.exports = function (tasks) { | ||
| var names = { | ||
| 'flex-grow': '-ms-flex-positive', | ||
| 'flex-shrink': '-ms-flex-negative', | ||
| 'order': '-ms-flex-order', | ||
| 'justify-content': '-ms-flex-pack', | ||
| 'align-items': '-ms-flex-align', | ||
| 'align-self': '-ms-flex-item-align', | ||
| 'align-content': '-ms-flex-line-pack', | ||
| 'flex-wrap': '-ms-flex-wrap', | ||
| }; | ||
| stylecow.forBrowsersLowerThan({ | ||
| explorer: 11.0 | ||
| }, function () { | ||
| var values = { | ||
| 'flex-start': 'start', | ||
| 'flex-end': 'end', | ||
| 'nowrap': 'none' | ||
| }; | ||
| // from display: flex/inline-flex | ||
| // to display: -ms-flexbox/-ms-inline-flexbox | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| string: [ | ||
| 'display: flex;', | ||
| 'display: inline-flex;' | ||
| ] | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .getAll({ | ||
| type: 'Keyword', | ||
| name: ['flex', 'inline-flex'] | ||
| }) | ||
| .forEach(function (keyword) { | ||
| keyword.name += 'box'; | ||
| keyword.vendor = 'ms'; | ||
| }); | ||
| } | ||
| }); | ||
| var support = { | ||
| explorer: 11.0 | ||
| }; | ||
| //name/value replacements | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: Object.keys(names), | ||
| vendor: false | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .setName(names[declaration.name]) | ||
| .getAll({ | ||
| type: 'Keyword', | ||
| name: Object.keys(values) | ||
| }) | ||
| .forEach(function (keyword) { | ||
| keyword.name = values[keyword.name]; | ||
| }); | ||
| } | ||
| }); | ||
| // from display: flex/inline-flex | ||
| // to display: -ms-flexbox/-ms-inline-flexbox | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| string: [ | ||
| 'display: flex;', | ||
| 'display: inline-flex;' | ||
| ] | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .getAll({ | ||
| type: 'Keyword', | ||
| name: ['flex', 'inline-flex'] | ||
| }) | ||
| .forEach(function (keyword) { | ||
| keyword.name += 'box'; | ||
| keyword.vendor = 'ms'; | ||
| }); | ||
| } | ||
| }); | ||
| //Other vendor prefixes | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: /^flex/, | ||
| vendor: false | ||
| }, | ||
| fn: function (declaration) { | ||
| if (!names[declaration.name]) { | ||
| declaration | ||
| .cloneBefore() | ||
| .setVendor('ms'); | ||
| } | ||
| } | ||
| }); | ||
| }); | ||
| //name/value replacements | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: Object.keys(names), | ||
| vendor: false | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .setName(names[declaration.name]) | ||
| .getAll({ | ||
| type: 'Keyword', | ||
| name: Object.keys(values) | ||
| }) | ||
| .forEach(keyword => keyword.name = values[keyword.name]); | ||
| } | ||
| }); | ||
| //Other vendor prefixes | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: [ | ||
| 'flex-direction', | ||
| 'flex-flow', | ||
| 'flex-basis', | ||
| ], | ||
| vendor: false | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .setVendor('ms'); | ||
| } | ||
| }); | ||
| //Shorthand flex | ||
| //https://github.com/philipwalton/flexbugs/blob/master/README.md#6-the-default-flex-value-has-changed | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: { | ||
| explorer: 12 | ||
| }, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex', | ||
| vendor: false | ||
| }, | ||
| fn: function (declaration) { | ||
| if (declaration.has({ | ||
| type: 'Keyword', | ||
| name: ['auto', 'initial'] | ||
| })) { | ||
| return; | ||
| } | ||
| var value = declaration[0]; | ||
| if (!value[1]) { | ||
| value[0].codeBefore('1', 'Number'); | ||
| } | ||
| if (!value[2]) { | ||
| value[1].codeAfter('0%', 'Unit'); | ||
| } else if (value[2].type === 'Number') { | ||
| value[2].replaceWithCode(value[2] + '%', 'Unit'); | ||
| } | ||
| } | ||
| }); | ||
| //Shorthand flex | ||
| //https://github.com/philipwalton/flexbugs/blob/master/README.md#6-the-default-flex-value-has-changed | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex', | ||
| vendor: false | ||
| }, | ||
| fn: function (declaration) { | ||
| switch (declaration.toString()) { | ||
| case 'flex: 1;': | ||
| return declaration.codeBefore('-ms-flex: 1 1 0%', 'Declaration'); | ||
| case 'flex: auto;': | ||
| return declaration.codeBefore('-ms-flex: 1 1 auto', 'Declaration'); | ||
| case 'flex: initial;': | ||
| return declaration.codeBefore('-ms-flex: 0 1 auto', 'Declaration'); | ||
| default: | ||
| return declaration.cloneBefore().setVendor('ms'); | ||
| } | ||
| } | ||
| }); | ||
| }; |
@@ -1,184 +0,190 @@ | ||
| module.exports = function (stylecow) { | ||
| var names = { | ||
| 'justify-content': '-webkit-box-pack', | ||
| 'align-items': '-webkit-box-align', | ||
| 'flex-grow': '-webkit-box-flex' | ||
| }; | ||
| "use strict"; | ||
| var values = { | ||
| 'flex-start': 'start', | ||
| 'flex-end': 'end', | ||
| 'space-between': 'justify', | ||
| }; | ||
| module.exports = function (tasks) { | ||
| var names = { | ||
| 'justify-content': '-webkit-box-pack', | ||
| 'align-items': '-webkit-box-align', | ||
| 'flex-grow': '-webkit-box-flex' | ||
| }; | ||
| stylecow.forBrowsersLowerThan({ | ||
| chrome: 21.0, | ||
| safari: 6.1, | ||
| android: 4.4, | ||
| ios: 7.0 | ||
| }, function () { | ||
| var values = { | ||
| 'flex-start': 'start', | ||
| 'flex-end': 'end', | ||
| 'space-between': 'justify', | ||
| }; | ||
| //vendor prefixes in display: flex/inline-flex | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| string: [ | ||
| 'display: flex;', | ||
| 'display: inline-flex;' | ||
| ] | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .getAll({ | ||
| type: 'Keyword', | ||
| name: ['flex', 'inline-flex'] | ||
| }) | ||
| .forEach(function (keyword) { | ||
| keyword.name = keyword.name.replace('flex', 'box'); | ||
| keyword.vendor = 'webkit'; | ||
| }); | ||
| } | ||
| }); | ||
| var support = { | ||
| chrome: 21.0, | ||
| safari: 6.1, | ||
| android: 4.4, | ||
| ios: 7.0 | ||
| }; | ||
| //vendor prefixes in display: flex/inline-flex | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| string: [ | ||
| 'display: flex;', | ||
| 'display: inline-flex;' | ||
| ] | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .getAll({ | ||
| type: 'Keyword', | ||
| name: ['flex', 'inline-flex'] | ||
| }) | ||
| .forEach(function (keyword) { | ||
| keyword.name = keyword.name.replace('flex', 'box'); | ||
| keyword.vendor = 'webkit'; | ||
| }); | ||
| } | ||
| }); | ||
| //flex-direction | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex-direction' | ||
| }, | ||
| fn: function (declaration) { | ||
| applyFlexDirection(declaration.join(' '), declaration); | ||
| } | ||
| }); | ||
| //flex-direction | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex-direction' | ||
| }, | ||
| fn: function (declaration) { | ||
| applyFlexDirection(declaration.join(' '), declaration); | ||
| } | ||
| }); | ||
| //flex-flow: <flex-direction> || <flex-wrap> | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex-flow' | ||
| }, | ||
| fn: function (declaration) { | ||
| var value = declaration.get('Value'); | ||
| if (value[0]) { //flex-direction | ||
| applyFlexDirection(value[0].toString(), declaration); | ||
| } | ||
| //flex-flow: <flex-direction> || <flex-wrap> | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex-flow' | ||
| }, | ||
| fn: function (declaration) { | ||
| var value = declaration.get('Value'); | ||
| if (value[1]) { //flex-wrap | ||
| applyFlexWrap(value[1].toString(), declaration); | ||
| } | ||
| } | ||
| }); | ||
| if (value[0]) { //flex-direction | ||
| applyFlexDirection(value[0].toString(), declaration); | ||
| } | ||
| if (value[1]) { //flex-wrap | ||
| applyFlexWrap(value[1].toString(), declaration); | ||
| } | ||
| } | ||
| }); | ||
| //flex: <flex-grow> <flex-shrink>? || <flex-basis> | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex' | ||
| }, | ||
| fn: function (declaration) { | ||
| var value = declaration.get('Value'); | ||
| if (value[0]) { //flex-grow | ||
| var val = value[0].toString(); | ||
| //flex: <flex-grow> <flex-shrink>? || <flex-basis> | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex' | ||
| }, | ||
| fn: function (declaration) { | ||
| var value = declaration.get('Value'); | ||
| if (val === 'none') { | ||
| val = '0.0'; | ||
| } | ||
| if (value[0]) { //flex-grow | ||
| var val = value[0].toString(); | ||
| declaration.before(stylecow.parse('-webkit-box-flex: ' + value[0], 'Declaration')); | ||
| } | ||
| } | ||
| }); | ||
| if (val === 'none') { | ||
| val = '0.0'; | ||
| } | ||
| declaration.codeBefore('-webkit-box-flex: ' + val, 'Declaration'); | ||
| } | ||
| } | ||
| }); | ||
| //flex-wrap | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex-wrap' | ||
| }, | ||
| fn: function (declaration) { | ||
| applyFlexWrap(declaration.join(' '), declaration); | ||
| } | ||
| }); | ||
| //flex-wrap | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'flex-wrap' | ||
| }, | ||
| fn: function (declaration) { | ||
| applyFlexWrap(declaration.join(' '), declaration); | ||
| } | ||
| }); | ||
| //order | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'order' | ||
| }, | ||
| fn: function (declaration) { | ||
| var value = parseInt(declaration.join(' ')) + 1; | ||
| declaration.before(stylecow.parse('-webkit-box-ordinal-group: ' + value, 'Declaration')); | ||
| } | ||
| }); | ||
| //order | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: 'order' | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration.codeBefore('-webkit-box-ordinal-group: ' + (parseInt(declaration.join(' ')) + 1), 'Declaration'); | ||
| } | ||
| }); | ||
| //name/value replacements | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: Object.keys(names) | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .setName(names[declaration.name]) | ||
| .getAll({ | ||
| type: 'Keyword', | ||
| name: Object.keys(values) | ||
| }) | ||
| .forEach(function (keyword) { | ||
| keyword.name = values[keyword.name]; | ||
| }); | ||
| } | ||
| }); | ||
| }); | ||
| //name/value replacements | ||
| tasks.addTask({ | ||
| forBrowsersLowerThan: support, | ||
| filter: { | ||
| type: 'Declaration', | ||
| name: Object.keys(names) | ||
| }, | ||
| fn: function (declaration) { | ||
| declaration | ||
| .cloneBefore() | ||
| .setName(names[declaration.name]) | ||
| .getAll({ | ||
| type: 'Keyword', | ||
| name: Object.keys(values) | ||
| }) | ||
| .forEach(function (keyword) { | ||
| keyword.name = values[keyword.name]; | ||
| }); | ||
| } | ||
| }); | ||
| function applyFlexWrap(value, declaration) { | ||
| switch (value) { | ||
| case 'wrap': | ||
| declaration.before(stylecow.parse('-webkit-box-lines: multiple', 'Declaration')); | ||
| break; | ||
| function applyFlexWrap(value, declaration) { | ||
| switch (value) { | ||
| case 'wrap': | ||
| declaration.codeBefore('-webkit-box-lines: multiple', 'Declaration'); | ||
| break; | ||
| case 'nowrap': | ||
| declaration.before(stylecow.parse('-webkit-box-lines: single', 'Declaration')); | ||
| break; | ||
| case 'nowrap': | ||
| declaration.codeBefore('-webkit-box-lines: single', 'Declaration'); | ||
| break; | ||
| case 'wrap-reverse': | ||
| declaration.before(stylecow.parse('-webkit-box-lines: multiple', 'Declaration')); | ||
| declaration.before(stylecow.parse('-webkit-box-direction: reverse', 'Declaration')); | ||
| break; | ||
| } | ||
| } | ||
| case 'wrap-reverse': | ||
| declaration.codeBefore('-webkit-box-lines: multiple', 'Declaration'); | ||
| declaration.codeBefore('-webkit-box-direction: reverse', 'Declaration'); | ||
| break; | ||
| } | ||
| } | ||
| function applyFlexDirection(value, declaration) { | ||
| switch (value) { | ||
| case 'row': | ||
| declaration.before(stylecow.parse('-webkit-box-orient: horizontal', 'Declaration')); | ||
| break; | ||
| function applyFlexDirection(value, declaration) { | ||
| switch (value) { | ||
| case 'row': | ||
| declaration.codeBefore('-webkit-box-orient: horizontal', 'Declaration'); | ||
| break; | ||
| case 'row-reverse': | ||
| declaration.before(stylecow.parse('-webkit-box-orient: horizontal', 'Declaration')); | ||
| declaration.before(stylecow.parse('-webkit-box-direction: reverse', 'Declaration')); | ||
| break; | ||
| case 'row-reverse': | ||
| declaration.codeBefore('-webkit-box-orient: horizontal', 'Declaration'); | ||
| declaration.codeBefore('-webkit-box-direction: reverse', 'Declaration'); | ||
| break; | ||
| case 'column': | ||
| declaration.before(stylecow.parse('-webkit-box-orient: vertical', 'Declaration')); | ||
| break; | ||
| case 'column': | ||
| declaration.codeBefore('-webkit-box-orient: vertical', 'Declaration'); | ||
| break; | ||
| case 'column-reverse': | ||
| declaration.before(stylecow.parse('-webkit-box-orient: vertical', 'Declaration')); | ||
| declaration.before(stylecow.parse('-webkit-box-direction: reverse', 'Declaration')); | ||
| break; | ||
| } | ||
| } | ||
| case 'column-reverse': | ||
| declaration.codeBefore('-webkit-box-orient: vertical', 'Declaration'); | ||
| declaration.codeBefore('-webkit-box-direction: reverse', 'Declaration'); | ||
| break; | ||
| } | ||
| } | ||
| }; |
@@ -1,29 +0,20 @@ | ||
| var assert = require('assert'); | ||
| var stylecow = require('stylecow-core'); | ||
| stylecow | ||
| .loadNpmModule(__dirname + '/../index') | ||
| .minSupport({ | ||
| "explorer": 0, | ||
| "firefox": 0, | ||
| "chrome": 0, | ||
| "safari": 0, | ||
| "opera": 0, | ||
| "android": 0, | ||
| "ios": 0 | ||
| }) | ||
| .testCases(__dirname + '/cases', function (test) { | ||
| stylecow.run(test.css); | ||
| var tests = new stylecow.Test(__dirname + '/cases'); | ||
| var tasks = (new stylecow.Tasks()).use(require('../index')); | ||
| describe('cases/' + test.name, function() { | ||
| it('should match output.css', function() { | ||
| //test.write('output.css', test.css.toString()); | ||
| assert.equal(test.css.toString(), test.read('output.css')); | ||
| }); | ||
| tests.run(function (test) { | ||
| tasks.run(test.css); | ||
| it('should match ast.json', function() { | ||
| //test.writeJson('ast.json', test.css.toAst()); | ||
| assert.deepEqual(test.css.toAst(), test.readJson('ast.json')); | ||
| }); | ||
| }); | ||
| }); | ||
| describe('cases/' + test.name, function() { | ||
| it('should match output.css', function() { | ||
| //test.writeString() | ||
| test.assertString(); | ||
| }); | ||
| it('should match ast.json', function() { | ||
| //test.writeAst() | ||
| test.assertAst(); | ||
| }); | ||
| }); | ||
| }); |
| { | ||
| "class": "Root", | ||
| "type": "Root", | ||
| "children": [ | ||
| { | ||
| "class": "Rule", | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "class": "Selectors", | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Selector", | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "TypeSelector", | ||
| "name": "div" | ||
| "type": "ClassSelector", | ||
| "name": "foo" | ||
| } | ||
@@ -22,16 +22,29 @@ ] | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "name": "display", | ||
| "vendor": null, | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": "ms", | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "flexbox", | ||
| "vendor": "ms" | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Unit", | ||
| "name": "%", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
| ] | ||
| } | ||
@@ -43,13 +56,12 @@ ] | ||
| { | ||
| "class": "Declaration", | ||
| "name": "display", | ||
| "vendor": null, | ||
| "type": "Declaration", | ||
| "name": "box-flex", | ||
| "vendor": "webkit", | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "box", | ||
| "vendor": "webkit" | ||
| "type": "Number", | ||
| "name": 1 | ||
| } | ||
@@ -61,13 +73,26 @@ ] | ||
| { | ||
| "class": "Declaration", | ||
| "name": "display", | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "flex", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Unit", | ||
| "name": "%", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
| ] | ||
| } | ||
@@ -77,32 +102,52 @@ ] | ||
| ] | ||
| }, | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "name": "-ms-flex-align", | ||
| "vendor": null, | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "start", | ||
| "vendor": null | ||
| } | ||
| ] | ||
| "type": "ClassSelector", | ||
| "name": "foo" | ||
| } | ||
| ] | ||
| }, | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "name": "-webkit-box-align", | ||
| "vendor": null, | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": "ms", | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "start", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Unit", | ||
| "name": "%", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
| ] | ||
| } | ||
@@ -114,13 +159,12 @@ ] | ||
| { | ||
| "class": "Declaration", | ||
| "name": "align-items", | ||
| "vendor": null, | ||
| "type": "Declaration", | ||
| "name": "box-flex", | ||
| "vendor": "webkit", | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "flex-start", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| } | ||
@@ -132,18 +176,26 @@ ] | ||
| { | ||
| "class": "Declaration", | ||
| "name": "flex-flow", | ||
| "vendor": "ms", | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "column", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "class": "Keyword", | ||
| "name": "wrap", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Unit", | ||
| "name": "%", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
| ] | ||
| } | ||
@@ -153,15 +205,52 @@ ] | ||
| ] | ||
| }, | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "name": "box-orient", | ||
| "vendor": "webkit", | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "ClassSelector", | ||
| "name": "foo" | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": "ms", | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "vertical", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Unit", | ||
| "name": "%", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
| ] | ||
| } | ||
@@ -173,13 +262,12 @@ ] | ||
| { | ||
| "class": "Declaration", | ||
| "name": "box-lines", | ||
| "type": "Declaration", | ||
| "name": "box-flex", | ||
| "vendor": "webkit", | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "multiple", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| } | ||
@@ -191,18 +279,26 @@ ] | ||
| { | ||
| "class": "Declaration", | ||
| "name": "flex-flow", | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "name": "column", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "class": "Keyword", | ||
| "name": "wrap", | ||
| "vendor": null | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Unit", | ||
| "name": "%", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
| ] | ||
| } | ||
@@ -218,21 +314,13 @@ ] | ||
| { | ||
| "class": "Rule", | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "class": "Selectors", | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Selector", | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "TypeSelector", | ||
| "name": "div" | ||
| }, | ||
| { | ||
| "class": "Combinator", | ||
| "name": ">" | ||
| }, | ||
| { | ||
| "class": "TypeSelector", | ||
| "name": "div" | ||
| "type": "ClassSelector", | ||
| "name": "foo" | ||
| } | ||
@@ -244,6 +332,6 @@ ] | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
@@ -253,19 +341,19 @@ "vendor": "ms", | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "class": "Number", | ||
| "name": 0 | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "class": "Unit", | ||
| "name": "%", | ||
| "type": "Unit", | ||
| "name": "px", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "name": 100 | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
@@ -279,3 +367,3 @@ ] | ||
| { | ||
| "class": "Declaration", | ||
| "type": "Declaration", | ||
| "name": "box-flex", | ||
@@ -285,6 +373,6 @@ "vendor": "webkit", | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 1 | ||
@@ -297,3 +385,3 @@ } | ||
| { | ||
| "class": "Declaration", | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
@@ -303,19 +391,19 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "class": "Number", | ||
| "name": 0 | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "class": "Unit", | ||
| "name": "%", | ||
| "type": "Unit", | ||
| "name": "px", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "name": 100 | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
@@ -331,4 +419,202 @@ ] | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "type": "ClassSelector", | ||
| "name": "foo" | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "type": "Declaration", | ||
| "name": "box-flex", | ||
| "vendor": "webkit", | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 1 | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": "ms", | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Keyword", | ||
| "name": "auto", | ||
| "vendor": null | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Declaration", | ||
| "name": "box-flex", | ||
| "vendor": "webkit", | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "type": "Keyword", | ||
| "name": "auto", | ||
| "vendor": null | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "type": "Keyword", | ||
| "name": "auto", | ||
| "vendor": null | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "type": "ClassSelector", | ||
| "name": "foo" | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "type": "Declaration", | ||
| "name": "box-flex", | ||
| "vendor": "webkit", | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 0 | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": "ms", | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "type": "Number", | ||
| "name": 0 | ||
| }, | ||
| { | ||
| "type": "Number", | ||
| "name": 1 | ||
| }, | ||
| { | ||
| "type": "Keyword", | ||
| "name": "auto", | ||
| "vendor": null | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Declaration", | ||
| "name": "box-flex", | ||
| "vendor": "webkit", | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "type": "Keyword", | ||
| "name": "initial", | ||
| "vendor": null | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "type": "Declaration", | ||
| "name": "flex", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "type": "Keyword", | ||
| "name": "initial", | ||
| "vendor": null | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| } | ||
| ] | ||
| } |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by103.32%
37513
- Number of package files
- increased by25%
15
- Lines of code
- increased by113.88%
1294
Worsened metrics
- Number of medium supply chain risk alerts
- increased byInfinity%
1
No dependency changes