sass-planifolia

commit

ee28d6a12e2913191b2896f7721684d4dc5c1ed7

parent

56a073ac917782bbd43e679693871ca2a73c3398

Author

Tobias Bengfort <tobias.bengfort@gmx.net>

Date

2016-07-06 05:23

grid: rm gutter position to reduce complexity

Diffstat

2 files changed, 4 insertions, 45 deletions

diff --git a/sass/grid.scss b/sass/grid.scss

@@ -56,13 +56,10 @@
   56    56 /// @prop {width} gutter [1rem] - Gutter width.
   57    57 /// @prop {width} gutter-fallback [2%] - Gutter width if `calc()` is
   58    58 ///   not available. Must be a percentage.
   59    -1 /// @prop {string} gutter-position ['inside'] - Position of gutters.
   60    -1 ///   One of 'inside', 'outside'.
   61    59 $grid: (
   62    60   'columns': 12,
   63    61   'gutter': 1rem,
   64    62   'gutter-fallback': 2%,
   65    -1   'gutter-position': 'inside',
   66    63 );
   67    64 
   68    65 @function _grid-get($key, $settings: ()) {
@@ -86,47 +83,19 @@ $grid: (
   86    83 }
   87    84 
   88    85 @function _grid-width($w, $gutter, $settings) {
   89    -1   $gutter-position: _grid-get('gutter-position', $settings);
   90    -1 
   91    -1   @if $gutter-position == 'inside' {
   92    -1     @return (100% + $gutter) * $w - $gutter;
   93    -1   } @else if $gutter-position == 'outside' {
   94    -1     @return (100% - $gutter) * $w - $gutter;
   95    -1   } @else {
   96    -1     @error 'invalid grid-gutter-position "#{$gutter-position}"! Choose one of "inside", "outside".';
   97    -1   }
   -1    86   @return (100% + $gutter) * $w - $gutter;
   98    87 }
   99    88 
  100    89 @function _grid-width-mixed($w, $gutter, $settings) {
  101    -1   $gutter-position: _grid-get('gutter-position', $settings);
  102    -1 
  103    -1   @if $gutter-position == 'inside' {
  104    -1     @return calc((100% + #{$gutter}) * #{$w} - #{$gutter});
  105    -1   } @else if $gutter-position == 'outside' {
  106    -1     @return calc((100% - #{$gutter}) * #{$w} - #{$gutter});
  107    -1   }
   -1    90   @return calc((100% + #{$gutter}) * #{$w} - #{$gutter});
  108    91 }
  109    92 
  110    93 @function _grid-position($p, $gutter, $settings) {
  111    -1   $gutter-position: _grid-get('gutter-position', $settings);
  112    -1 
  113    -1   @if $gutter-position == 'inside' {
  114    -1     @return (100% + $gutter) * $p;
  115    -1   } @else if $gutter-position == 'outside' {
  116    -1     @return (100% - $gutter) * $p + $gutter;
  117    -1   } @else {
  118    -1     @error 'invalid grid-gutter-position "#{$gutter-position}"! Choose one of "inside", "outside".'
  119    -1   }
   -1    94   @return (100% + $gutter) * $p;
  120    95 }
  121    96 
  122    97 @function _grid-position-mixed($p, $gutter, $settings) {
  123    -1   $gutter-position: _grid-get('gutter-position', $settings);
  124    -1 
  125    -1   @if $gutter-position == 'inside' {
  126    -1     @return calc((100% + #{$gutter}) * #{$p});
  127    -1   } @else if $gutter-position == 'outside' {
  128    -1     @return calc((100% - #{$gutter}) * #{$p} + #{$gutter});
  129    -1   }
   -1    98   @return calc((100% + #{$gutter}) * #{$p});
  130    99 }
  131   100 
  132   101 /// Atomic width mixin.

diff --git a/test/grid.js b/test/grid.js

@@ -45,11 +45,6 @@ describe('grid', function() {
   45    45       shared.declares(call, 'width', 'calc((100% + 1rem) * .125 - 1rem)');
   46    46       shared.declares(call, 'width', '10.75%');
   47    47     });
   48    -1     it('uses gutter-position setting', function() {
   49    -1       var call = sassaby.includedMixin('grid-width').calledWithArgs('1', '(gutter-position: "outside")');
   50    -1       shared.declares(call, 'width', 'calc((100% - 1rem) * .08333 - 1rem)');
   51    -1       shared.declares(call, 'width', '6.16667%');
   52    -1     });
   53    48   });
   54    49 
   55    50   describe('grid-position', function() {
@@ -81,10 +76,5 @@ describe('grid', function() {
   81    76       shared.declares(call, 'margin-left', 'calc((100% + 1rem) * .125)');
   82    77       shared.declares(call, 'margin-left', '12.75%');
   83    78     });
   84    -1     it('uses gutter-position setting', function() {
   85    -1       var call = sassaby.includedMixin('grid-position').calledWithArgs('1', '(gutter-position: "outside")');
   86    -1       shared.declares(call, 'margin-left', 'calc((100% - 1rem) * .08333+1rem)');
   87    -1       shared.declares(call, 'margin-left', '10.16667%');
   88    -1     });
   89    79   });
   90    80 });