diff --git a/lib/less/functions.js b/lib/less/functions.js index 06361aa3..b2b48bd2 100644 --- a/lib/less/functions.js +++ b/lib/less/functions.js @@ -84,10 +84,7 @@ tree.functions = { return new(tree.Dimension)(color.toHSL().a); }, luma: function (color) { - return new(tree.Dimension)(Math.round((0.2126 * (color.rgb[0]/255) + - 0.7152 * (color.rgb[1]/255) + - 0.0722 * (color.rgb[2]/255)) * - color.alpha * 100), '%'); + return new(tree.Dimension)(Math.round(color.luma() * color.alpha * 100), '%'); }, saturate: function (color, amount) { var hsl = color.toHSL(); @@ -184,12 +181,18 @@ tree.functions = { if (typeof dark === 'undefined') { dark = this.rgba(0, 0, 0, 1.0); } + //Figure out which is actually light and dark! + if (dark.luma() > light.luma()) { + var t = light; + light = dark; + dark = t; + } if (typeof threshold === 'undefined') { threshold = 0.43; } else { threshold = number(threshold); } - if (((0.2126 * (color.rgb[0]/255) + 0.7152 * (color.rgb[1]/255) + 0.0722 * (color.rgb[2]/255)) * color.alpha) < threshold) { + if ((color.luma() * color.alpha) < threshold) { return light; } else { return dark; diff --git a/lib/less/tree/color.js b/lib/less/tree/color.js index 5e20a71d..48597f99 100644 --- a/lib/less/tree/color.js +++ b/lib/less/tree/color.js @@ -24,6 +24,7 @@ tree.Color = function (rgb, a) { }; tree.Color.prototype = { eval: function () { return this }, + luma: function () { return (0.2126 * this.rgb[0] / 255) + (0.7152 * this.rgb[1] / 255) + (0.0722 * this.rgb[2] / 255); }, // // If we have some transparency, the only way to represent it diff --git a/test/css/functions.css b/test/css/functions.css index 3268d780..ce4002aa 100644 --- a/test/css/functions.css +++ b/test/css/functions.css @@ -34,6 +34,7 @@ contrast-cyan: #000000; contrast-light: #111111; contrast-dark: #eeeeee; + contrast-wrongorder: #111111; contrast-light-thresh: #111111; contrast-dark-thresh: #eeeeee; contrast-high-thresh: #eeeeee; diff --git a/test/less/functions.less b/test/less/functions.less index 9e509e9e..709e2d36 100644 --- a/test/less/functions.less +++ b/test/less/functions.less @@ -38,6 +38,7 @@ contrast-cyan: contrast(#00ffff); contrast-light: contrast(#fff, #111111, #eeeeee); contrast-dark: contrast(#000, #111111, #eeeeee); + contrast-wrongorder: contrast(#fff, #eeeeee, #111111, 0.5); contrast-light-thresh: contrast(#fff, #111111, #eeeeee, 0.5); contrast-dark-thresh: contrast(#000, #111111, #eeeeee, 0.5); contrast-high-thresh: contrast(#555, #111111, #eeeeee, 0.6);