postcss-logical
Advanced tools
Comparing version 1.0.0 to 1.0.2
# Changes to PostCSS Logical Properties | ||
### 1.0.2 (Aug 15, 2017) | ||
- Improve flow-relative clear support | ||
- Update dependencies | ||
### 1.0.1 (Aug 13, 2017) | ||
- Improve flow-relative border support | ||
- Update dependencies | ||
### 1.0.0 (Aug 8, 2017) | ||
- Initial version |
@@ -5,3 +5,3 @@ const cloneRule = require('./clone-rule'); | ||
const matchLogicalBorder = /^border(-width|-style|-color)?$/i; | ||
const matchLogicalBorderSide = /^border-(?:(width|style|color)-)?(block|block-start|block-end|inline|inline-start|inline-end|start|end)/i; | ||
const matchLogicalBorderSide = /^border-(block|block-start|block-end|inline|inline-start|inline-end|start|end)(-(width|style|color))?$/i; | ||
@@ -84,7 +84,7 @@ // border | ||
decl.clone({ | ||
prop: `border-top${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-top${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
}), | ||
decl.clone({ | ||
prop: `border-bottom${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-bottom${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
@@ -108,7 +108,7 @@ }) | ||
decl.clone({ | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
}), | ||
decl.clone({ | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[1] || values[0] | ||
@@ -120,7 +120,7 @@ }) | ||
decl.clone({ | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
}), | ||
decl.clone({ | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[1] || values[0] | ||
@@ -131,7 +131,7 @@ }) | ||
decl.clone({ | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
}), | ||
decl.clone({ | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[1] || values[0] | ||
@@ -146,3 +146,3 @@ }) | ||
decl.clone({ | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$1')}` | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$2')}` | ||
}) | ||
@@ -152,3 +152,3 @@ ), | ||
decl.clone({ | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$1')}` | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$2')}` | ||
}) | ||
@@ -162,3 +162,3 @@ ) | ||
decl.clone({ | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$1')}` | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$2')}` | ||
}) | ||
@@ -168,3 +168,3 @@ ), | ||
decl.clone({ | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$1')}` | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$2')}` | ||
}) | ||
@@ -178,7 +178,7 @@ ) | ||
decl.clone({ | ||
prop: `border-top${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-top${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
}), | ||
decl.clone({ | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[1] || values[0] | ||
@@ -189,7 +189,7 @@ }) | ||
decl.clone({ | ||
prop: `border-top${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-top${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
}), | ||
decl.clone({ | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[1] || values[0] | ||
@@ -202,8 +202,9 @@ }) | ||
module.exports['border-end'] = (decl, values) => [ | ||
cloneRule(decl, 'ltr').append([decl.clone({ | ||
prop: `border-bottom${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
cloneRule(decl, 'ltr').append([ | ||
decl.clone({ | ||
prop: `border-bottom${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
}), | ||
decl.clone({ | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-right${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[1] || values[0] | ||
@@ -214,7 +215,7 @@ }) | ||
decl.clone({ | ||
prop: `border-bottom${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-bottom${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[0] | ||
}), | ||
decl.clone({ | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$1')}`, | ||
prop: `border-left${decl.prop.replace(matchLogicalBorderSide, '$2')}`, | ||
value: values[1] || values[0] | ||
@@ -221,0 +222,0 @@ }) |
@@ -26,2 +26,3 @@ // tooling | ||
'border-end': transformBorder['border-end'], 'border-end-width': transformBorder['border-end'], 'border-end-style': transformBorder['border-end'], 'border-end-color': transformBorder['border-end'], | ||
'clear': transformFloat, | ||
'inset': transformInset, | ||
@@ -47,3 +48,3 @@ 'margin': transformSpacing, | ||
root.walkDecls((decl) => { | ||
const values = postcss.list.split(decl.value, /^border/i.test(decl.prop) ? '/' : ' '); | ||
const values = postcss.list.split(decl.value, /^border(-block|-inline|-start|-end)?(-width|-style|-color)?$/i.test(decl.prop) ? '/' : ' '); | ||
const prop = decl.prop.replace(matchSupportedProperties, '$2$5').toLowerCase(); | ||
@@ -50,0 +51,0 @@ |
{ | ||
"name": "postcss-logical", | ||
"version": "1.0.0", | ||
"version": "1.0.2", | ||
"description": "Use logical properties and flow-relative values in CSS", | ||
@@ -26,6 +26,6 @@ "author": "Jonathan Neal <jonathantneal@hotmail.com>", | ||
"dependencies": { | ||
"postcss": "^6.0.8" | ||
"postcss": "^6.0.9" | ||
}, | ||
"devDependencies": { | ||
"eslint": "^4.3.0", | ||
"eslint": "^4.4.1", | ||
"eslint-config-dev": "2.0.0", | ||
@@ -32,0 +32,0 @@ "postcss-tape": "2.0.1", |
@@ -83,4 +83,4 @@ # PostCSS Logical Properties [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][postcss] | ||
- `float: inline-start`, `float: inline-end`, `text-align: start`, | ||
`text-align: end` | ||
- `clear: inline-start`, `clear: inline-end`, `float: inline-start`, | ||
`float: inline-end`, `text-align: start`, `text-align: end` | ||
@@ -87,0 +87,0 @@ --- |
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
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
29589
461
Updatedpostcss@^6.0.9