From 0d7045174d11025805d82f9c3c9100cc561eb40d Mon Sep 17 00:00:00 2001 From: Peter Ramsing Date: Tue, 15 Nov 2016 21:53:27 -0800 Subject: [PATCH 1/3] Makes the float: right in the waffle a param; --- lib/lost-waffle.js | 26 ++++++++++++++++++++------ test/lost-waffle.js | 26 ++++++++++++++++++++------ 2 files changed, 40 insertions(+), 12 deletions(-) diff --git a/lib/lost-waffle.js b/lib/lost-waffle.js index dbdb4edb..849bc40b 100644 --- a/lib/lost-waffle.js +++ b/lib/lost-waffle.js @@ -37,6 +37,7 @@ module.exports = function lostWaffleDecl(css, settings) { css.walkDecls('lost-waffle', function lostWaffleDeclFunction(decl) { var declArr = []; var lostWaffle; + var floatRight; var lostWaffleCycle; var lostWaffleRounder = settings.rounder; var lostWaffleGutter = settings.gutter; @@ -80,6 +81,10 @@ module.exports = function lostWaffleDecl(css, settings) { lostWaffleFlexbox = 'no-flex'; } + if (declArr.indexOf('float-right') !== -1) { + floatRight = true; + } + decl.parent.nodes.forEach(function lostWaffleRounderFunction(declaration) { if (declaration.prop === 'lost-waffle-rounder') { lostWaffleRounder = declaration.value; @@ -182,12 +187,21 @@ module.exports = function lostWaffleDecl(css, settings) { ); } - newBlock( - decl, - ':nth-child(' + lostWaffleCycle + 'n)', - ['margin-right', 'float'], - [0, 'right'] - ); + if (floatRight === true) { + newBlock( + decl, + ':nth-child(' + lostWaffleCycle + 'n)', + ['margin-right', 'float'], + [0, 'right'] + ); + } else { + newBlock( + decl, + ':nth-child(' + lostWaffleCycle + 'n)', + ['margin-right'], + [0] + ); + } } newBlock( diff --git a/test/lost-waffle.js b/test/lost-waffle.js index 299ce9f8..6b1d05d2 100644 --- a/test/lost-waffle.js +++ b/test/lost-waffle.js @@ -11,7 +11,7 @@ describe('lost-waffle', function() { 'a:nth-child(1n) { float: left; margin-right: 30px;' + ' margin-bottom: 30px; clear: none; }\n' + 'a:last-child { margin-right: 0; margin-bottom: 0; }\n' + - 'a:nth-child(3n) { margin-right: 0; float: right; }\n' + + 'a:nth-child(3n) { margin-right: 0; }\n' + 'a:nth-child(3n + 1) { clear: both; }\n' + 'a:nth-last-child(-n + 3) { margin-bottom: 0; }' ); @@ -25,7 +25,7 @@ describe('lost-waffle', function() { 'a:nth-child(1n) { float: left; margin-right: 30px;' + ' margin-bottom: 30px; clear: none; }\n' + 'a:last-child { margin-right: 0; margin-bottom: 0; }\n' + - 'a:nth-child(2n) { margin-right: 0; float: right; }\n' + + 'a:nth-child(2n) { margin-right: 0; }\n' + 'a:nth-child(2n + 1) { clear: both; }\n' + 'a:nth-last-child(-n + 2) { margin-bottom: 0; }' ); @@ -39,7 +39,7 @@ describe('lost-waffle', function() { 'a:nth-child(1n) { float: left; margin-right: 60px;' + ' margin-bottom: 60px; clear: none; }\n' + 'a:last-child { margin-right: 0; margin-bottom: 0; }\n' + - 'a:nth-child(2n) { margin-right: 0; float: right; }\n' + + 'a:nth-child(2n) { margin-right: 0; }\n' + 'a:nth-child(2n + 1) { clear: both; }\n' + 'a:nth-last-child(-n + 2) { margin-bottom: 0; }' ); @@ -54,7 +54,7 @@ describe('lost-waffle', function() { 'a:nth-child(1n) { float: left; margin-right: 30px;' + ' margin-bottom: 30px; clear: none; }\n' + 'a:last-child { margin-right: 0; margin-bottom: 0; }\n' + - 'a:nth-child(3n) { margin-right: 0; float: right; }\n' + + 'a:nth-child(3n) { margin-right: 0; }\n' + 'a:nth-child(3n + 1) { clear: left; }\n' + 'a:nth-last-child(-n + 3) { margin-bottom: 0; }' ); @@ -78,6 +78,19 @@ describe('lost-waffle', function() { check( 'a { lost-waffle: 2/5 3 0 no-flex; }', + 'a { width: calc(99.9% * 2/5); height: calc(99.9% * 2/5); }\n' + + 'a:nth-child(1n) { float: left; margin-right: 0; margin-bottom: 0; clear: none; }\n' + + 'a:last-child { margin-right: 0; margin-bottom: 0; }\n' + + 'a:nth-child(3n) { margin-right: 0; }\n' + + 'a:nth-child(3n + 1) { clear: both; }\n' + + 'a:nth-last-child(-n + 3) { margin-bottom: 0; }' + ); + }); + + it('supports float-right', function() { + check( + 'a { lost-waffle: 2/5 3 0 no-flex float-right; }', + 'a { width: calc(99.9% * 2/5); height: calc(99.9% * 2/5); }\n' + 'a:nth-child(1n) { float: left; margin-right: 0; margin-bottom: 0; clear: none; }\n' + 'a:last-child { margin-right: 0; margin-bottom: 0; }\n' + @@ -86,6 +99,7 @@ describe('lost-waffle', function() { 'a:nth-last-child(-n + 3) { margin-bottom: 0; }' ); }); + describe('allows for customizable rounders', function() { it('100%', function() { check( @@ -94,7 +108,7 @@ describe('lost-waffle', function() { 'a { width: calc(100% * 2/5); height: calc(100% * 2/5); }\n' + 'a:nth-child(1n) { float: left; margin-right: 0; margin-bottom: 0; clear: none; }\n' + 'a:last-child { margin-right: 0; margin-bottom: 0; }\n' + - 'a:nth-child(3n) { margin-right: 0; float: right; }\n' + + 'a:nth-child(3n) { margin-right: 0; }\n' + 'a:nth-child(3n + 1) { clear: both; }\n' + 'a:nth-last-child(-n + 3) { margin-bottom: 0; }' ); @@ -107,7 +121,7 @@ describe('lost-waffle', function() { 'a { width: calc(99.99999999999% * 2/5); height: calc(99.99999999999% * 2/5); }\n' + 'a:nth-child(1n) { float: left; margin-right: 0; margin-bottom: 0; clear: none; }\n' + 'a:last-child { margin-right: 0; margin-bottom: 0; }\n' + - 'a:nth-child(3n) { margin-right: 0; float: right; }\n' + + 'a:nth-child(3n) { margin-right: 0; }\n' + 'a:nth-child(3n + 1) { clear: both; }\n' + 'a:nth-last-child(-n + 3) { margin-bottom: 0; }' ); From e48d4f68caa37d50dc8d208a03344c45d5fb214a Mon Sep 17 00:00:00 2001 From: Peter Ramsing Date: Wed, 16 Nov 2016 20:19:13 -0800 Subject: [PATCH 2/3] Adds note in file about new param --- lib/lost-waffle.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/lib/lost-waffle.js b/lib/lost-waffle.js index 849bc40b..4135a359 100644 --- a/lib/lost-waffle.js +++ b/lib/lost-waffle.js @@ -22,6 +22,8 @@ var lgLogic = require('./_lg-logic'); * certain elements to have a particularly large or small gutter (pass 0 * for no gutter at all). * + * @param {string} [float] - Tells whether or not the cycle should float right + * * @param {string} [flex|no-flex] - Determines whether this element should * use Flexbox or not. * From 9e250238c95e245ba0a47356c5ea1aea9e5df67a Mon Sep 17 00:00:00 2001 From: Peter Ramsing Date: Wed, 16 Nov 2016 20:21:49 -0800 Subject: [PATCH 3/3] Updates note with correct param --- lib/lost-waffle.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/lost-waffle.js b/lib/lost-waffle.js index 4135a359..b9768e46 100644 --- a/lib/lost-waffle.js +++ b/lib/lost-waffle.js @@ -22,7 +22,7 @@ var lgLogic = require('./_lg-logic'); * certain elements to have a particularly large or small gutter (pass 0 * for no gutter at all). * - * @param {string} [float] - Tells whether or not the cycle should float right + * @param {string} [float-right] - Tells whether or not the cycle should float right * * @param {string} [flex|no-flex] - Determines whether this element should * use Flexbox or not.