Skip to content

Commit

Permalink
Version 2.0.9
Browse files Browse the repository at this point in the history
  • Loading branch information
Petr Brzek committed Nov 22, 2013

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
1 parent 9b83ab0 commit c0203dd
Showing 10 changed files with 83 additions and 35 deletions.
38 changes: 31 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
@@ -16,7 +16,7 @@ README.md file is automatically generated.
**[Documentation](#documentation) |**

---
### Current version: v2.0.8 (2013-11-21)
### Current version: v2.0.9 (2013-11-22)
## Intro
Why LESS Hat? In August 2012, while we were developing and extending [CSS Hat](www.csshat.com) for LESS we needed universal mixins. Unfortunately, none of available were good enough that would satisfy our needs and that’s why we created new custom ones on our own, which have become the most popular mixin library for the whole LESS CSS.

@@ -2637,7 +2637,19 @@ Resources: **[WebPlatform](http://docs.webplatform.org/wiki/css/properties/trans
time += 's';
}

And also properties inside `transition` definition are automatically prefixed, if it is needed.
And also properties inside `transition` definition are automatically prefixed, if it is needed.
**W3C property value is appending all prefixed values.**
Why? Some browsers support W3C unprefixed property, but value must be sometimes prefixed.
Let's consider this example:

div {
-webkit-transition: -webkit-filter .3s ease;
-moz-transition: -moz-filter .3s ease;
-o-transition: filter .3s ease;

// There is a problem! Webkit needs -webkit-filter property
transition: filter .3s ease;
}

**Example:**

@@ -2748,7 +2760,19 @@ Resources: **[WebPlatform](http://docs.webplatform.org/wiki/css/properties/trans

**Tips and tricks:**

And also properties inside `transition-property` definition are automatically prefixed, if it is needed.
And also properties inside `transition-property` definition are automatically prefixed, if it is needed.
**W3C property value is appending all prefixed values.**
Why? Some browsers support W3C unprefixed property, but value must be sometimes prefixed.
Let's consider this example:

div {
-webkit-transition: -webkit-filter .3s ease;
-moz-transition: -moz-filter .3s ease;
-o-transition: filter .3s ease;

// There is a problem! Webkit needs -webkit-filter property
transition: filter .3s ease;
}

**Example:**

@@ -2758,10 +2782,10 @@ Resources: **[WebPlatform](http://docs.webplatform.org/wiki/css/properties/trans

// Result
div {
-webkit-transition-property: -webkit-box-shadow;
-moz-transition-property: -moz-box-shadow;
-o-transition-property: box-shadow;
transition-property: box-shadow;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: -webkit-transform,-moz-transform,-o-transform,transform;
}


2 changes: 1 addition & 1 deletion bower.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"name": "lesshat",
"version": "2.0.8",
"version": "2.0.9",
"main": "./build/lesshat.less"
}
8 changes: 4 additions & 4 deletions build/lesshat-prefixed.less
Original file line number Diff line number Diff line change
@@ -6,7 +6,7 @@
// Handcrafted by Petr Brzek, lesshat.com
// Works great with CSS Hat csshat.com

// version: v2.0.8 (2013-11-21)
// version: v2.0.9 (2013-11-22)

// TABLE OF MIXINS:
// align-content
@@ -2562,9 +2562,9 @@
@opera_local: true;
@w3c_local: true;

@process_webkit: ~`(function(value){value=value||"all";var prefixedProperties=["background-size","border-radius","border-bottom-left-radius","border-bottom-right-radius","border-top-left-radius","border-top-right-radius","box-shadow","column","transform","filter"],prefix="-webkit-";return/^[-a-zA-Z0-9().\/]*,/.test(value)&&(value=value.replace(/(?:,)(?![^(]*\))/g,"")),prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_moz: ~`(function(value){value=value||"all";var prefixedProperties=["background-size","box-shadow","column","transform","filter"],prefix="-moz-";return/^[-a-zA-Z0-9().\/]*,/.test(value)&&(value=value.replace(/(?:,)(?![^(]*\))/g,"")),prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_opera: ~`(function(value){value=value||"all";var prefixedProperties=["transform"],prefix="-o-";return/^[-a-zA-Z0-9().\/]*,/.test(value)&&(value=value.replace(/(?:,)(?![^(]*\))/g,"")),prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_webkit: ~`(function(value){value=value||"all";var prefixedProperties=["background-size","border-radius","border-bottom-left-radius","border-bottom-right-radius","border-top-left-radius","border-top-right-radius","box-shadow","column","transform","filter"],prefix="-webkit-";return prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_moz: ~`(function(value){value=value||"all";var prefixedProperties=["background-size","box-shadow","column","transform","filter"],prefix="-moz-";return prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_opera: ~`(function(value){value=value||"all";var prefixedProperties=["transform"],prefix="-o-";return prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process: ~`(function(value){value=value||"all";var prefixes=["-webkit-","-moz-","-o-",""],prefixedProperties=["column","transform","filter"],subSplit=value.split(/(?:,)(?![^(]*\))/g);return subSplit.forEach(function(css,index){prefixedProperties.forEach(function(property){-1!==css.indexOf(property)&&(subSplit[index]="",prefixes.forEach(function(vendor,i){subSplit[index]+=css.trim().replace(new RegExp(property,"g"),function(match){return vendor+match}),i<prefixes.length-1&&(subSplit[index]+=",")}))})}),value=subSplit.join(",")})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;

.result (@arguments, @signal, @boolean, @local_boolean) when (@boolean = true) and (@local_boolean = true) {
8 changes: 4 additions & 4 deletions build/lesshat.less
Original file line number Diff line number Diff line change
@@ -6,7 +6,7 @@
// Handcrafted by Petr Brzek, lesshat.com
// Works great with CSS Hat csshat.com

// version: v2.0.8 (2013-11-21)
// version: v2.0.9 (2013-11-22)

// TABLE OF MIXINS:
// align-content
@@ -2562,9 +2562,9 @@
@opera_local: true;
@w3c_local: true;

@process_webkit: ~`(function(value){value=value||"all";var prefixedProperties=["background-size","border-radius","border-bottom-left-radius","border-bottom-right-radius","border-top-left-radius","border-top-right-radius","box-shadow","column","transform","filter"],prefix="-webkit-";return/^[-a-zA-Z0-9().\/]*,/.test(value)&&(value=value.replace(/(?:,)(?![^(]*\))/g,"")),prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_moz: ~`(function(value){value=value||"all";var prefixedProperties=["background-size","box-shadow","column","transform","filter"],prefix="-moz-";return/^[-a-zA-Z0-9().\/]*,/.test(value)&&(value=value.replace(/(?:,)(?![^(]*\))/g,"")),prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_opera: ~`(function(value){value=value||"all";var prefixedProperties=["transform"],prefix="-o-";return/^[-a-zA-Z0-9().\/]*,/.test(value)&&(value=value.replace(/(?:,)(?![^(]*\))/g,"")),prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_webkit: ~`(function(value){value=value||"all";var prefixedProperties=["background-size","border-radius","border-bottom-left-radius","border-bottom-right-radius","border-top-left-radius","border-top-right-radius","box-shadow","column","transform","filter"],prefix="-webkit-";return prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_moz: ~`(function(value){value=value||"all";var prefixedProperties=["background-size","box-shadow","column","transform","filter"],prefix="-moz-";return prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process_opera: ~`(function(value){value=value||"all";var prefixedProperties=["transform"],prefix="-o-";return prefixedProperties.forEach(function(property){-1!==value.indexOf(property)&&(value=value.replace(new RegExp(property,"g"),function(match){return prefix+match}))}),value})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;
@process: ~`(function(value){value=value||"all";var prefixes=["-webkit-","-moz-","-o-",""],prefixedProperties=["column","transform","filter"],subSplit=value.split(/(?:,)(?![^(]*\))/g);return subSplit.forEach(function(css,index){prefixedProperties.forEach(function(property){-1!==css.indexOf(property)&&(subSplit[index]="",prefixes.forEach(function(vendor,i){subSplit[index]+=css.trim().replace(new RegExp(property,"g"),function(match){return vendor+match}),i<prefixes.length-1&&(subSplit[index]+=",")}))})}),value=subSplit.join(",")})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`;

.result (@arguments, @signal, @boolean, @local_boolean) when (@boolean = true) and (@local_boolean = true) {
4 changes: 4 additions & 0 deletions mixins/box-shadow/test.js
Original file line number Diff line number Diff line change
@@ -10,6 +10,10 @@ describe('box-shadow', function() {
test.boxShadow('5 4 100 rgba(20,20,20,0.5)', '5px 4px 100px rgba(20, 20, 20, 0.5)', done);
});

it('should add px for numbers', function(done) {
test.boxShadow('5 4 100 rgba(20,20,20,0.5), inset 5 4 100 rgba(20,20,20,0.5)', '5px 4px 100px rgba(20, 20, 20, 0.5), inset 5px 4px 100px rgba(20, 20, 20, 0.5)', done);
});

it('should return the same value', function(done) {
test.boxShadow('0em 0.125em 0.3125em 0em rgba(0, 0, 0, 0.5)', '0em 0.125em 0.3125em 0em rgba(0, 0, 0, 0.5)', done);
});
8 changes: 8 additions & 0 deletions mixins/transition-property/test.js
Original file line number Diff line number Diff line change
@@ -10,4 +10,12 @@ describe('transition-property', function() {
test.transitionProperty.webkit('box-shadow', '-webkit-box-shadow', done);
});

it('should prefix property and return value', function(done) {
test.transitionProperty.webkit('box-shadow, transform', '-webkit-box-shadow, -webkit-transform', done);
});

it('should prefix property and return value', function(done) {
test.transitionProperty.moz('box-shadow, transform', '-moz-box-shadow, -moz-transform', done);
});

});
12 changes: 0 additions & 12 deletions mixins/transition-property/transition-property.js
Original file line number Diff line number Diff line change
@@ -35,10 +35,6 @@ transitionProperty.webkit = function transitionProperty(value) {
var prefixedProperties = ['background-size', 'border-radius', 'border-bottom-left-radius', 'border-bottom-right-radius', 'border-top-left-radius', 'border-top-right-radius', 'box-shadow', 'column', 'transform', 'filter'];
var prefix = '-webkit-';

if (/^[-a-zA-Z0-9().\/]*,/.test(value)) {
value = value.replace(/(?:,)(?![^(]*\))/g, '');
}

prefixedProperties.forEach(function(property, index) {
if (value.indexOf(property) !== -1) {
value = value.replace(new RegExp(property, 'g'), function(match) {
@@ -55,10 +51,6 @@ transitionProperty.moz = function transitionProperty(value) {
var prefixedProperties = ['background-size', 'box-shadow', 'column', 'transform', 'filter'];
var prefix = '-moz-';

if (/^[-a-zA-Z0-9().\/]*,/.test(value)) {
value = value.replace(/(?:,)(?![^(]*\))/g, '');
}

prefixedProperties.forEach(function(property, index) {
if (value.indexOf(property) !== -1) {
value = value.replace(new RegExp(property, 'g'), function(match) {
@@ -75,10 +67,6 @@ transitionProperty.opera = function transitionProperty(value) {
var prefixedProperties = ['transform'];
var prefix = '-o-';

if (/^[-a-zA-Z0-9().\/]*,/.test(value)) {
value = value.replace(/(?:,)(?![^(]*\))/g, '');
}

prefixedProperties.forEach(function(property, index) {
if (value.indexOf(property) !== -1) {
value = value.replace(new RegExp(property, 'g'), function(match) {
22 changes: 17 additions & 5 deletions mixins/transition-property/transition-property.md
Original file line number Diff line number Diff line change
@@ -13,7 +13,19 @@ Resources: **[WebPlatform](http://docs.webplatform.org/wiki/css/properties/trans

**Tips and tricks:**

And also properties inside `transition-property` definition are automatically prefixed, if it is needed.
And also properties inside `transition-property` definition are automatically prefixed, if it is needed.
**W3C property value is appending all prefixed values.**
Why? Some browsers support W3C unprefixed property, but value must be sometimes prefixed.
Let's consider this example:

div {
-webkit-transition: -webkit-filter .3s ease;
-moz-transition: -moz-filter .3s ease;
-o-transition: filter .3s ease;

// There is a problem! Webkit needs -webkit-filter property
transition: filter .3s ease;
}

**Example:**

@@ -23,10 +35,10 @@ Resources: **[WebPlatform](http://docs.webplatform.org/wiki/css/properties/trans

// Result
div {
-webkit-transition-property: -webkit-box-shadow;
-moz-transition-property: -moz-box-shadow;
-o-transition-property: box-shadow;
transition-property: box-shadow;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: -webkit-transform,-moz-transform,-o-transform,transform;
}


14 changes: 13 additions & 1 deletion mixins/transition/transition.md
Original file line number Diff line number Diff line change
@@ -21,7 +21,19 @@ Resources: **[WebPlatform](http://docs.webplatform.org/wiki/css/properties/trans
time += 's';
}

And also properties inside `transition` definition are automatically prefixed, if it is needed.
And also properties inside `transition` definition are automatically prefixed, if it is needed.
**W3C property value is appending all prefixed values.**
Why? Some browsers support W3C unprefixed property, but value must be sometimes prefixed.
Let's consider this example:

div {
-webkit-transition: -webkit-filter .3s ease;
-moz-transition: -moz-filter .3s ease;
-o-transition: filter .3s ease;

// There is a problem! Webkit needs -webkit-filter property
transition: filter .3s ease;
}

**Example:**

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "lesshat",
"description": "Most advanced LESS CSS mixins library",
"version": "2.0.8",
"version": "2.0.9",
"homepage": "http://lesshat.com/",
"author": {
"name": "Petr Brzek",

0 comments on commit c0203dd

Please sign in to comment.