From 6ebf795cde4ec77b01ae64b3247752bdb7121299 Mon Sep 17 00:00:00 2001 From: Petr Brzek Date: Fri, 31 Jan 2014 20:25:57 +0100 Subject: [PATCH] Version 2.0.15 --- README.md | 28 ++++++++++++++++- bower.json | 2 +- build/lesshat-prefixed.less | 62 +++++++++++++++++++++++++++++-------- build/lesshat.less | 62 +++++++++++++++++++++++++++++-------- mixins/hyphens/hyphens.js | 21 +++++++++++++ mixins/hyphens/hyphens.md | 25 +++++++++++++++ mixins/hyphens/test.js | 9 ++++++ mixins/size/size.less | 32 +++++++++++-------- package.json | 2 +- 9 files changed, 201 insertions(+), 42 deletions(-) create mode 100644 mixins/hyphens/hyphens.js create mode 100644 mixins/hyphens/hyphens.md create mode 100644 mixins/hyphens/test.js diff --git a/README.md b/README.md index fe5d6c8..40d2d3c 100644 --- a/README.md +++ b/README.md @@ -15,7 +15,7 @@ README.md file is automatically generated. **[Documentation](#documentation) |** --- -### Current version: v2.0.14 (2014-01-23) +### Current version: v2.0.15 (2014-01-31) ## 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. @@ -1666,6 +1666,32 @@ Default value: 0 +### • hyphens +**Summary:** + +The hyphens CSS property tells the browser how to go about splitting words to improve the layout of text when line-wrapping. + +Resources: **[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/hyphens)** + +**Syntax:** + +Default value: manual + + .hyphens(none | manual | auto) + +**Example:** + + div { + .hyphens(none); + } + + // Result + div { + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + } + ### • invert **Summary:** diff --git a/bower.json b/bower.json index bd98180..93f786a 100644 --- a/bower.json +++ b/bower.json @@ -1,5 +1,5 @@ { "name": "lesshat", - "version": "2.0.14", + "version": "2.0.15", "main": "./build/lesshat.less" } \ No newline at end of file diff --git a/build/lesshat-prefixed.less b/build/lesshat-prefixed.less index 67da105..fe68233 100644 --- a/build/lesshat-prefixed.less +++ b/build/lesshat-prefixed.less @@ -6,7 +6,7 @@ // Handcrafted by Petr Brzek, lesshat.com // Works great with CSS Hat csshat.com -// version: v2.0.14 (2014-01-23) +// version: v2.0.15 (2014-01-31) // TABLE OF MIXINS: // align-content @@ -56,6 +56,7 @@ // font-face // grayscale // hue-rotate + // hyphens // invert // justify-content // keyframes @@ -1429,6 +1430,35 @@ } +.lh-hyphens(...) { + + @webkit_local: true; + @moz_local: true; + @ms_local: true; + @w3c_local: true; + + @process: ~`(function(value){return value=value||"manual"})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`; + + .result (@arguments, @signal, @boolean, @local_boolean) when (@boolean = true) and (@local_boolean = true) { + .inception (@signal, @arguments) when (@signal = 1) and (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) { -webkit-hyphens: @process; } + .inception (@signal, @arguments) when (@signal = 1) and not (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) {} + .inception (@signal, @arguments) when (@signal = 2) and (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) { -moz-hyphens: @process; } + .inception (@signal, @arguments) when (@signal = 2) and not (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) {} + .inception (@signal, @arguments) when (@signal = 3) and (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) { -ms-hyphens: @process; } + .inception (@signal, @arguments) when (@signal = 3) and not (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) {} + .inception (@signal, @arguments) when (@signal = 4) and (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) { hyphens: @process; } + .inception (@signal, @arguments) when (@signal = 4) and not (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) {} + .inception(@signal, @arguments); + } + .result (@arguments, @signal, @boolean, @local_boolean) when not (@boolean = true), not (@local_boolean = true) {} + + .result(@arguments, 1, @webkit, @webkit_local); + .result(@arguments, 2, @moz, @moz_local); + .result(@arguments, 3, @ms, @ms_local); + .result(@arguments, 4, @w3c, @w3c_local); + +} + .lh-invert(...) { @webkit_local: true; @@ -2248,23 +2278,29 @@ .lh-size(@width, @height) { @unit: 'px'; - .process(@width, @height) when (ispixel(@width)) and (ispixel(@height)), (isem(@width)) and (isem(@height)), (ispercentage(@width)) and (ispercentage(@height)), (iskeyword(@width)) and (iskeyword(@height)) { - width: @width; - height: @height; + .process(@width, @height) when (ispixel(@width)), (isem(@width)), (ispercentage(@width)), (iskeyword(@width)) { + .kittens(@height) when (ispixel(@height)), (isem(@height)), (ispercentage(@height)), (iskeyword(@height)) { + width: @width; + height: @height; + } + .kittens(@height) when not (ispixel(@height)) and not (isem(@height)) and not (ispercentage(@height)) and not (iskeyword(@height)) { + width: @width; + height: ~`@{height} + @{unit}`; + } + .kittens(@height); } - .process(@width, @height) when not (ispixel(@width)) and not (ispixel(@height)) and not (isem(@width)) and not (isem(@height)) and not (ispercentage(@width)) and not (ispercentage(@height)) and not (iskeyword(@width)) and not (iskeyword(@height)) { - width: ~`@{width} + @{unit}`; - height: ~`@{height} + @{unit}`; + .process(@width, @height) when (ispixel(@height)), (isem(@height)), (ispercentage(@height)), (iskeyword(@height)) { + .kittens(@width) when (ispixel(@width)), (isem(@width)), (ispercentage(@width)), (iskeyword(@width)) {} + .kittens(@width) when not (ispixel(@width)) and not (isem(@width)) and not (ispercentage(@width)) and not (iskeyword(@width)) { + width: ~`@{width} + @{unit}`; + height: @height; + } + .kittens(@width); } - .process(@width, @height) when not (ispixel(@width)) and (ispixel(@height)), not (isem(@width)) and (isem(@height)), not (ispercentage(@width)) and (ispercentage(@height)), not (iskeyword(@width)) and (iskeyword(@height)) { + .process(@width, @height) when not (ispixel(@width)) and not (isem(@width)) and not (ispercentage(@width)) and not (iskeyword(@width)) and not (ispixel(@height)) and not (isem(@height)) and not (ispercentage(@height)) and not (iskeyword(@height)) { width: ~`@{width} + @{unit}`; - height: @height; - } - - .process(@width, @height) when (ispixel(@width)) and not (ispixel(@height)), (isem(@width)) and not (isem(@height)), (ispercentage(@width)) and not (ispercentage(@height)), (iskeyword(@width)) and not (iskeyword(@height)) { - width: @width; height: ~`@{height} + @{unit}`; } diff --git a/build/lesshat.less b/build/lesshat.less index 26f0b67..c85cecf 100644 --- a/build/lesshat.less +++ b/build/lesshat.less @@ -6,7 +6,7 @@ // Handcrafted by Petr Brzek, lesshat.com // Works great with CSS Hat csshat.com -// version: v2.0.14 (2014-01-23) +// version: v2.0.15 (2014-01-31) // TABLE OF MIXINS: // align-content @@ -56,6 +56,7 @@ // font-face // grayscale // hue-rotate + // hyphens // invert // justify-content // keyframes @@ -1429,6 +1430,35 @@ } +.hyphens(...) { + + @webkit_local: true; + @moz_local: true; + @ms_local: true; + @w3c_local: true; + + @process: ~`(function(value){return value=value||"manual"})((function(){var args="@{arguments}";return args=args.replace(/^\[|\]$/g,"")})())`; + + .result (@arguments, @signal, @boolean, @local_boolean) when (@boolean = true) and (@local_boolean = true) { + .inception (@signal, @arguments) when (@signal = 1) and (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) { -webkit-hyphens: @process; } + .inception (@signal, @arguments) when (@signal = 1) and not (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) {} + .inception (@signal, @arguments) when (@signal = 2) and (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) { -moz-hyphens: @process; } + .inception (@signal, @arguments) when (@signal = 2) and not (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) {} + .inception (@signal, @arguments) when (@signal = 3) and (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) { -ms-hyphens: @process; } + .inception (@signal, @arguments) when (@signal = 3) and not (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) {} + .inception (@signal, @arguments) when (@signal = 4) and (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) { hyphens: @process; } + .inception (@signal, @arguments) when (@signal = 4) and not (isstring(@process)) and not (iscolor(@process)) and not (isnumber(@process)) and not (iskeyword(@process)) and not (isurl(@process)) and not (ispixel(@process)) and not (ispercentage(@process)) and not (isem(@process)) {} + .inception(@signal, @arguments); + } + .result (@arguments, @signal, @boolean, @local_boolean) when not (@boolean = true), not (@local_boolean = true) {} + + .result(@arguments, 1, @webkit, @webkit_local); + .result(@arguments, 2, @moz, @moz_local); + .result(@arguments, 3, @ms, @ms_local); + .result(@arguments, 4, @w3c, @w3c_local); + +} + .invert(...) { @webkit_local: true; @@ -2248,23 +2278,29 @@ .size(@width, @height) { @unit: 'px'; - .process(@width, @height) when (ispixel(@width)) and (ispixel(@height)), (isem(@width)) and (isem(@height)), (ispercentage(@width)) and (ispercentage(@height)), (iskeyword(@width)) and (iskeyword(@height)) { - width: @width; - height: @height; + .process(@width, @height) when (ispixel(@width)), (isem(@width)), (ispercentage(@width)), (iskeyword(@width)) { + .kittens(@height) when (ispixel(@height)), (isem(@height)), (ispercentage(@height)), (iskeyword(@height)) { + width: @width; + height: @height; + } + .kittens(@height) when not (ispixel(@height)) and not (isem(@height)) and not (ispercentage(@height)) and not (iskeyword(@height)) { + width: @width; + height: ~`@{height} + @{unit}`; + } + .kittens(@height); } - .process(@width, @height) when not (ispixel(@width)) and not (ispixel(@height)) and not (isem(@width)) and not (isem(@height)) and not (ispercentage(@width)) and not (ispercentage(@height)) and not (iskeyword(@width)) and not (iskeyword(@height)) { - width: ~`@{width} + @{unit}`; - height: ~`@{height} + @{unit}`; + .process(@width, @height) when (ispixel(@height)), (isem(@height)), (ispercentage(@height)), (iskeyword(@height)) { + .kittens(@width) when (ispixel(@width)), (isem(@width)), (ispercentage(@width)), (iskeyword(@width)) {} + .kittens(@width) when not (ispixel(@width)) and not (isem(@width)) and not (ispercentage(@width)) and not (iskeyword(@width)) { + width: ~`@{width} + @{unit}`; + height: @height; + } + .kittens(@width); } - .process(@width, @height) when not (ispixel(@width)) and (ispixel(@height)), not (isem(@width)) and (isem(@height)), not (ispercentage(@width)) and (ispercentage(@height)), not (iskeyword(@width)) and (iskeyword(@height)) { + .process(@width, @height) when not (ispixel(@width)) and not (isem(@width)) and not (ispercentage(@width)) and not (iskeyword(@width)) and not (ispixel(@height)) and not (isem(@height)) and not (ispercentage(@height)) and not (iskeyword(@height)) { width: ~`@{width} + @{unit}`; - height: @height; - } - - .process(@width, @height) when (ispixel(@width)) and not (ispixel(@height)), (isem(@width)) and not (isem(@height)), (ispercentage(@width)) and not (ispercentage(@height)), (iskeyword(@width)) and not (iskeyword(@height)) { - width: @width; height: ~`@{height} + @{unit}`; } diff --git a/mixins/hyphens/hyphens.js b/mixins/hyphens/hyphens.js new file mode 100644 index 0000000..3fca633 --- /dev/null +++ b/mixins/hyphens/hyphens.js @@ -0,0 +1,21 @@ +/** + * Hyphens mixin + */ + +var hyphens = function hyphens(value) { + value = value || 'manual'; + + return value; +}; + +/** + * For which browsers is this mixin specified + */ + +hyphens.vendors = ['webkit','moz','ms']; + +/** + * Export mixin + */ + +module.exports = hyphens; \ No newline at end of file diff --git a/mixins/hyphens/hyphens.md b/mixins/hyphens/hyphens.md new file mode 100644 index 0000000..e9e17e9 --- /dev/null +++ b/mixins/hyphens/hyphens.md @@ -0,0 +1,25 @@ +### • hyphens +**Summary:** + +The hyphens CSS property tells the browser how to go about splitting words to improve the layout of text when line-wrapping. + +Resources: **[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/hyphens)** + +**Syntax:** + +Default value: manual + + .hyphens(none | manual | auto) + +**Example:** + + div { + .hyphens(none); + } + + // Result + div { + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + } diff --git a/mixins/hyphens/test.js b/mixins/hyphens/test.js new file mode 100644 index 0000000..470f5bc --- /dev/null +++ b/mixins/hyphens/test.js @@ -0,0 +1,9 @@ +var assert = require('assert'); + +describe('hyphens', function() { + + it('should return the same value', function(done) { + test.hyphens('none', 'none', done); + }); + +}); diff --git a/mixins/size/size.less b/mixins/size/size.less index 12dacd1..13dcd96 100644 --- a/mixins/size/size.less +++ b/mixins/size/size.less @@ -1,4 +1,4 @@ -.size(@square) { + .size(@square) { @unit: 'px'; .process(@square) when (ispixel(@square)), (isem(@square)), (ispercentage(@square)), (iskeyword(@square)) { width: @square; @@ -16,23 +16,29 @@ .size(@width, @height) { @unit: 'px'; - .process(@width, @height) when (ispixel(@width)) and (ispixel(@height)), (isem(@width)) and (isem(@height)), (ispercentage(@width)) and (ispercentage(@height)), (iskeyword(@width)) and (iskeyword(@height)) { - width: @width; - height: @height; + .process(@width, @height) when (ispixel(@width)), (isem(@width)), (ispercentage(@width)), (iskeyword(@width)) { + .kittens(@height) when (ispixel(@height)), (isem(@height)), (ispercentage(@height)), (iskeyword(@height)) { + width: @width; + height: @height; + } + .kittens(@height) when not (ispixel(@height)) and not (isem(@height)) and not (ispercentage(@height)) and not (iskeyword(@height)) { + width: @width; + height: ~`@{height} + @{unit}`; + } + .kittens(@height); } - .process(@width, @height) when not (ispixel(@width)) and not (ispixel(@height)) and not (isem(@width)) and not (isem(@height)) and not (ispercentage(@width)) and not (ispercentage(@height)) and not (iskeyword(@width)) and not (iskeyword(@height)) { - width: ~`@{width} + @{unit}`; - height: ~`@{height} + @{unit}`; + .process(@width, @height) when (ispixel(@height)), (isem(@height)), (ispercentage(@height)), (iskeyword(@height)) { + .kittens(@width) when (ispixel(@width)), (isem(@width)), (ispercentage(@width)), (iskeyword(@width)) {} + .kittens(@width) when not (ispixel(@width)) and not (isem(@width)) and not (ispercentage(@width)) and not (iskeyword(@width)) { + width: ~`@{width} + @{unit}`; + height: @height; + } + .kittens(@width); } - .process(@width, @height) when not (ispixel(@width)) and (ispixel(@height)), not (isem(@width)) and (isem(@height)), not (ispercentage(@width)) and (ispercentage(@height)), not (iskeyword(@width)) and (iskeyword(@height)) { + .process(@width, @height) when not (ispixel(@width)) and not (isem(@width)) and not (ispercentage(@width)) and not (iskeyword(@width)) and not (ispixel(@height)) and not (isem(@height)) and not (ispercentage(@height)) and not (iskeyword(@height)) { width: ~`@{width} + @{unit}`; - height: @height; - } - - .process(@width, @height) when (ispixel(@width)) and not (ispixel(@height)), (isem(@width)) and not (isem(@height)), (ispercentage(@width)) and not (ispercentage(@height)), (iskeyword(@width)) and not (iskeyword(@height)) { - width: @width; height: ~`@{height} + @{unit}`; } diff --git a/package.json b/package.json index d95f966..608053d 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "lesshat", "description": "Most advanced LESS CSS mixins library", - "version": "2.0.14", + "version": "2.0.15", "homepage": "http://lesshat.com/", "author": { "name": "Petr Brzek",